如何在videojs上播放HLS Wowza直播流（m3u8）

Question

我正在尝试使用html5视频标签播放h264编码的直播流。直播流是由wowza媒体服务器广播的，当访问src链接时，我可以得到有效的播放列表文件。但在尝试使用Android Chrome浏览器播放流时，播放器没有反应并显示黑屏。

这是html5视频标签相关问题还是广播者的问题？

- user2656834

Answer 1

目前，当前的videojs只支持Safari和iOS上的m3u8/HLS。Android应该支持HLS或Cupertino流媒体，但我听说有些问题。为了使HLS和m3u8在videojs中工作，您需要为videojs提供一个支持HLS的Flash回退。

查看此示例http://flashls.org/videojs/flash_demo.html

要自己实现，请按照此指南进行操作， 或下载此swf 然后将此代码添加到您的videojs页面。

<script>
  videojs.options.flash.swf = "[YourHosted]/video-js.swf"
</script>

...

<video id="example_video_1" class="video-js vjs-default-skin" controls preload="none" width="640" height="360" data-setup='{"techOrder": ["flash"]}'>
  <source src="http://[Wowza Ip]/live/mp4:mystream/playlist.m3u8" type='video/mp4'/>
</video>

- SurfinColin

---

注意：建议编辑建议从streambox.fr/HLSProvider切换到http://flashls.org/videojs/flash_demo.html。 - Vi.

您链接的指南已不存在。它是如何工作的？此外，我因为HTML和/或Javascript不喜欢字符串中的引号data-setup='{"techOrder": ["flash"]}'而出现错误。 - ocramot

Answer 2

需要添加一个额外的库以支持HLS（直播流）。

VideoJS HLS 库。有关实时示例，请参见实时示例。

- Louisth