HTML5 m3u8 在线播放器 - 代码示例及实现方法
<!DOCTYPE html>
<html>
<head>
<title>m3u8 在线播放器 - 使用 Hls.js 实现</title>
</head>
<body>
<video id="video-player" controls></video>
<script>
// 获取video元素
var video = document.getElementById('video-player');
// 定义m3u8播放地址
var m3u8Url = 'https://example.com/video.m3u8';
// 使用Hls.js加载m3u8播放器
if (Hls.isSupported()) {
var hls = new Hls();
hls.loadSource(m3u8Url);
hls.attachMedia(video);
} else if (video.canPlayType('application/vnd.apple.mpegurl')) {
video.src = m3u8Url;
}
</script>
</body>
</html>
<p>在上面的示例中，我们使用了 Hls.js 库来加载和播放 m3u8 文件。首先，我们获取 video 元素，然后定义 m3u8 播放地址。如果浏览器支持 Hls.js，则创建一个 Hls 实例，加载 m3u8 播放地址，并将其附加到 video 元素上。否则，我们检查浏览器是否支持直接播放 m3u8 文件类型，如果支持，则直接将 m3u8 播放地址赋值给 video 元素的 src 属性。</p>
<p>请注意，这只是一个基本的示例，你可以根据自己的需求进行扩展和定制。还可以添加其他控制按钮、样式等来提升用户体验。</p>
原文地址: https://www.cveoy.top/t/topic/p7KG 著作权归作者所有。请勿转载和采集!