資訊專欄INFORMATION COLUMN
摘要：和格式的瀏覽器兼容性移動端因為蘋果公司對的強烈抵制以及自己定的視頻協議，所以在端原生支持格式的視頻播放而不支持的播放，而且因為蘋果在移動端的領頭作用，所以其他移動端包括瀏覽器也都原生支持格式的視頻播放。
因為誤打誤撞來到了淘寶直播團隊，從開始完全不了解直播技術，現在因為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視頻文件。
兩種協議各有利弊，具體的在本篇中不展開了，就我所知的RTMP協議延遲低，協議本身設計簡潔，適合實時性較高的網絡直播，HLS是http請求，所以可以用cdn緩存等方式加快傳輸，但是因為是視頻片段，容易被跳過，所以如果有強制廣告要求的話也可能被跳過。但是RTMP因為占用的網絡端口是1935，如果以后瀏覽器的一些新安全機制就有可能block所有80端口以外的連接，也有安全性問題。
flv和m3u8格式的瀏覽器兼容性因為蘋果公司對flash的強烈抵制以及自己定的視頻協議，所以在ios端原生支持m3u8格式的視頻播放而不支持flv的播放，而且因為蘋果在移動端的領頭作用，所以其他移動端包括android瀏覽器也都原生支持m3u8格式的視頻播放。
pc端因為歷史原因，在hls之前都是用flash播放視頻，后來隨著html5的普及，可以用原生的video標簽來播放mp4、ogg、webm等視頻格式的播放，但是對于直播格式m3u8（除了safari）和flv都不能支持播放。所以現在pc端普遍的做法還是通過flash來播放m3u8和flv格式的視頻。
但是因為flash的淘汰正在加速，也比較有決心，比如我就發現現在chrome播放flash視頻已經要手動點擊允許了。加上media source extention在高端瀏覽器已經被支持，就可以直接在瀏覽器端就實現視頻格式的轉換。MSE是一個可以通過js控制瀏覽器視頻源文件的api，有了這個api我們就可以通過js在瀏覽器端對視頻進行轉碼及處理并提供給video標簽了。B站已經開源了一個flv播放器flv.js，原理就是通過解析視頻源，然后進行視頻源解碼轉換成mp4格式，然后通過mse丟在video原生標簽里播放，同理也有hls.js對m3u8格式的視頻進行轉碼在pc端播放。
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/11030.html
摘要：和格式的瀏覽器兼容性移動端因為蘋果公司對的強烈抵制以及自己定的視頻協議，所以在端原生支持格式的視頻播放而不支持的播放，而且因為蘋果在移動端的領頭作用，所以其他移動端包括瀏覽器也都原生支持格式的視頻播放。 因為誤打誤撞來到了淘寶直播團隊，從開始完全不了解直播技術，現在因為leader暫時的離開，準備接手h5播放器的迭代，就不得不開始了解相關的視頻技術，先整理一下在直播技術中的視頻格式和不...
摘要：文紅點聯合創始人王宇航我今天分享的主題，是以實時連接場景為目標的一些技術架構探索。主要是關于紅點在產品研發過程中，我們的技術選擇，架構變化，還有這個過程中，我們的一些考慮。紅點的第一個版本紅點的第一個版本功能比較簡單。 showImg(https://segmentfault.com/img/bVrBAw); 文 | 紅點聯合創始人 王宇航 我今天分享的主題，是以實時連接場景為目標的一...
閱讀 6912·2021-09-22 15:08
閱讀 1919·2021-08-24 10:03
閱讀 2437·2021-08-20 09:36
閱讀 1315·2020-12-03 17:22
閱讀 2474·2019-08-30 15:55
閱讀 904·2019-08-29 16:13
閱讀 3053·2019-08-29 12:41
閱讀 3249·2019-08-26 12:12
