如何使用html5視頻標籤播放Apple HLS直播視頻流

<video id="live" autoplay controls> 
    <source src="http://[WOWZA-IP]:1935/Live/mp4:[LIVESTREAMNAME]/playlist.m3u8" type="video/mp4" /> 
</video>

我試圖使用html5視頻標籤播放h264編碼的直播視頻流。實時流由wowza媒體服務器播放，當訪問src鏈接時，我會得到一個有效的播放列表文件。當試圖在android chrome瀏覽器上播放流時，播放器什麼也不做，並顯示黑屏。如何使用html5視頻標籤播放Apple HLS直播視頻流

這是與html5視頻標籤相關的問題或者廣播者？

來源

2013-08-25 jM2.me

Wowza建立了轉碼器，將發佈流轉換爲使用strobe.js API在HTML5視頻標籤內播放的Manifest.f4m格式。鏈接 - https://sourceforge.net/adobe/smp/wiki/JavaScript%20API/ – Altanai

您可以使用一些hls支持模塊。
https://stackoverflow.com/a/48003736/9143855 – 2017-12-28 07:59:38

這些是您可以使用html5源標籤播放的格式。

將視頻格式視爲包含編碼視頻流和音頻流的zip文件。你應該關心的網頁的三種格式是（支持WebM，MP4和OGV）：

.mp4 = H.264 + AAC 
.ogg/.ogv = Theora + Vorbis 
.webm = VP8 + Vorbis

來源

2013-11-20 05:47:43 robert

謝謝。我通過MP3而不是AAC流式傳輸H.264。 –

我嘗試了https://developer.apple.com/streaming/examples/中的示例流，但它們都不在播放，即使所有格式都是H.264 + AAC。任何想法是什麼問題？ – MA1

使用Flash的解決方法，你可以使用FlasHLS控件播放器。

來源

2014-01-14 01:00:25 flavioribeiro

在瀏覽器上支持Media Source Extension可以使用https://github.com/dailymotion/hls.js

來源

2015-09-24 08:51:00 mangui

其實是有一個良好的範圍。這個解決方案的。一個解決辦法是，以檢測是否HLS可以播放：

document.createElement('video').canPlayType('application/vnd.apple.mpegURL') !== ''

但是，這不會讓你玩上不支持播放設備HLS內容。此時，僅在Microsoft Edge，iOS Safari，OS X Safari和Android上支持回放（however, I strongly advise against using HLS on Android due to limitations）

另一種在HTML5中跨所有平臺播放HLS的解決方案是使用HTML5 HLS播放器，如THEOplayer。他們設法讓HLS在all popular platforms and devices上播放，包括那些沒有Media Source Extension支持的播放器。目前，受支持的瀏覽器和平臺列表包括：Windows，Linux，Mac OS X，Android，iOS和Windows Phone上的Internet Explorer，Edge，Firefox，Chrome，Opera和Safari。

來源

2015-09-30 06:38:29 MrP

嘗試FlowPlayer。它提供了一個完整的HLS支持，在服務器端最少的努力！

來源

2016-07-28 17:29:16 XlbrlX

如何使用html5視頻標籤播放Apple HLS直播視頻流

回答

相關問題