5G時(shí)代音視頻開發(fā)王器：WebRTC(送書)

新書速遞

?

在WebRTC出現(xiàn)之前，Flash RTMP是在網(wǎng)頁(yè)端進(jìn)行RTC的主要選擇。但是老舊平臺(tái)的使用情況已經(jīng)出現(xiàn)了衰退，并且安全問題也愈發(fā)嚴(yán)重。隨著HTML5的發(fā)展，Flash Player已經(jīng)系統(tǒng)地從瀏覽器中慢慢移出了，Chrome和Firefox已經(jīng)要求用戶提供額外的使用Flash的確認(rèn)信息，目前Chrome會(huì)在后臺(tái)中阻止Flash的加載。如今大量開發(fā)遠(yuǎn)程教育、視頻會(huì)議、視頻會(huì)診等項(xiàng)目時(shí)均已使用WebRTC技術(shù)。

?

WebRTC 項(xiàng)目的原則是API開源、免費(fèi)、標(biāo)準(zhǔn)化、瀏覽器內(nèi)置，比現(xiàn)有的技術(shù)更高效。

?

WebRTC雖然冠以“Web”之名，但并不受限于傳統(tǒng)互聯(lián)網(wǎng)應(yīng)用或?yàn)g覽器的終端運(yùn)行環(huán)境。實(shí)際上，無(wú)論終端運(yùn)行環(huán)境是瀏覽器、桌面應(yīng)用、移動(dòng)設(shè)備（Android或iOS）還是IoT設(shè)備，只要IP連接可到達(dá)且符合WebRTC規(guī)范就可以互通。這一點(diǎn)釋放了大量智能終端（或運(yùn)行在智能終端上的App）的實(shí)時(shí)通信能力，打開了許多對(duì)于實(shí)時(shí)交互性要求較高的應(yīng)用場(chǎng)景的想象空間，如在線教育、視頻會(huì)議、視頻社交、遠(yuǎn)程協(xié)助、遠(yuǎn)程操控等，都是其合適的應(yīng)用領(lǐng)域。

• 跨平臺(tái)：可以在Web、Android、iOS、Windows、MacOS、Linux環(huán)境下運(yùn)行WebRTC應(yīng)用。

• 實(shí)時(shí)傳輸：傳輸速度快，延遲低，適合實(shí)時(shí)性要求較高的應(yīng)用場(chǎng)景。

• 音視頻引擎：強(qiáng)大的音視頻處理能力。

• 免插件：不需要安裝任何插件，打開瀏覽器即可使用。

• 免費(fèi)：雖然WebRTC技術(shù)已經(jīng)較為成熟，集成了最佳的音視頻引擎和十分先進(jìn)的Codec，但仍是免費(fèi)的。

• 強(qiáng)大的打洞能力：WebRTC技術(shù)包含了使用STUN、ICE、TURN、RTP-over-TCP的關(guān)鍵NAT和防火墻穿透技術(shù)，并支持代理。

• 主流瀏覽器支持：包括Chrome、Safari、Firefox、Edge等。

?

WebRTC的應(yīng)用場(chǎng)景十分廣泛，尤其是在網(wǎng)絡(luò)越來(lái)越發(fā)達(dá)的情況下。音視頻會(huì)議、在線教育、即時(shí)通信工具、游戲、人臉識(shí)別等，是當(dāng)下和未來(lái)的重要發(fā)展方向，5G時(shí)代的到來(lái)必然會(huì)引起對(duì)WebRTC井噴式的應(yīng)用。

?

• 音視頻會(huì)議

• 在線教育

• 照相機(jī)

• 音樂播放器

• 共享遠(yuǎn)程桌面

• 錄制

• 即時(shí)通信工具

• P2P網(wǎng)絡(luò)加速

• 文件傳輸工具?

• 游戲?

• 實(shí)時(shí)人臉識(shí)別

?

WebRTC目前已經(jīng)形成了一個(gè)HTML5的規(guī)范。由W3C組織來(lái)制定并維護(hù)這個(gè)標(biāo)準(zhǔn)，其總體架構(gòu)如下圖所示。

