HTML 代码示例：使用 JavaScript 播放 M3U8 格式视频
<!DOCTYPE html>
<html>
<head>
<title>播放 M3U8 格式视频</title>
<script src='https://cdn.jsdelivr.net/npm/hls.js@latest'></script>
</head>
<body>
<video id='videoPlayer' controls></video>
<script>
// 从数据库中获取 m3u8 链接
// 假设从数据库中获取的链接为 m3u8Url
var m3u8Url = 'http://example.com/video.m3u8';
// 创建 video 元素
var video = document.getElementById('videoPlayer');
// 设置 video 的 src 为 m3u8 链接
video.src = m3u8Url;
// 使用 HLS.js 库播放 m3u8 格式视频
if (Hls.isSupported()) {
var hls = new Hls();
hls.loadSource(m3u8Url);
hls.attachMedia(video);
hls.on(Hls.Events.MANIFEST_PARSED, function() {
video.play();
});
} else if (video.canPlayType('application/vnd.apple.mpegurl')) {
video.src = m3u8Url;
video.addEventListener('loadedmetadata', function() {
video.play();
});
}
</script>
</body>
</html>
<p>请注意，上述示例中使用了 HLS.js 库来播放 m3u8 格式视频。你需要在代码中引入 HLS.js 库文件，例如：</p>
<pre><code class="language-html"><script src='https://cdn.jsdelivr.net/npm/hls.js@latest'></script>
</code></pre>
<p>另外，要使 m3u8 文件拖入数据库就能播放，你需要在后端进行相应的处理，将文件保存到数据库并从数据库中获取链接。以上示例仅演示了在前端如何使用 m3u8 链接播放视频。</p>
原文地址: https://www.cveoy.top/t/topic/p7I5 著作权归作者所有。请勿转载和采集!