![](http://myhexo.qiniudn.com/webrtccustomLogo.png)
最近一直在研究webrtc的相關工作谴分,在這里也直接坐下記錄。
什么是WebRtc
webrtc是還未正式發(fā)布的一種視頻通訊的新的解決方案切距,其核心在于通過瀏覽器來完成這一工作趾徽,只要你有瀏覽器你就可以使用(傳統(tǒng)的視頻還是通過瀏覽器嵌入flash插件续滋,或者c++腳本來達到播放視頻的效果)。
具體詳情點擊HERE
主要內容
- webrtc的原理
- webrtc在服務器端上的實現(xiàn)
- webrtc在android端上的實現(xiàn)
webrtc的原理
![](http://myhexo.qiniudn.com/WebRTCpublicdiagramforwebsite.png)
webrtc在服務器端上的實現(xiàn)
在服務器端上的實現(xiàn)我們又可以分為兩部分
- webrtc在web上的實現(xiàn)
- webrtc在后端的實現(xiàn)
webrtc在web上的實現(xiàn)
從上面的圖片中我們可以看出來孵奶,對于web上實現(xiàn)最大的問題還是瀏覽器的支持疲酌,下面是支持webrtc的瀏覽器
![](http://myhexo.qiniudn.com/webrtc-supportbrower.png)
從上面我們看到其實支持的瀏覽器還是比較少的,至于IE,Safari是打算做自己的WebRtc標準了袁,當然這只 是“小道消息”朗恳。
對于頁面顯示我們要借助與HTML5的Video標簽
<div class="video_box">
<video id="mini" muted="true" autoplay="autoplay" width='192'height='144'></video>
<div id="videos" >
</div>
</div>
Webrtc在web上主要用到下面幾個API:
- PeerConnection
- RTCSessionDescription
- getUserMedia
這三種API在不同瀏覽器中是不同的賦值方式,詳情可參閱官方API
webrtc在服務器中的實現(xiàn)
在這里我們要提供兩種東西载绿,一種是單純的socket交互粥诫,告訴用戶端接下來要怎么做。另外一點就是要提供一個stunserver崭庸。
stunsever:因為我們使用Node.js來實現(xiàn)怀浆,所以我們使用一個modules----stunsrv
var stunServer = require('stunsrv').createServer();
stunServer.setAddress0("127.0.0.1");
stunServer.setAddress1('0.0.0.0'); //外網(wǎng)IP
stunServer.setPort0(9001);
stunServer.setPort1(9001);
stunServer.listen();
它的功能就是用于穿透路由器,比如在不同網(wǎng)段中聊天怕享,我們首先要確定其在哪個公網(wǎng)ip执赡,然后需要知道是在這個公網(wǎng)ip路由下的哪個本地ip,然后才能進行連接函筋。
Socket:
socket主要由下面幾個功能:
- 實現(xiàn)用戶跟服務器之間的持續(xù)連接
- 告訴用戶除了你還有誰
- 告訴用戶與你要建立連接的用戶所處的狀態(tài)
通過以上幾個功能便能實現(xiàn)用戶p2p交流的基本功能了沙合。
webrtc在android端上的實現(xiàn)
在很早之前,google已經在Android的源碼中實現(xiàn)了webrtc的功能跌帐,但是并沒有將此功能實現(xiàn)在大眾面前而已首懈。google已經實現(xiàn)了android和ios上的webrtc實現(xiàn)芳来,具體可見HERE(在國內想要完成這個任務還是比較艱巨的)
最終我們要使用的是一個名字叫做libjingle_peerconnection
的庫,在這里面封裝了WebRtc的API猜拾,詳情可點擊這里 而實際上API的使用方式都是相同的,大家可以參照下巨人的例子來進行學習佣盒。