WebRTC音视频技术

巴扎黑斯基
308 阅读4分钟

一、什么是WebRTC

WebRTC，名称源自网页即时通信（英语：Web Real-Time Communication）的缩写，是一个支持网页浏览器进行实时语音对话或视频对话的API。它于2011年6月1日开源并在Google、Mozilla、Opera支持下被纳入万维网联盟的W3C推荐标准。

它的使命是为浏览器、移动平台和物联网设备开发构建丰富的、高质量的RTC应用，并允许它们都通过一套通用的协议进行通信。

WebRTC有什么特点和优势？

  • 1、开放源代码,它为浏览器提供了端到端的通信，容易使用。

  • 2、速度提升 不需要通过服务器进行路由，它减少了延迟和带宽消耗。直接通信提高了数据传输与文件共享的速度。

  • 3、不需要第三方应用程序就可以连接互联网上的Peer。

  • 4、易于实现 使用P2P（点对点）连接更加容易。所有的功能都可以通过客户端完成。开发者只需要下载一个与WebRTC兼容的浏览器。

  • 5、兼容性 支持大多数流行的浏览器。

  • 6、提供跨多种浏览器的安全连接。

要连接两个浏览器，Web RTC需要执行五个步骤来建立P2P连接。

1、信号处理，以去除音频或视频中的环境噪声。

2、编解码器处理，以压缩和解压音频或视频。

3、通过防火墙、（NAT）和中继器建立从一个Peer 到另一个Peer的路由，以创建一个ICE(交互式链接建立)。

4、用户数据在进行连接传输前都会进行加密。

5、管理带宽，给每个Peer的带宽不同

二、实现

getUserMedia

navigator.mediaDevices.getUserMedia({ audio: true, video: true }) 
    .then(stream => {
        let video = document.querySelector('#rtc');
        video.srcObject = stream;
    })
    .catch(err => {
        // 捕获错误
    });

RTCPeerConnection

该接口提供了创建，保持，监控，关闭连接的方法的实现。

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

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

可以且不限于使用 XMPP、XHR、Socket 等来做信令交换所需的服务。

PeerConnection中提供的一些API：

  • setLocalDescription：设置本地offer，将自己的描述信息加入到PeerConnection中，参数类型：RTCSessionDescription
  • setRemoteDescription：设置远端的answer，将对方的描述信息加入到PeerConnection中，参数类型：RTCSessionDescription
  • createOffer：创建一个offer，需要传入两个参数，第一个参数是创建offer成功的回调方法，会返回创建好的offer，可以在这里将这个offer发送出去。第二个参数是创建失败的回调方法，会返回错误信息。
  • createAnswer：创建一个answer，需要传入两个参数，第一个参数是创建answer成功的回调方法，会返回创建好的answer，可以在这里将这个answer发送出去。第二个参数是创建失败的回调方法，会返回错误信息。
  • addIceCandidate：将打洞服务器加入到配置信息中，参数类型：RTCIceCandidate
  • addStream：向PeerConnection中加入需要发送的数据流，参数类型：MediaStream
  • ...

网络地址转换（NAT）和ICE

NATs将家庭路由器等设备上的私有IP地址转换为公网IP地址。防火墙和NATs通过阻止特定的协议或端口来减慢这一过程。WebRTC使用的解决方案是ICE框架。

ICE通过并行尝试所有连接并选择最有效的路径，在互联网上建立P2P连接。有两种类型的连接可选 STUN & TURN

STUN服务器为请求者提供了公网IP地址，以便与他人进行通信。其目的是帮助请求者回答 "我的IP地址是啥 "这个问题。

TURN（Traversal Using Relays around NAT）服务器作为中继服务器，以防P2P连接中断。当STUN服务器用于建立连接时，TURN服务器在整个连接过程中保持活跃。

建立连接的过程

* **呼叫端** 创建 offer 信息后，先调用 setLocalDescription 存储本地 offer 描述，再将其发送给 **接收端**。
* **接收端** 收到 offer 后，先调用 setRemoteDescription 存储远端 offer 描述；然后又创建 answer 信息，同样需要调用 setLocalDescription 存储本地 answer 描述，再返回给 **呼叫端**
* **呼叫端** 拿到 answer 后，再次调用 setRemoteDescription 设置远端 answer 描述。
avatar
文章
阅读
粉丝