webRTC例子之stepx和webrtc.io

这两个例子都是运行在node.js上的。

1，stepx

stepx是webrtc官网推荐的一个例子，这个例子最终的效果是两个带摄像头的设备通过chrome浏览器可以互发各自摄像头采集的图片。这个例子的webrtc接口调用时序和下面这个流程图展示的是一样的，在stepx源码基础上稍加修改就能实现实时视频。

这个例子的信令交互用的socket.io。

时序：

假设第一个进入房间的是caller,之后进入的是callee。

1，caller进入房间后调用getUserMedia初始化自己的MediaStream然后等待；

2，callee进入房间后调用getUserMedia初始化自己的MediaStream然后等待；

3，caller得知callee进入房间后，调用RTCPeerConnection创建通道，向callee发起offer(带有自己MediaStream信息)

4，callee收到offer后回复preanswer（此时callee的MediaStream初始化还未完成，不带有自己MediaStream信息）

5，callee的MediaStream初始化完成后，回复answer（带有自己video和audio信息）

6，通道建成双方开始通信

（获取MediaStream信息，需要用户同意，chrome 浏览器上会弹提示～）

https://bitbucket.org/webrtc/codelab

webrtc浏览器之间建立联系的流程图：

http://w3c.github.io/webrtc-pc/#call-flow-browser-to-browser

2，webrtc.io

webrtc.io是一个实现了webrtc的nodejs包，只需添加简单的客户端和服务器代码就能实现实时音视频通信，其中信令交互用的websocket。

时序：

假设第一个进入房间的是caller,之后进入的是callee。

1，caller进入房间后调用getUserMedia初始化MediaStream然后等待；

2，callee进入房间后调用getUserMedia初始化自己的MediaStream，调用RTCPeerConnection创建通道，初始化成功后向caller发起offer(带有自己MediaStream信息)

3，caller收到offer，回复answer(带有自己MediaStream信息)

4，通道建成双方开始通信

https://github.com/webRTC-io/webRTC.io

总结：显而易见，webrtc.io中这个时序简洁许多，谷歌webrtc项目中的appRTCDemo的时序和这个差不多。