Videojs HLS 不工作
Posted
技术标签:
【中文标题】Videojs HLS 不工作【英文标题】：Videojs HLS not working 【发布时间】：2014-10-03 15:34:19 【问题描述】：我正在尝试通过 videojs 流式传输 HLS 媒体，但它不起作用。
我知道桌面浏览器不支持 HLS，但它也不适用于 android/ios 设备...
我收到一个错误：找不到此视频的兼容来源
任何人都可以查看我的代码并发现任何错误吗？
Streams 正在我的本地服务器上运行，并使用 VLC 进行了测试，因此问题一定出在我的 videojs 配置中。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Test</title>
<link href="http://belelros.github.io/videojs-playLists/css/main.css" rel="stylesheet">
<link href="http://belelros.github.io/videojs-playLists/css/normalize.css" rel="stylesheet">
<link href='http://fonts.googleapis.com/css?family=Rokkitt' rel='stylesheet' type='text/css'>
<link href="//vjs.zencdn.net/4.9/video-js.css" rel="stylesheet">
<script src="//vjs.zencdn.net/4.9/video.js"></script>
<script src="https://rawgithub.com/Belelros/videojs-playLists/master/lib/videojs-playlists.js" data-cover></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="main.js"></script>
</head>
<div class="video-holder centered">
<video id="video" class="video-js vjs-default-skin"
controls preload="auto"
data-setup=''
poster="">
</video>
<div class="playlist-components">
<script>
var videos = [
src : [
'http://192.168.1.165/streamtest1.m3u8'
],
poster : 'images/bbc_news.png',
title : 'BBC WORLD NEWS'
,
src : [
'http://192.168.1.165/streamtest2.m3u8'
],
poster : 'images/al_jazeera_english.png',
title : 'AL JAZEERA'
,
src : [
'http://192.168.1.165/streamtest3.m3u8'
],
poster : 'images/viasat_explore.png',
title : 'Viasat Explore'
];
</script>
<div class="playlist">
<ul></ul>
</div>
</div>
</div>
</body>
</html>
我正在使用 videojs 的播放列表插件 https://github.com/jgallen23/videojs-playLists
也许我应该在某处定义视频类型？
【问题讨论】：
当我删除播放列表并仅使用一个来源时，它可以正常工作。我修复了它，在 videojs-playlist.js 中添加了 m3u8 扩展
player.pl._guessVideoType = function(video)
var videoTypes =
'webm' : 'video/webm',
'mp4' : 'video/mp4',
'm3u8' : 'application/x-mpegURL',
'ogv' : 'video/ogg'
;
【讨论】：
【参考方案2】：请使用以下添加 hls 支持
npm install --save videojs-contrib-hls.js
或 包含来自 CDN 的 videojs-contrib-hls.js。
https://unpkg.com/videojs-contrib-hls.js@3.2.0/dist/videojs-contrib-hlsjs.min.js
【讨论】：
【参考方案3】：使用 video.js 播放 HLS、DASH 和未来的 HTTP 流协议，即使它们本身不受支持。
默认包含在 video.js 7 中！
have a look here
【讨论】：
您的答案可以通过额外的支持信息得到改进。请编辑以添加更多详细信息，例如引用或文档，以便其他人可以确认您的答案是正确的。您可以在帮助中心找到更多关于如何写出好的答案的信息。 ——以上是关于Videojs HLS 不工作的主要内容，如果未能解决你的问题，请参考以下文章
解决问题video.js 播放m3u8格式的文件,根据官方的文档添加videojs-contrib-hls也不行的原因解决了
使用videojs进行实时流式传输的CORS和请求标头错误[重复]