网页嵌入 M3U8 播放器的方法

目录

  1. iframe 嵌入(最简单)
  2. hls.js 自建播放器
  3. 注意事项

iframe 嵌入(最简单)

使用本站提供的嵌入播放器,一行代码即可集成:

<iframe src="https://m3u8.aixmb.cn/player.html?url=你的m3u8地址"
  width="100%" height="480" frameborder="0" allowfullscreen></iframe>

把 url 参数替换为实际的 m3u8 地址即可,无需其他配置。

hls.js 自建播放器

如果需要自定义播放器外观和行为,可使用 hls.js:

<script src="https://cdn.jsdelivr.net/npm/hls.js"></script>
<video id="video" controls style="width:100%"></video>
<script>
  var video = document.getElementById('video');
  var hls = new Hls();
  hls.loadSource('https://example.com/index.m3u8');
  hls.attachMedia(video);
</script>

注意事项

更多内容可参考 如何在浏览器中播放 M3U8 视频。