使用WebRTC搭建1v1视频聊天室

WebRTC建立通信过程

基础设施：必要的信令服务和 NAT 穿越服务
clientA 和 clientB 分别创建 RTCPeerConnection 并为输出端添加本地媒体流。如果是视频通话类型，则意味着，两端都需要添加媒体流进行输出。
本地 ICE 候选信息采集完成后，通过信令服务进行交换。
呼叫端（好比 A 给 B 打视频电话，A 为呼叫端）发起 offer 信息，接收端接收并返回一个 answer 信息，呼叫端保存，完成连接。

实现1v1视频聊天

信令服务器

对于上面的额所讲到的信令服务器，我们可以采取搭建websocket服务器实现。更进一步，我们可以采用socketio来实现，因为它自带room管理，可以给我们带来很多便利。

NAT穿透

而NAT穿透，我们知道在WenRTC中是通过STUN/TURN协议实现的，我们可以自己搭建这种服务器，但比较繁琐，可以参考https://webrtc.org.cn/stunturn_quick_guide/。作为测试，我们可以使用一些免费的服务器，可以从中选取。
例如：

{url:\'stun:stun01.sipphone.com\'},
{url:\'stun:stun.ekiga.net\'},
{url:\'stun:stun.fwdnet.net\'},
{url:\'stun:stun.ideasip.com\'},
{url:\'stun:stun.iptel.org\'},
{url:\'stun:stun.rixtelecom.se\'},
{url:\'stun:stun.schlund.de\'},
{url:\'stun:stun.l.google.com:19302\'},
{url:\'stun:stun1.l.google.com:19302\'},
{url:\'stun:stun2.l.google.com:19302\'},
{url:\'stun:stun3.l.google.com:19302\'},
{url:\'stun:stun4.l.google.com:19302\'},
{url:\'stun:stunserver.org\'},
{url:\'stun:stun.softjoys.com\'},
{url:\'stun:stun.voiparound.com\'},
{url:\'stun:stun.voipbuster.com\'},
{url:\'stun:stun.voipstunt.com\'},
{url:\'stun:stun.voxgratia.org\'},
{url:\'stun:stun.xten.com\'},
{
    url: \'turn:numb.viagenie.ca\',
    credential: \'muazkh\',
    username: \'webrtc@live.com\'
},
{
    url: \'turn:192.158.29.39:3478?transport=udp\',
    credential: \'JZEOEt2V3Qb0y27GRntt2u2PAYA=\',
    username: \'28224511:1379330808\'
},
{
    url: \'turn:192.158.29.39:3478?transport=tcp\',
    credential: \'JZEOEt2V3Qb0y27GRntt2u2PAYA=\',
    username: \'28224511:1379330808\'
}

在创建RTCPeerConnection时可以作为选项设置。

https

WebRTC限制远程访问摄像头等媒体设备时，必须使用https做安全访问，本地测试可以使用http。但是由于我们现在是做1v1视频聊天，因此一个https服务器是必须的。
无论采用golang，还是nodejs搭建web服务器，提供https访问是很简单的,如golang使用gin框架提供web服务时：

router.RunTLS(config.WebServerHostTLS, "ssl/server.crt", "ssl/server.key")

主要就是ssl证书的问题。如果你有购买域名，一般的云服务提供商都有生成ssl证书的服务，但是如果没有域名，我们可以使用openssl来创建测试证书。当然这样的证书由于并为被认证，所以使用时浏览器还是会报安全警告，但是这对于我们测试来说足够了。

openssl生成证书的过程可以参考：https://www.cnblogs.com/pzblog/p/9088286.html .

实现效果

演示地址： https://134.175.26.82:8082/static/demo/remote_chat.html.

仓库地址：https://github.com/243286065/WebRTCDemo 。