2023年12月14日
html5的video标签实现对m3u8格式视频(HLS)的支持 亲测可用
在切图网一个项目切图中遇到的，网页中嵌入视频 理所当然用html5自带的video标签即可实现，也有比较主流的插件videojs，但是这个比较特别播放的视频是m3u8格式的 （这种好像imac safari下用的多），这种情况需要添加额外的支持，好在hls.min.js可以实现。附代码 亲测可用
html5的video标签实现对HLS(m3u8格式)的支持 亲测可用
-
<script src=“https://cdn.jsdelivr.net/hls.js/latest/hls.min.js”></script>
-
<video id=“video”></video>
-
<script>
-
if(Hls.isSupported()) {
-
var video = document.getElementById(‘video’);
-
var hls = new Hls();
-
hls.loadSource(‘http://www.streambox.fr/playlists/test_001/stream.m3u8’);
-
hls.attachMedia(video);
-
hls.on(Hls.Events.MANIFEST_PARSED,function() {
-
video.play();
-
});
-
}
-
</script>
标签：HLS, hls.min.js, video, Videojs, 视频
关注“qietuwang”微信公众号，获取一手干货内容推送
本文由切图网原创，转载请保留版权：
html5的video标签实现对m3u8格式视频(HLS)的支持 亲测可用
https://www.qietu.com/cn/html5-video-HLSm3u8/
微信扫一扫二维码访问
