關於直播視頻格式和瀏覽器兼容性歷史的前因後果

由於誤打誤撞來到了淘寶直播團隊，從開始徹底不瞭解直播技術，如今由於leader暫時的離開，準備接手h5播放器的迭代，就不得不開始瞭解相關的視頻技術，先整理一下在直播技術中的視頻格式和不一樣瀏覽器的兼容性。

直播協議HLS和RTMP

直播技術通常有兩種協議方式，分別是HLS和RTMP，兩種協議分別的解釋我就摘抄了一個博主的解釋

• HLS ，是蘋果公司實現的基於 HTTP 的流媒體傳輸協議，全稱 HTTP Live Streaming，可支持流媒體的直播和點播，主要應用在 iOS 系統，爲 iOS 設備（如 iPhone、iPad）提供音視頻直播和點播方案。
• RTMP ，實時消息傳輸協議，Real Time Messaging Protocol，是 Adobe Systems 公司爲 Flash 播放器和服務器之間音頻、視頻和數據傳輸開發的開放協議。協議基於 TCP，是一個協議族，包括 RTMP 基本協議及 RTMPT/RTMPS/RTMPE 等多種變種。RTMP 是一種設計用來進行實時數據通訊的網絡協議，主要用來在 Flash/AIR 平臺和支持RTMP協議的流媒體/交互服務器之間進行音視頻和數據通訊。

總結下來就是RTMP是Adobe公司推出的基於flash的實時視頻消息傳輸協議，服務端和用戶端經過flash創建長連接，並實時進行消息的推送、傳輸和接收而後播放，對應的視頻播放格式是flv。而HLS就是apple公司爲了消滅flash（由於老喬一直以來對flash的抵制和ios對flash的不支持）本身定義的一套替代flash的視頻解決方案。服務器和用戶端經過不停的接收視頻片斷（每一個片斷都經過一次http請求）來播放，對應的視頻播放格式是m3u8，其中m3u8只是一個表示視頻片斷地址的純文本，用來加載一個個的.ts視頻文件。

HLS和RTMP的利弊

兩種協議各有利弊，具體的在本篇中不展開了，就我所知的RTMP協議延遲低，協議自己設計簡潔，適合實時性較高的網絡直播，HLS是http請求，因此能夠用cdn緩存等方式加快傳輸，可是由於是視頻片斷，容易被跳過，因此若是有強制廣告要求的話也可能被跳過。可是RTMP由於佔用的網絡端口是1935，若是之後瀏覽器的一些新安全機制就有可能block全部80端口之外的鏈接，也有安全性問題。

flv和m3u8格式的瀏覽器兼容性

移動端

由於蘋果公司對flash的強烈抵制以及本身定的視頻協議，因此在ios端原生支持m3u8格式的視頻播放而不支持flv的播放，並且由於蘋果在移動端的領頭做用，因此其餘移動端包括android瀏覽器也都原生支持m3u8格式的視頻播放。

PC端

pc端由於歷史緣由，在hls以前都是用flash播放視頻，後來隨着html5的普及，能夠用原生的video標籤來播放mp四、ogg、webm等視頻格式的播放，可是對於直播格式m3u8（除了safari）和flv都不能支持播放。因此如今pc端廣泛的作法仍是經過flash來播放m3u8和flv格式的視頻。

MSE

可是由於flash的淘汰正在加速，也比較有決心，好比我就發現如今chrome播放flash視頻已經要手動點擊容許了。加上media source extention在高端瀏覽器已經被支持，就能夠直接在瀏覽器端就實現視頻格式的轉換。MSE是一個能夠經過js控制瀏覽器視頻源文件的api，有了這個api咱們就能夠經過js在瀏覽器端對視頻進行轉碼及處理並提供給video標籤了。B站已經開源了一個flv播放器flv.js，原理就是經過解析視頻源，而後進行視頻源解碼轉換成mp4格式，而後經過mse丟在video原生標籤裏播放，同理也有hls.js對m3u8格式的視頻進行轉碼在pc端播放。