WebRTC之初體驗 | 掘金技術徵文

想必你們都使用過微信視頻通話的功能，若是讓你在本身的 App 裏實現一個視頻通話的功能，你會如何去實現？

你可能會以爲很複雜，由於在過去，若是想在 App 裏增長一個視頻通話的功能，你須要一整個團隊才能實現，可是如今，只要使用 WebRTC，一我的就能實現視頻通話的功能。

什麼是 WebRTC？

WebRTC 的全稱是 Web Real-Time Communication，即網頁即時通訊，提供了能夠在瀏覽器上發送任何類型實時數據的 API，可是咱們主要關注 WebRTC 發送音視頻數據的功能。下圖是 WebRTC 的架構。

WebRTC 在最上層定義了一組由瀏覽器實現的標準和新 API，目前只在瀏覽器裏有實現，可是不久以後就會在其餘設備上實現，例如手機上，這樣咱們在 Native App 裏也可使用 WebRTC。

在 WebRTC 以前，處理音視頻的技術很複雜並且很難，但在有了 WebRTC 以後，音視頻處理的技術都被封裝了起來，尤爲仍是有不少第三方的 WebRTC 的技術方案，並且這些方案都是開箱即用，使咱們很容易實現 App 裏的視頻通話功能，如今咱們看一下 WebRTC 如何使用。

在瀏覽器中進行視頻通話

使用 WebRTC 最簡單的方法就是在瀏覽器中使用，由於在瀏覽器中，咱們能夠不使用任何插件，直接使用 WebRTC 的 API，能夠很方便的鏈接到計算機的攝像頭和麥克風，開發視頻通話的功能。

這個 API 就是：getUserMedia。這個 API 容許咱們訪問用戶的媒體設備，例如：相機和麥克風，在訪問這些媒體設備時，這個 API 還能夠用來處理用戶權限的申請問題，在手機上，還能夠用來控制調用的是前置攝像頭，仍是後置攝像頭，並且還能用於處理不一樣分辨率的視頻，在獲得視頻和音頻的數據後，還能夠將這些數據流式傳送。

視頻通話，確定是兩我的在通話，假如小紅和小明要進行視頻通話，就像打電話同樣，要知道對方的電話號碼，電話才能撥通，因此，若是小紅要想和小明視頻通話，那麼小紅首先要知道小明的 ip，而後小紅和小明之間會創建一條鏈接，這條鏈接是點對點的，而後利用這條鏈接來發送音視頻的數據。下來介紹一下如何創建這種點對點的鏈接。

創建點對點的視頻聊天

WebRTC 旨在容許使用對等鏈接發送音頻和視頻。

由於這種點對點的鏈接，不須要使用服務器。例如，當你輸入 www.baidu.com 的時候，其實你並非直接去訪問的百度，而是首先經過了 DNS 服務器，將域名解析成 IP，而後再去訪問這個 IP 上的服務器，而點對點的通訊，也稱 P2P，能夠不須要中間的服務器，在互聯網上的兩臺機器能夠直接鏈接，由於在 P2P 網絡中，每一個客戶端也都是服務器。

因此當小紅要跟小明視頻聊天時，小紅不會先將音視頻數據發給服務器，而後服務器找到小明的地址，而後將音視頻數據轉發給小明，而是，小紅和小明會直接鏈接，並且小紅會直接將飲音視頻數據發給小明。

爲了創建這種點對點的鏈接，WebRTC 提供了一個 API： RTCPeerConnection。

有了 RTCPeerConnection，還不可以傳輸音視頻數據，由於原始的音視頻數據太大，須要對原始的音視頻數據進行壓縮，用於壓縮的工具叫作編解碼器。接下來說解音視頻的編解碼及傳輸。

音視頻數據的編解碼及傳輸

WebRTC 支持多種編解碼器，最經常使用的如：H264 、MP3 等，可是在肯定使用哪一種編解碼器的時候，必定要肯定這個編解碼器可以在兩端都能編解碼出音視頻。

因此，首先要把本身支持的編解碼器的信息相互發送給對方，這個信息被稱爲 SDP 協議，全稱爲 Session Description Protocol。在客戶端之間交換此信息稱爲 signaling（信令），一般使用HTTP或WebSockets等傳統協議來完成。

最後，爲了在客戶端之間實際創建 P2P 鏈接，RTCPeerConnection 會使用 ICE 協議，全稱爲 Interactive Connectivity Establishment。在這個過程當中，一方的客戶端將其全部可用於發送媒體的 ICE，IP 地址和端口發送到另外一個客戶端。而後，另外一個客戶端會檢查其全部 ICE 以找到與其接收的 ICE 兼容的，一旦找到組合，客戶端就能夠經過該鏈接發送音視頻數據。其過程以下圖：

Agora SDK 使用體驗徵文大賽 | 掘金技術徵文，徵文活動正在進行中