使用HTML5播放HLS视频

Question

我正在尝试在HTML5上播放HLS流，而不使用Flash。我们尝试了许多视频播放器，但它们都依赖于Flash播放器。我的问题是，是否有可能在HTML5上播放HLS流（任何流），而不使用Flash？

（我知道https://github.com/RReverser/mpegts，但它在移动设备上无法工作，并且非常卡顿。）

- Dallox

---

Clappr似乎是更好的选择。我将其作为评论发布，供像我这样正在寻找HTML5 HLS播放器的人使用。 - Cerlin

Answer 1

HLS.js项目现在非常可靠 (https://github.com/video-dev/hls.js/tree/master)。它受到最新版本浏览器的支持，不依赖Flash，并且可以在flowplayer中使用。

hls.js兼容支持MSE和“video/MP4”输入的浏览器，可用于：

• Chrome for Android 34+
• Chrome for Desktop 34+
• Firefox for Android 41+
• Firefox for Desktop 42+
• IE11+ for Windows 8.1+
• Edge for Windows 10+
• Opera for Desktop
• Vivaldi for Desktop
• Safari for Mac 8+ (beta)

- jolumg

Answer 2

HLS并不被所有浏览器支持。我使用的jwPlayer支持Flash和HTML5流媒体（当可用时）。遗憾的是，HLS流媒体仍然需要依赖Flash才能在各种浏览器中正常工作。请参阅HTML5 HLS浏览器支持：http://www.jwplayer.com/html5/hls/

- Sixthpoint

---

但是它是否有任何可能支持它呢？比如用JavaScript剥离流并播放h264视频？ - Dallox

RReverser有一个有趣的实现，但在JavaScript中进行转换会对浏览器产生很大的负担（因此在移动设备上会出现延迟）。我认为你的解决方案不应该依赖JavaScript来完成繁重的工作。许多网站使用流媒体引擎，可以提供各种格式（hls、rtmp、mpeg-dash）以尽可能地覆盖使用HTML5的浏览器。然后再切换到Flash作为备用方案。所以回答你的问题，这是可能的。但我认为这可能不值得。 - Sixthpoint

这将是一个开源项目，我认为对其他人来说肯定是值得的。依赖服务器来完成工作对我们来说不是一个解决方案，所以我想我们必须采取转换的方式。 - Dallox

听起来像是一个很棒的开源项目。在未来，这对人们来说可能非常有用。祝你好运！ - Sixthpoint

Answer 3

据我所知，目前没有成熟稳定的开源HLS HTML5播放器。但是有两个商业化的选择：

• Viblast Player - 价格非常便宜且相对容易使用。这只是一个最基本的HLS HTML5播放器，开发者需要自己创建UI或者将其与Video.js /Flowplayer/JWPlayer集成。
• Theo Player - 我对此没有太多经验。定价不公开。演示看起来还不错，甚至可以在大多数版本的Firefox上使用。

这两个播放器都依赖于MSE API，并且无法在不支持它的浏览器（IE <= 10，Firefox）上工作。

- Svetlin Mladenov

---

THEOplayer实际上不需要MSE。它也可以在Firefox，IE10，Opera等浏览器上运行。 - MrP

Answer 4

基本上所有的HTML5播放器都需要将MPEG2-TS（传输流）分段转换为MP4，因为大多数浏览器不支持原生的MPEG2-TS。

实际上有一些可以播放HLS流的HTML5播放器可用。其中一个例子是Bitmovin Player，它提供专业支持以及针对旧版浏览器的回退。这是一个商业产品，但他们也提供免费计划。 同时，像hls.js这样的开源项目也是可用的。

然而，随着苹果公司在今年WWDC大会上的宣布，现在也可以使用HLS与MP4片段，这消除了转换的必要性。如何实现以及优点的更多细节在这篇文章中有很好地概述。不确定哪些播放器支持它，至少苹果在iOS 10和macOS上的Safari本地实现；Bitmovin已经支持。

- Daniel

Answer 5

THEOplayer 对于这种情况非常有趣。它们允许使用HLS流式传输到所有流行的浏览器和平台，而无需使用Flash。

他们支持Windows、Linux、Mac、iOS、Android和Windows Phone上的Internet Explorer、Firefox、Chrome、Opera和Safari。

此外，与早期的答案相反，它们不依赖MSE来运行。因此，该播放器适用于所有平台，甚至是旧版IE（10及以上）和不支持MSE的浏览器。

- MrP

---

但我很好奇，他们是如何实现这一切的？是与 Emscripten 结合使用 C++ 解码器吗？ - Dallox

它们似乎使用浏览器内部的硬件支持，所有解码都在浏览器本身中进行。这似乎不是 Emscripten。Emscripten 可能会太慢（请参见 broadway.js 项目）。 - MrP