對(duì)于這個(gè)框架，不同的開發(fā)人員關(guān)注的內(nèi)容不同，例如：

• Video Conference、Video Call、Remote Education為應(yīng)用層，指具體的音視頻應(yīng)用，是應(yīng)用開發(fā)人員最關(guān)注的。

• Web API部分是Web應(yīng)用開發(fā)者API層，為上層應(yīng)用層提供API服務(wù)，是應(yīng)用開發(fā)者調(diào)用的接口。

• C++ API部分是面向?yàn)g覽器廠商的API層。

• Session Management為信令管理層，可由開發(fā)者自行定義實(shí)現(xiàn)。

• VoiceEngine、VideoEngine以及Transport為WebRTC的核心內(nèi)容，可由WebRTC的應(yīng)用SDK廠商進(jìn)行優(yōu)化處理。

• Audio Capture、Video Capture可供瀏覽器廠商自定義實(shí)現(xiàn)。

  
  

WebRTC架構(gòu)圖中涉及的內(nèi)容及概念較多，接下來(lái)將詳細(xì)說(shuō)明。

?

1. Web應(yīng)用

Web開發(fā)者可以基于Web API開發(fā)基于視頻、音頻的實(shí)時(shí)通信應(yīng)用，如視頻會(huì)議、遠(yuǎn)程教育、視頻通話、視頻直播、游戲直播、遠(yuǎn)程協(xié)作、互動(dòng)游戲、實(shí)時(shí)人臉識(shí)別、遠(yuǎn)程機(jī)械手操作等。

?

2. Web API

Web API是面向第三方開發(fā)者的WebRTC標(biāo)準(zhǔn)API（JavaScript），使開發(fā)者能夠容易地開發(fā)出類似于網(wǎng)絡(luò)視頻聊天的Web應(yīng)用，最新的技術(shù)進(jìn)展可以參考W3C的WebRTC文檔https://www.w3.org/TR/webrtc/，常用的API如下所示。

• MediaStream：媒體數(shù)據(jù)流，如音頻流、視頻流等。

• RTCPeerConnection：該類很重要，提供了應(yīng)用層的調(diào)用接口。

• RTCDataChannel：傳輸非音視頻數(shù)據(jù)，如文字、圖片等。

  
  

WebRTC的API接口非常豐富，更多詳細(xì)的API可以參考網(wǎng)址https://developer.mozilla.org/zh-CN/docs/Web/API/WebRTC_API，該文檔提供了中文說(shuō)明。

?

3. C++ API

底層API使用C++語(yǔ)言編寫，使瀏覽器廠商容易實(shí)現(xiàn)WebRTC標(biāo)準(zhǔn)的Web API，抽象地對(duì)數(shù)字信號(hào)過(guò)程進(jìn)行處理。如RTCPeerConnection API是每個(gè)瀏覽器之間點(diǎn)對(duì)點(diǎn)連接的核心，RTCPeerConnection是WebRTC組件，用于處理點(diǎn)對(duì)點(diǎn)間流數(shù)據(jù)的穩(wěn)定和有效通信。

?

4. Session Management

Session Management是一個(gè)抽象的會(huì)話層，提供會(huì)話建立和管理功能。該層協(xié)議留給應(yīng)用開發(fā)者自定義實(shí)現(xiàn)。對(duì)于Web應(yīng)用，建議使用WebSocket技術(shù)來(lái)管理信令Session。信令主要用來(lái)轉(zhuǎn)發(fā)會(huì)話雙方的媒體信息和網(wǎng)絡(luò)信息。

?

5. Transport

Transport為WebRTC的傳輸層，涉及音視頻的數(shù)據(jù)發(fā)送、接收、網(wǎng)絡(luò)打洞等內(nèi)容，可以通過(guò)STUN和ICE組件來(lái)建立不同類型的網(wǎng)絡(luò)間的呼叫連接。

?

6. VoiceEngine

