前不久工做中遇到了在移動 WEB 端直播視頻的需求,研究了一下相關技術,記錄一下。html
目前 WEB 上主流的視頻直播方案有 HLS 和 RTMP,移動 WEB 端目前就只有 HLS 能用,咱們重點介紹它。html5
HTTP Live Streaming(簡稱 HLS)是一個基於 HTTP 的視頻流協議,由 Apple 公司實現,Mac OS 上的 QuickTime、Safari 以及 iOS 上的 Safari 都能很好的支持 HLS,高版本 Android 也增長了對 HLS 的支持。一些常見的客戶端如:MPlayerX、VLC 也都支持 HLS 協議。git
HLS 協議基於 HTTP,很是簡單。一個提供 HLS 的服務器須要作兩件事:github
瀏覽器使用的是 m3u8 文件。m3u8 跟音頻列表格式 m3u 很像,能夠簡單的認爲 m3u8 就是包含多個 ts 文件的播放列表。播放器按順序逐個播放,所有放完再請求一下 m3u8 文件,得到包含最新 ts 文件的播放列表繼續播,周而復始。整個直播過程就是依靠一個不斷更新的 m3u8 和一堆小的 ts 文件組成,m3u8 必須動態更新,ts 能夠走 CDN。vim
能夠看到 HLS 協議本質仍是一個個的 HTTP 請求 / 響應,因此適應性很好,不會受到防火牆影響。但它也有一個致命的弱點:延遲現象很是明顯。若是每一個 ts 按照 5 秒來切分,一個 m3u8 放 6 個 ts 索引,那麼至少就會帶來 30 秒的延遲。若是減小每一個 ts 的長度,減小 m3u8 中的索引數,延時確實會減小,但會帶來更頻繁的緩衝,對服務端的請求壓力也會成倍增長。因此只能須要根據實際狀況找到一個折中的點。瀏覽器
對於支持 HLS 的瀏覽器來講,直接這樣寫就能播放了:服務器
<video src="http://devimages.apple.com/iphone/samples/bipbop/bipbopall.m3u8" height="300" width="400"></video>
對於不支持 m3u8 的瀏覽器,好比 PC / Mac 上的 Chrome,須要藉助 Flash 來實現了。網上有一些較爲成熟的方案能夠直接用,如: Sewise Player(免費)、 JW Player(收費)。app
Real Time Messaging Protocol(簡稱 RTMP)是 Macromedia 開發的一套視頻直播協議,如今屬於 Adobe。這套方案須要搭建專門的 RTMP 流媒體服務如 Adobe Media Server,而且在瀏覽器中只能使用 Flash 實現播放器。它的實時性很是好,延遲很小。可是沒法支持移動端 WEB 播放是它的硬傷。iphone
前面提到的 JW Player 能很好的播放採用 RTMP 協議的直播服務。ide
此次先寫這麼多,下一篇寫一個另類的直播方案。
本文連接: https://www.imququ.com/post/html5-live-player-1.html
--EOF--