WebRTC手记之初探

转载请注明出处:http://www.cnblogs.com/fangkm/p/4364553.html 

WebRTC是HTML5支持的重要特性之一，有了它，再也不须要借助音视频相关的客户端，直接经过浏览器的Web页面就能够实现音视频对聊功能。并且WebRTC项目是开源的，咱们能够借助WebRTC源码快速构建本身的音视频对聊功能。不管是使用前端JS的WebRTC API接口，仍是在WebRTC源码上构建本身的对聊框架，都须要遵循如下执行流程：

 

上述序列中，WebRTC并不提供Stun服务器和Signal服务器，服务器端须要本身实现。Stun服务器能够用google提供的实现stun协议的测试服务器（stun:stun.l.google.com:19302），Signal服务器则彻底须要本身实现了，它须要在ClientA和ClientB之间传送彼此的SDP信息和candidate信息，ClientA和ClientB经过这些信息创建P2P链接来传送音视频数据。因为网络环境的复杂性，并非全部的客户端之间都可以创建P2P链接，这种状况下就须要有个relay服务器作音视频数据的中转，本文本着源码剖析的态度，这种状况就不考虑了。这里说明一下， stun/turn、relay服务器的实如今WebRTC源码中都有示例，真是个名副其实的大宝库。

上述序列中，标注的场景是ClientA向ClientB发起对聊请求，调用描述以下：

• ClientA首先建立PeerConnection对象，而后打开本地音视频设备，将音视频数据封装成MediaStream添加到PeerConnection中。
• ClientA调用PeerConnection的CreateOffer方法建立一个用于offer的SDP对象，SDP对象中保存当前音视频的相关参数。ClientA经过PeerConnection的SetLocalDescription方法将该SDP对象保存起来，并经过Signal服务器发送给ClientB。
• ClientB接收到ClientA发送过的offer SDP对象，经过PeerConnection的SetRemoteDescription方法将其保存起来，并调用PeerConnection的CreateAnswer方法建立一个应答的SDP对象，经过PeerConnection的SetLocalDescription的方法保存该应答SDP对象并将它经过Signal服务器发送给ClientA。
• ClientA接收到ClientB发送过来的应答SDP对象，将其经过PeerConnection的SetRemoteDescription方法保存起来。
• 在SDP信息的offer/answer流程中，ClientA和ClientB已经根据SDP信息建立好相应的音频Channel和视频Channel并开启Candidate数据的收集，Candidate数据能够简单地理解成Client端的IP地址信息（本地IP地址、公网IP地址、Relay服务端分配的地址）。
• 当ClientA收集到Candidate信息后，PeerConnection会经过OnIceCandidate接口给ClientA发送通知，ClientA将收到的Candidate信息经过Signal服务器发送给ClientB，ClientB经过PeerConnection的AddIceCandidate方法保存起来。一样的操做ClientB对ClientA再来一次。
• 这样ClientA和ClientB就已经创建了音视频传输的P2P通道，ClientB接收到ClientA传送过来的音视频流，会经过PeerConnection的OnAddStream回调接口返回一个标识ClientA端音视频流的MediaStream对象，在ClientB端渲染出来便可。一样操做也适应ClientB到ClientA的音视频流的传输。

这里的流程仅仅是从使用层面上描述了一下，具体内部都作了什么、怎么作的，之后的文章中会慢慢细扒，万事开头难，自我鼓励一下。