VoiceEngine（音頻引擎）是包含一系列音頻多媒體處理的框架，包括從音頻采集到網(wǎng)絡(luò)傳輸端等整個(gè)解決方案。VoiceEngine是WebRTC極具價(jià)值的技術(shù)之一，是Google收購(gòu)GIPS公司后開源的，目前在VoIP技術(shù)上處于業(yè)界領(lǐng)先地位。下面介紹主要的模塊。

iSAC（Internet Speech Audio Codec）是針對(duì)VoIP和音頻流的寬帶和超寬帶音頻編解碼器，是WebRTC音頻引擎的默認(rèn)編解碼器，參數(shù)如下所示。

• 采樣頻率：16kHz，24kHz，32kHz（默認(rèn)為16kHz）。

• 自適應(yīng)速率為：10kbps ~ 52kbps。

• 自適應(yīng)包大小：30ms~60ms。

• 算法延時(shí)：frame + 3ms。

  
  

  
  

iLBC（Internet Low Bitrate Codec）是VoIP音頻流的窄帶語(yǔ)音編解碼器，參數(shù)如下所示。

• 采樣頻率：8kHz。

• 20ms幀比特率為15.2kbps。

• 30ms幀比特率為13.33kbps。

NetEQ For Voice是針對(duì)音頻軟件實(shí)現(xiàn)的語(yǔ)音信號(hào)處理元件。NetEQ算法是自適應(yīng)抖動(dòng)控制算法以及語(yǔ)音包丟失隱藏算法，該算法能夠快速且高解析度地適應(yīng)不斷變化的網(wǎng)絡(luò)環(huán)境，確保音質(zhì)優(yōu)美且緩沖延遲最小，是GIPS公司獨(dú)特的技術(shù)，能夠有效地處理網(wǎng)絡(luò)抖動(dòng)和語(yǔ)音包丟失時(shí)對(duì)語(yǔ)音質(zhì)量產(chǎn)生的影響。NetEQ也是WebRTC中一個(gè)極具價(jià)值的技術(shù)，對(duì)于提高VoIP質(zhì)量有明顯效果，與AEC、NR、AGC等模塊集成使用效果更好。

• Acoustic Echo Canceler（AEC，回聲消除器）是一個(gè)基于軟件的信號(hào)處理元件，能實(shí)時(shí)地去除Mic采集到的回聲。

• Noise Reduction（NR，噪聲抑制）也是一個(gè)基于軟件的信號(hào)處理元件，用于消除與相關(guān)VoIP的某些類型的背景噪聲（如嘶嘶聲、風(fēng)扇噪音等）。

?

7. VideoEngine

VideoEngine是WebRTC視頻處理引擎，包含一系列視頻處理的整體框架，從攝像頭采集視頻到視頻信息網(wǎng)絡(luò)傳輸再到視頻顯示，是一個(gè)完整過(guò)程的解決方案。下面介紹主要的模塊。

• VP8是視頻圖像編解碼器，也是WebRTC視頻引擎默認(rèn)的編解碼器。VP8適合實(shí)時(shí)通信應(yīng)用場(chǎng)景，因?yàn)樗饕轻槍?duì)低延時(shí)而設(shè)計(jì)的編解碼器。VPx編解碼器是Google收購(gòu)ON2公司后開源的，現(xiàn)在是WebM項(xiàng)目的一部分，而WebM項(xiàng)目是Google致力于推動(dòng)的HTML5標(biāo)準(zhǔn)之一。

• Video Jitter Buffer（視頻抖動(dòng)緩沖器）模塊可以降低由于視頻抖動(dòng)和視頻信息包丟失帶來(lái)的不良影響。

• Image Enhancements（圖像質(zhì)量增強(qiáng)）模塊對(duì)網(wǎng)絡(luò)攝像頭采集到的視頻圖像進(jìn)行處理，包括明暗度檢測(cè)、顏色增強(qiáng)、降噪處理等功能，用來(lái)提升視頻質(zhì)量。

?

如果想深入了解WebRTC更多開發(fā)技術(shù)，歡迎閱讀《WebRTC音視頻開發(fā)：React+Flutter+Go實(shí)戰(zhàn)》一書。

