關於H5直播原始碼的技術掃盲

Bacer發表於2021-09-09

到目前,H5似乎已經成為品牌宣傳最重要的表現方式。H5技術開發簡單,研發週期短,且成本低廉。尤其強化了web網頁的表現效能,透過H5技術搭建的直播系統不僅能夠在網頁實現高畫質流暢播放,還能加入很多的互動功能。下面,我們就針對H5直播原始碼做一些技術掃盲。

一、H5直播原始碼中的關鍵技術點:WebRTC

想要搭建H5直播系統,WebRTC必不可少。WebRTC即網頁即時通訊,是一個支援網頁瀏覽器進行實時語音對話或影片對話的開源API。WebRTC中包括了音訊引擎,影片引擎、傳輸引擎等,瀏覽器把最底層的音影片渲染和網路傳輸的底層能力開放給開發者,開發者可以根據自己的需求選擇是否進行過載。

音訊引擎中,包括了兩個編解碼器:iSAC和iLBC,前者針對寬頻和超寬頻的音訊編解碼,後者針對窄帶音訊編解碼。音訊引擎還包括了音訊抖動緩衝,回聲消除和噪音抑制模組等。

影片引擎中,包括了VP8和VP9的影片編解碼器,甚至是即將到來的AV1,影片引擎還包括影片抖動緩衝和影像質量增強等模組。

傳輸引擎中,WebRTC使用的是SRTP安全實時傳輸協議,採取的是P2P的通訊方式,沒有媒體伺服器等後端的實現。

這些預定的引擎配置為H5直播原始碼提供了強悍的技術基礎。不過,WebRTC只是應用於影片錄製,影片播放還得需要HLS的支援。

圖片描述

二、什麼是HLS協議?.m3u8是幹啥用的?這倆有什麼聯絡?

HLS是一種常見的影片播放協議。簡單通俗點來講,就是把整個影片流分成一小塊一小塊的基於HTTP的檔案來下載播放。通常,在程式碼上說明HLS協議時,會引入一個用於H5播放影片的.m3u8檔案,這個檔案就是基於HLS協議,存放影片流後設資料的檔案。每一個.m3u8檔案,分別對應若干個ts檔案,這些ts檔案才是真正存放影片的資料,m3u8檔案只是存放了一些ts檔案的配置資訊和相關路徑,當影片播放時,.m3u8是動態改變的,video標籤會解析這個檔案,並找到對應的ts檔案來播放,所以一般為了加快速度,.m3u8放在web伺服器上,ts檔案放在cdn上。

那麼,HLS協議的請求流程是:

1、http請求.m3u8的url。

2、服務端返回一個.m3u8的播放列表,這個播放列表是實時更新的,一般一次給出3段資料的url。

3、客戶端解析.m3u8的播放列表,再按序請求每一段的url,從而獲取ts資料流。

三、直播延遲往往不可避免

前面提到,HLS協議是將直播流分成一段一段的影片去下載播放的。假設列表裡面的包含5個TS檔案,每個TS檔案包含5秒的影片內容,那麼整體的延遲就是25秒。因為當使用者看到這些影片時,主播已經將影片錄製好上傳了,所以產生了延遲。當然可以縮短列表的長度和單個TS檔案的大小來降低延遲,極致來說可以所見列表長度為1,並且TS的時長為1s。但如果這多就會造成請求次數增加,增大伺服器壓力,當網速慢時會造成更多的緩衝,所以一般推薦的ts時長為10s,這樣大概有30s的延遲。

以上就是關於H5直播原始碼的一些技術掃盲點。


來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/2768/viewspace-2825005/,如需轉載,請註明出處,否則將追究法律責任。

相關文章