19

我有 HLS m3u8，可以在 IOS 和 Android 上使用 html5 运行良好<video>

但不能在台式电脑或台式机 MAC（Chrome、Firefox）上播放

如何在台式电脑上玩 m3u8？

是否有可以在台式机和移动设备上播放的视频流格式？

4

5 回答 5

28

看看https://github.com/video-dev/hls.js/上的 hls.js 项目， 它正好解决了这个问题。

这是一个关于如何使用它的小示例。

<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
<video id="video"></video>
<script>
  if(Hls.isSupported()) {
    var video = document.getElementById('video');
    var hls = new Hls();
    hls.loadSource('https://video-dev.github.io/streams/x36xhzz/x36xhzz.m3u8');
    hls.attachMedia(video);
    hls.on(Hls.Events.MANIFEST_PARSED,function() {
      video.play();
  });
 }
</script>

解析清单后，您可以使用原始 html5 视频元素的所有常规事件、属性和方法。

你可以在这里找到他们的演示：https ://video-dev.github.io/hls.js/demo/

于 2017-11-13T08:41:45.580 回答
14

HLS 仅适用于 Mac OS Safari 6+ 的桌面。看看这里以供参考。

对于桌面上的 HTML5 视频，您可以考虑使用 MPEG DASH。它有一个JS 库，可以在以下浏览器中实时和按需运行：

截至 2013 年 8 月 30 日，仅支持桌面 Chrome、桌面 Internet Explorer 11 和适用于 Android 的 Mobile Chrome Beta 的浏览器。

如果您希望通过自适应流技术实现更广泛的浏览器/设备覆盖范围，您将需要考虑使用支持 RTMP 和 HDS 的 Flash 或具有平滑流处理的 Silverlight（我应该说 Flash 具有更好的覆盖范围）。

如今，大多数媒体公司都使用混合方法 Flash（HDS/RTMP - 桌面）/HTML5（HLS - 移动），预先在设备上使用 JavaScript 检查可以读取的内容并提供相应的播放器/流媒体协议。

仅供参考，您可以在 Windows 桌面上使用 VLC 等软件播放 HLS 流。

于 2014-04-30T12:38:11.057 回答
4

我知道答案有点晚了，但我一直在寻找这些信息，但在 stackoverflow 上找不到好的答案......

据我所知，没有适用于移动和桌面的开箱即用格式。如果您想节省转码能力并且只使用一种格式，我推荐 HLS，因为它可以在移动设备上完美运行，您可以使用免费库在浏览器中显示视频。

https://github.com/videojs/videojs-contrib-hls有一个使用 videojs 的工作示例。它在 Safari 中使用 HTML5 并在其他浏览器上回退到 flash。如果您想到其他玩家，请查看https://github.com/mangui/flashls以获取更多示例

于 2015-01-31T06:02:52.637 回答
3 
<html>
<body>
    <video width="600" height="400" controls>
        <source src="index.m3u8" type="application/x-mpegURL">
    </video>
</body> 
</html>

使用上述代码流式传输 HLS 或 m3u8 文件。它适用于边缘浏览器、chrome、opera mini（移动浏览器）（不适用于 pc chrome）

要在所有浏览器上播放，请使用基于 Flash 的媒体播放器。 支持所有浏览器的媒体播放器

于 2017-01-03T10:44:15.397 回答
1

Safari 是唯一支持 HLS 的桌面浏览器。

编辑：danrossi 为支持 HLS 但不是 HTML5 的 Flash 版本的 Flowplayer 制作了一个插件。在这里阅读更多：http: //justhackme.wordpress.com/2013/03/10/apples-http-live-streaming-in-flash/

于 2014-04-30T12:34:26.113 回答