TS 文件不播放 hls.js
Posted
技术标签:
【中文标题】TS 文件不播放 hls.js【英文标题】:TS file not playing hls.js 【发布时间】:2019-08-22 05:17:18 【问题描述】:需要帮助。视频在浏览器中加载,但从未开始播放。我正在使用 hls.js 将 m3u8 播放列表流式传输到浏览器。我使用 FFmpeg 创建 ts 和 m3u8 文件。
对于 FFmpeg:
./ffmpeg -rtsp_transport tcp -i rtsp://user:password@ipaddress/axis-media/media.amp -vcodec copy -hls_time 4 -hls_list_size 4 -hls_wrap 4 -start_number 1 -y test.m3u8
html 代码:
<!DOCTYPE html>
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
</head>
<body>
<video id="video" ></video>
<body>
<script>
var video = document.getElementById('video');
if(Hls.isSupported())
var hls = new Hls();
hls.loadSource('/images/live/test.m3u8');
hls.attachMedia(video);
hls.on(Hls.Events.MANIFEST_PARSED,function()
video.play();
);
else if (video.canPlayType('application/vnd.apple.mpegurl'))
video.src = '/images/live/test.m3u8';
video.addEventListener('loadedmetadata',function()
video.play();
);
</script>
</html>
【问题讨论】:
根据您使用的浏览器,可能只是阻止自动播放的问题。如果将播放器控件添加到视频元素 ,重新加载页面并按播放,是否有帮助? 即使我添加了video标签的控件,它也不播放播放列表。 你用什么浏览器测试这个?它的控制台有什么错误吗?你说你的流加载了,但是如果你直接在 hls.js 演示播放器中尝试here,你能确认它可以播放吗?请注意,流需要通过 https 传递,演示页面才能正常工作。 控制台没有错误。我正在使用谷歌浏览器最新版本。是的,它通过检查检查网络来加载。 我在 github 上发布了这个问题。 @tbucher 请检查此github.com/video-dev/hls.js/issues/2346 【参考方案1】:只需将 ffmpeg 命令行更改为: ffmpeg -rtsp_transport tcp -i rtsp://user:password@ip_address/axis-media/media.amp -y -s 854x480 -codec:v libx264 -b:v 800000 -hls_time 4 -hls_list_size 4 -hls_wrap 4 start_number 0 test .m3u8
【讨论】:
【参考方案2】:您的代码有两个问题。
播放需要鼓风机允许音频自动显示
NotAllowedError:用户代理不允许播放方法或 当前上下文中的平台,可能是因为用户拒绝 权限。
hls.js 无法访问它的地图文件
请求失败,状态为 404 网址:hls.min.js.map
改成可行的cdn就行了
<!DOCTYPE html>
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/hls.js"></script>
</head>
<body>
<video id="video" ></video>
<body>
<script>
var video = document.getElementById('video');
if(Hls.isSupported())
var hls = new Hls();
hls.loadSource('http://vfile1.grtn.cn/2018/1542/0254/3368/154202543368.ssm/154202543368.m3u8');
hls.attachMedia(video);
hls.on(Hls.Events.MANIFEST_PARSED,function()
video.play();
);
else if (video.canPlayType('application/vnd.apple.mpegurl'))
video.src = 'http://vfile1.grtn.cn/2018/1542/0254/3368/154202543368.ssm/154202543368.m3u8';
video.addEventListener('loadedmetadata',function()
video.play();
);
</script>
</html>
【讨论】:
以上是关于TS 文件不播放 hls.js的主要内容,如果未能解决你的问题,请参考以下文章