webRTC

发表于 分类于 阅读次数：

什么是 WebRTC？

WebRTC，名称源自网页即时通信（英语：Web Real-Time Communication）的缩写，是一个支持网页浏览器进行实时语音对话或视频对话的 API，经过多年来的发展与改进，日臻成熟，作为浏览器网页端的通信技术，WebRTC 与 H5 巧妙结合，使得网页端的音视频通信变的简单易行，最为重要的是：网页端通信是完全免费的。

WebRTC 技术介绍

WebRTC 是一个开源项目，旨在使得浏览器能为实时通信（RTC）提供简单的JavaScript 接口。说的简单明了一点就是让浏览器提供 JS 的即时通信接口。这个接口所创立的信道并不是像 WebSocket 一样，打通一个浏览器与 WebSocket 服务器之间的通信，而是通过一系列的信令，建立一个浏览器与浏览器之间（peer-to-peer）的信道，这个信道可以发送任何数据，而不需要经过服务器。并且 WebRTC 通过实现 MediaStream，通过浏览器调用设备的摄像头、话筒，使得浏览器之间可以传递音频和视频。

WebRTC 技术将语音视频的采集和编解码全部内嵌到了浏览器中，由此大大简化了视频通信所需的成本，即只需要一个支持 WebRTC 技术的浏览器即可实现视频通信，并且可以跨越不同平台和终端。

WebRTC 有三个模块：Voice Engine（音频引擎），Video Engine（视频引擎）和 Transport。

WebRTC 有三个重要的部分：MediaStream、RTCPeerConnection、RTCDataChannel。

MediaStream

getUserMedia 允许网页浏览器获取摄像头和麦克风的使用权限，并且捕获媒体。通过 MediaStream 的 API 能够通过设备的摄像头及话筒获得音视频的同步流。

1
2
3
navigator.mediaDevices
  .getUserMedia(Constraints)
  .then(stream => {})

getUserMedia(constraints,successCallback,errCallback)，用于获取用户授权提供的音频视频数据流，三个参数分别为约束对象，成功的回调函数，发送错误的回调函数。

注意：只有在 https 环境下才可以正常调用摄像头和麦克风。

具体内容请看 getUserMedia。


RTCPeerConnection

RTCPeerConnection 作为创建点对点连接的 API，是我们实现音视频实时通信的关键。在点对点通信的过程中，需要交换一系列信息，通常这一过程叫做信令（signaling）。在信令阶段需要完成的任务：

  • 为每个连接端创建一个 RTCPeerConnection，并添加本地媒体流
  • 获取并交换本地和远程描述：SDP 格式的本地媒体元数据
  • 获取并交换网络信息：潜在的连接端点称为 ICE 候选者

我们虽然把 WebRTC 称之为点对点的连接，但并不意味实现过程中不需要服务器的参与。因为在点对点的信道建立起来之前，二者之间是没有办法通信的。因此在信令阶段，我们需要一个通信服务来帮助我们建立起这个连接。WebRTC 本身没有指定信令服务，所以，我们可以使用 XMPP、XHR、Socket 等来做信令交换所需的服务。

具体内容请看 RTCPeerConnection。


建立点对点信道的问题是 NAT 穿越技术，在 RTCPeerConnection 中使用 ICE 框架来保证 RTCPeerConnection 能实现 NAT 穿越。

ICE

ICE(Interactive Connectivity Establishment) 交互式连接建立，一种综合性的 NAT 穿越技术，是一种框架，可整合各种 NAT 穿越技术如 STUN、TURN。ICE 会先使用 STUN，尝试建立一个基于 UDP 的连接，如失败了就会去 TCP（先尝试 HTTP，然后尝试 HTTPS），若依旧失败 ICE 就会使用一个中继的 TURN 服务器。

打洞服务器需要我们自己配置：

1
2
3
4
5
6
7
8
9
10
11
12
13
const config = {
    'iceServers': [
        { urls: 'stun:stun.l.google.com:19302' },
        {
            urls: "",  // 服务器地址（turn:ip:port）
            username: "",  // 用户名
            credential: "",  // 密码
            credentialType: "password"
        }
    ]
};

pc = new RTCPeerConnection(config);

在 P2P 连接被创建前，首先必须进行信令处理。为了完成让用户都具有另一端用户的 IP 以及其他任何用户想要共享的涉及数据/视频的信息，信令会在用户和信令服务器之间进行多次往返。

首先呼叫端需要给接收端通过信令服务发送一条名为 offer（SDP） 的信息，接收端在接收到请求后，则通过信令服务返回一条 answer（SDP) 信息给呼叫端。然后在呼叫端和接收端的 ICE 候选信息准备完成后，通过信令服务进行交换，并互相保存对方的信息，这样就完成了一次连接。