如何在手机和桌面上播放html5视频播放m3U8？
Posted
技术标签:
【中文标题】如何在手机和桌面上播放html5视频播放m3U8？【英文标题】：How to play html5 video play m3U8 on mobile and desktop? 【发布时间】：2014-06-16 18:38:16 【问题描述】：我有 HLS m3u8，它在 ios 和 android 上运行良好，带有 html5 <video>
但不能在台式电脑或台式机 MAC（Chrome、Firefox）上播放
如何在台式电脑上玩 m3u8？
是否有可以在桌面和移动设备上播放的视频流格式？
【问题讨论】：
这能回答你的问题吗？ Hls video streaming on iOS/Safari 【参考方案1】：在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>
一旦manifest被解析，你就可以使用原始html5视频元素的所有常规事件、属性和方法了。
您可以在这里找到他们的演示：https://video-dev.github.io/hls.js/demo/
【讨论】：
loadSource() 函数给我空值【参考方案2】：HLS 仅适用于 Mac OS Safari 6+ 的桌面。看看这里for reference。
对于桌面上的 HTML5 视频，您可以考虑使用 MPEG DASH。它有一个JS lib，可以在以下浏览器上实时和点播：
截至 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 流。
【讨论】：
【参考方案3】：我知道答案有点晚了，但我一直在寻找这些信息，但在 *** 上找不到好的答案...
据我所知，没有一种格式可以开箱即用地适用于移动设备和桌面设备。如果您想节省转码能力并且只使用一种格式，我推荐 HLS，因为它可以在移动设备上完美运行，并且您可以使用免费库在浏览器中显示视频。
https://github.com/videojs/videojs-contrib-hls 有一个使用 videojs 的工作示例。它在 Safari 中使用 HTML5 并在其他浏览器上回退到 flash。如果您想了解其他玩家，请查看https://github.com/mangui/flashls 了解更多示例
【讨论】：
【参考方案4】：<html>
<body>
<video controls>
<source src="index.m3u8" type="application/x-mpegURL">
</video>
</body>
</html>
使用上述代码流式传输 HLS 或 m3u8 文件。 它适用于边缘浏览器、chrome、opera mini（移动浏览器）（不适用于 pc chrome）
要在所有浏览器上播放，请使用基于 Flash 的媒体播放器。 media player to support all browser
【讨论】：
【参考方案5】：Safari 是唯一支持 HLS 的桌面浏览器。
编辑：danrossi 为支持 HLS 但不是 HTML5 的 Flash 版本的 Flowplayer 制作了一个插件。在这里阅读更多：http://justhackme.wordpress.com/2013/03/10/apples-http-live-streaming-in-flash/
【讨论】：
以上是关于如何在手机和桌面上播放html5视频播放m3U8？的主要内容，如果未能解决你的问题，请参考以下文章