?

本書從基本概念、基礎(chǔ)應(yīng)用和綜合案例系統(tǒng)介紹WebRTC技術(shù)的原理與應(yīng)用，提供了前后端整體解決方案：PC-Web端使用的是React技術(shù)，后端使用的是Golang技術(shù)，移動(dòng)端使用的是Flutter技術(shù)。

結(jié)合一對(duì)一視頻通話案例，幫助讀者快速上手，深入理解WebRTC的各種功能，并快速搭建自己的應(yīng)用。

?

主要內(nèi)容包括：WebRTC技術(shù)發(fā)展歷史、應(yīng)用場(chǎng)景、整體架構(gòu)，WebRTC通話原理，Web開發(fā)環(huán)境搭建，HTML5項(xiàng)目簡(jiǎn)介，訪問設(shè)備的設(shè)置，音視頻設(shè)備的設(shè)置，音視頻的錄制，結(jié)合React+Flutter+Go技術(shù)開發(fā)音視頻應(yīng)用的案例。

?

• 容易上手——通過(guò)一個(gè)個(gè)小案例，只需要簡(jiǎn)單幾步，就能讓程序運(yùn)行起來(lái)。

• 多端講解——移動(dòng)端App覆蓋iOS和Android系統(tǒng)，還包括桌面端Web接口的使用方法、后端信令服務(wù)及中轉(zhuǎn)服務(wù)的對(duì)應(yīng)實(shí)現(xiàn)。

• 面向?qū)崙?zhàn)——配有一對(duì)一視頻通話綜合案例，可以實(shí)現(xiàn)前后端語(yǔ)音視頻通信。

• 覆蓋全面——從訪問設(shè)備、音量檢測(cè)、設(shè)備枚舉、媒體流、媒體軌道、媒體錄制、連接建立到數(shù)據(jù)通道，進(jìn)行全方位講解。

• 方案完整——Web端采用React技術(shù)，可進(jìn)行組件化開發(fā)以及復(fù)雜界面展示；App端使用Flutter跨平臺(tái)技術(shù)，視頻渲染能力強(qiáng)并且可以跨多終端；服務(wù)器端采用Go技術(shù)，可以充分利用服務(wù)器硬件資源，加快開發(fā)速度。

• 功能豐富——涉及視頻通話及視頻會(huì)議的眾多功能點(diǎn)，如語(yǔ)音視頻通信、共享桌面、電子白板、文件傳輸、音頻錄制、視頻錄制、屏幕錄制、白板錄制等。

亢少軍，資深開發(fā)者、創(chuàng)業(yè)者，《Flutter技術(shù)入門與實(shí)戰(zhàn)》作者。專注于視頻通信技術(shù)領(lǐng)域，多年從事視頻會(huì)議、遠(yuǎn)程教育等相關(guān)技術(shù)研發(fā)，對(duì)于Android、iOS以及跨平臺(tái)開發(fā)技術(shù)有比較深入的研究和應(yīng)用，作為主要程序員開發(fā)了多個(gè)應(yīng)用項(xiàng)目，涉及醫(yī)療、交通、銀行等領(lǐng)域。

?

送?。?！

溫馨提示：

? ? 請(qǐng)?jiān)陂_獎(jiǎng)前添加我的微信，否則無(wú)法領(lǐng)取獎(jiǎng)品～

一切解釋權(quán)歸達(dá)達(dá)前端所有，獲獎(jiǎng)?wù)弑仨毺砑游⑿牛?/span>xiaoda0423?

留言心得，「點(diǎn)贊數(shù)高者（留言最走心）【在看】一本」，「送」！

開獎(jiǎng)截止時(shí)間

「2020-09-30?21:00:00」周三

掃碼關(guān)注公眾號(hào)，訂閱更多精彩內(nèi)容。

你點(diǎn)的每個(gè)贊，我都認(rèn)真當(dāng)成了喜歡

點(diǎn)擊閱讀全文購(gòu)買