众所周知，浏览器本身不支持相互之间直接建立信道进行通信，都是通过服务器进行中转。比如现在有两个客户端，甲和乙，他们俩想要通信，首先需要甲和服务器、乙和服务器之间建立信道。甲给乙发送消息时，甲先将消息发送到服务器上，服务器对甲的消息进行中转，发送到乙处，反过来也是一样。这样甲与乙之间的一次消息要通过两段信道，通信的效率同时受制于这两段信道的带宽。同时这样的信道并不适合数据流的传输，如何建立浏览器之间的点对点传输，一直困扰着开发者。WebRTC应运而生。
WebRTC，名称源自网页实时通信（Web Real-Time Communication）的缩写，是一项实时通讯技术，它允许网络应用或者站点，在不借助中间媒介的情况下，建立浏览器之间点对点（Peer-to-Peer）的连接，实现视频流和（或）音频流或者其他任意数据的传输，支持网页浏览器进行实时语音对话或视频对话。WebRTC包含的这些标准使用户在无需安装任何插件或者第三方的软件的情况下，创建点对点（Peer-to-Peer）的数据分享和电话会议成为可能。它是谷歌2010年以6820万美元收购Global IP Solutions公司而获得的一项技术。2011年5月开放了工程的源代码，在行业内得到了广泛的支持和应用，成为下一代视频通话的标准。
WebRTC是一个开源项目，旨在使得浏览器能为实时通信（RTC）提供简单的JavaScript接口。说的简单明了一点就是让浏览器提供JS的即时通信接口。这个接口所创立的信道并不是像WebSocket一样，打通一个浏览器与WebSocket服务器之间的通信，而是通过一系列的信令，建立一个浏览器与浏览器之间（peer-to-peer）的信道，这个信道可以发送任何数据，而不需要经过服务器。并且WebRTC通过实现MediaStream，通过浏览器调用设备的摄像头、话筒，使得浏览器之间可以传递音频和视频。
关键要认识到的是，点对点并不意味着不涉及服务器，这只是意味着正常的数据没有经过它们。至少，两台客户机仍然需要一台服务器来交换一些基本信息（我在网络上的哪些位置，我支持哪些编解码器），以便他们可以建立对等的连接。用于建立对等连接的信息被称为信令，而服务器被称为信令服务器。
WebRTC没有规定您使用什么信令服务器或什么协议。 Websockets是最常见的，但也可以使用长轮询甚至电子邮件。
这么好的功能，各大浏览器厂商自然不会置之不理。现在WebRTC已经可以在较新版的Chrome、Opera和Firefox、Edge中使用了，著名的浏览器兼容性查询网站caniuse上给出了一份详尽的浏览器兼容情况：
另外：编写本地WebRTC客户端也是可能的。
WebRTC实现了基于网页的视频会议，标准是WHATWG 协议，目的是通过浏览器提供简单的javascript就可以达到实时通讯（Real-Time Communications (RTC)）能力。
WebRTC（Web Real-Time Communication）项目的最终目的主要是让Web开发者能够基于浏览器（Chrome\FireFox...）轻易快捷开发出丰富的实时多媒体应用，而无需下载安装任何插件，Web开发者也无需关注多媒体的数字信号处理过程，只需编写简单的Javascript程序即可实现，W3C等组织正在制定Javascript 标准API，目前是WebRTC 1.0版本，Draft状态；另外WebRTC还希望能够建立一个多互联网浏览器间健壮的实时通信的平台，形成开发者与浏览器厂商良好的生态环境。同时，Google也希望和致力于让WebRTC的技术成为HTML5标准之一，可见Google布局之深远。
WebRTC提供了视频会议的核心技术，包括音视频的采集、编解码、网络传输、显示等功能，并且还支持跨平台：windows，linux，mac，android。
架构图颜色标识说明：
（1）紫色部分是Web开发者API层；
（2）蓝色实线部分是面向浏览器厂商的API层（也就是红色框标内模块，也是本人专注研究的部分）;
（3）蓝色虚线部分浏览器厂商可以自定义实现。
(1) Your Web App Web开发者开发的程序，Web开发者可以基于集成WebRTC的浏览器提供的web API开发基于视频、音频的实时通信应用。
(2) Web API 面向第三方开发者的WebRTC标准API（Javascript），使开发者能够容易地开发出类似于网络视频聊天的web应用，最新的标准化进程可以查看这里。 (3) WebRTC Native C++ API 本地C++ API层，使浏览器厂商容易实现WebRTC标准的Web API，抽象地对数字信号过程进行处理。
(4) Transport / Session
传输/会话层，会话层组件采用了libjingle库的部分组件实现，无须使用xmpp/jingle协议
a. RTP Stack协议栈 Real Time Protocol b. STUN/ICE 可以通过STUN和ICE组件来建立不同类型网络间的呼叫连接。 c. Session Management 一个抽象的会话层，提供会话建立和管理功能。该层协议留给应用开发者自定义实现。
(5) VoiceEngine 音频引擎是包含一系列音频多媒体处理的框架，包括从视频采集卡到网络传输端等整个解决方案。 PS：VoiceEngine是WebRTC极具价值的技术之一，是Google收购GIPS公司后开源的。在VoIP上，技术业界领先，后面的文章会详细了解
a. iSAC
Internet Speech Audio Codec
针对VoIP和音频流的宽带和超宽带音频编解码器，是WebRTC音频引擎的默认的编解码器 采样频率：16khz，24khz，32khz；（默认为16khz） 自适应速率为10kbit/s ~ 52kbit/； 自适应包大小：30~60ms； 算法延时：frame + 3ms
b. iLBC Internet Low Bitrate Codec VoIP音频流的窄带语音编解码器 采样频率：8khz； 20ms帧比特率为15.2kbps 30ms帧比特率为13.33kbps 标准由IETF RFC3951和RFC3952定义
c. NetEQ for Voice
针对音频软件实现的语音信号处理元件
NetEQ算法：自适应抖动控制算法以及语音包丢失隐藏算法。使其能够快速且高解析度地适应不断变化的网络环境，确保音质优美且缓冲延迟最小。是GIPS公司独步天下的技术，能够有效的处理由于网络抖动和语音包丢失时候对语音质量产生的影响。
PS：NetEQ 也是WebRTC中一个极具价值的技术，对于提高VoIP质量有明显效果，加以AEC\NR\AGC等模块集成使用，效果更好。
d. Acoustic Echo Canceler (AEC) 回声消除器是一个基于软件的信号处理元件，能实时的去除mic采集到的回声。
e. Noise Reduction (NR) 噪声抑制也是一个基于软件的信号处理元件，用于消除与相关VoIP的某些类型的背景噪声（嘶嘶声，风扇噪音等等… …）
(6) VideoEngine WebRTC视频处理引擎 VideoEngine是包含一系列视频处理的整体框架，从摄像头采集视频到视频信息网络传输再到视频显示整个完整过程的解决方案。
a. VP8 视频图像编解码器，是WebRTC视频引擎的默认的编解码器 VP8适合实时通信应用场景，因为它主要是针对低延时而设计的编解码器。 PS:VPx编解码器是Google收购ON2公司后开源的，VPx现在是WebM项目的一部分，而WebM项目是Google致力于推动的HTML5标准之一
b. Video Jitter Buffer 视频抖动缓冲器，可以降低由于视频抖动和视频信息包丢失带来的不良影响。
c. Image enhancements 图像质量增强模块 对网络摄像头采集到的图像进行处理，包括明暗度检测、颜色增强、降噪处理等功能，用来提升视频质量。
WebRTC实现了多个Web API接口，其中三个主要的Web API分别是:
- **MediaStream：**通过MediaStream的API能够通过设备的摄像头及话筒获得视频、音频的同步流。
- **RTCPeerConnection：**RTCPeerConnection是WebRTC用于构建点对点之间稳定、高效的流传输的组件。
- **RTCDataChannel：**RTCDataChannel使得浏览器之间（点对点）建立一个高吞吐量、低延时的信道，用于传输任意数据。
这里大致介绍一下这三个API：
MediaStream API为WebRTC提供了从设备的摄像头、话筒获取视频、音频流数据的功能.
详见：https://w3c.github.io/mediacapture-main/getusermedia.html
可以通过navigator.getUserMedia()这个方法来调用，这个方法接受三个参数：
- 一个约束对象（constraints object），这个后面会单独讲。
- 一个调用成功的回调函数，如果调用成功，传递给它一个流对象。
- 一个调用失败的回调函数，如果调用失败，传递给它一个错误对象。
由于浏览器实现不同，他们经常会在实现标准版本之前，在方法前面加上前缀，所以一个兼容版本就像这样：
var getUserMedia = (navigator.getUserMedia ||
navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia ||
navigator.msGetUserMedia);这里写一个超级简单的例子，用来展现getUserMedia的效果：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>GetUserMedia实例</title>
</head>
<body>
<video id="video" autoplay></video>
</body>
<script type="text/javascript">
var getUserMedia = (navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia);
getUserMedia.call(navigator, {
video: true,
audio: true
}, function(localMediaStream) {
var video = document.getElementById('video');
video.src = window.URL.createObjectURL(localMediaStream);
video.onloadedmetadata = function(e) {
console.log("Label: " + localMediaStream.label);
console.log("AudioTracks" , localMediaStream.getAudioTracks());
console.log("VideoTracks" , localMediaStream.getVideoTracks());
};
}, function(e) {
console.log('Rejected!', e);
});
</script>
</html>将这段内容保存在一个HTML文件中，放在服务器上。用较新版本的Opera、Firefox、Chrome打开，在浏览器弹出询问是否允许访问摄像头和话筒，选同意，浏览器上就会出现摄像头所拍摄到的画面了.
注意，HTML文件要放在服务器上，否则会得到一个NavigatorUserMediaError的错误，显示PermissionDeniedError。
这里使用getUserMedia获得流之后，需要将其输出，一般是绑定到video标签上输出，需要使用**window.URL.createObjectURL(localMediaStream)**来创造能在video中使用src属性播放的Blob URL，注意在video上加入autoplay属性，否则只能捕获到一张图片
流创建完毕后可以通过label属性来获得其唯一的标识，还可以通过**getAudioTracks()和getVideoTracks()**方法来获得流的追踪对象数组（如果没有开启某种流，它的追踪对象数组将是一个空数组）
约束对象可以被设置在getUserMedia()和RTCPeerConnection的addStream方法中，这个约束对象是WebRTC用来指定接受什么样的流的，其中可以定义如下属性：
- video: 是否接受视频流
- audio：是否接受音频流
- MinWidth: 视频流的最小宽度
- MaxWidth：视频流的最大宽度
- MinHeight：视频流的最小高度
- MaxHiehgt：视频流的最大高度
- MinAspectRatio：视频流的最小宽高比
- MaxAspectRatio：视频流的最大宽高比
- MinFramerate：视频流的最小帧速率
- MaxFramerate：视频流的最大帧速率
WebRTC使用RTCPeerConnection来在浏览器之间传递流数据，这个流数据通道是点对点的，不需要经过服务器进行中转。但是这并不意味着我们能抛弃服务器，我们仍然需要它来为我们传递信令（signaling）来建立这个信道。WebRTC没有定义用于建立信道的信令的协议：信令并不是RTCPeerConnection API的一部分。
既然没有定义具体的信令的协议，我们就可以选择任意方式（AJAX、WebSocket），采用任意的协议（SIP、XMPP）来传递信令，建立信道。比如可以使用node的ws模块，在WebSocket上传递信令。
需要信令来交换的信息有三种：
- session的信息：用来初始化通信还有报错
- 网络配置：比如IP地址和端口啥的
- 媒体适配：发送方和接收方的浏览器能够接受什么样的编码器和分辨率
这些信息的交换应该在点对点的流传输之前就全部完成，一个大致的架构图如下：
JSEP architecture
这里再次重申，就算WebRTC提供浏览器之间的点对点信道进行数据传输，但是建立这个信道，必须有服务器的参与。WebRTC需要服务器对其进行四方面的功能支持：
- 用户发现以及通信；
- 信令传输；
- NAT/防火墙穿越；
- 如果点对点通信建立失败，可以作为中转服务器。
建立点对点信道的一个常见问题，就是NAT穿越技术。在处于使用了NAT设备的私有TCP/IP网络中的主机之间需要建立连接时需要使用NAT穿越技术。以往在VoIP领域经常会遇到这个问题。目前已经有很多NAT穿越技术，但没有一项是完美的，因为NAT的行为是非标准化的。这些技术中大多使用了一个公共服务器，这个服务使用了一个从全球任何地方都能访问得到的IP地址。在RTCPeeConnection中，使用ICE框架来保证RTCPeerConnection能实现NAT穿越。
ICE，全名叫交互式连接建立（Interactive Connectivity Establishment）,一种综合性的NAT穿越技术，它是一种框架，可以整合各种NAT穿越技术如STUN、TURN（Traversal Using Relay NAT 中继NAT实现的穿透）。ICE会先使用STUN，尝试建立一个基于UDP的连接，如果失败了，就会去尝试TCP（先尝试HTTP，然后尝试HTTPS），如果依旧失败ICE就会使用一个中继的TURN服务器。
我们可以使用Google的STUN服器：stun:stun.l.google.com:19302，于是乎，一个整合了ICE框架的架构应该长这个样子 ：
Finding connection candidates
WebRTC data pathways
还是前缀不同的问题，采用和上面类似的方法：
var PeerConnection = (window.PeerConnection ||
window.webkitPeerConnection00 ||
window.webkitRTCPeerConnection ||
window.mozRTCPeerConnection);WebRTC重用了libjingle的一些组件，主要是network和transport组件，关于libjingle的文档资料可以查看这里。
常量\VideoEngine\VoiceEngine
注意：以下所有的方法、类、结构体、枚举常量等都在webrtc命名空间里
| 类、结构体、枚举常量 | 头文件 | 说明 |
|---|---|---|
| Structures | common_types.h | Lists the structures common to the VoiceEngine & VideoEngine |
| Enumerators | common_types.h | List the enumerators common to the VoiceEngine & VideoEngine |
| Classes | common_types.h | List the classes common to VoiceEngine & VideoEngine |
| class VoiceEngine | voe_base.h | How to allocate and release resources for the VoiceEngine using factory methods in the VoiceEngine class. It also lists the APIs which are required to enable file tracing and/or traces as callback messages |
| class VideoEngine | vie_base.h | How to allocate and release resources for the VideoEngine using factory methods in the VideoEngine class. It also lists the APIs which are required to enable file tracing and/or traces as callback messages |
下表列的是目前在 VoiceEngine中可用的sub APIs
| sub-API | 头文件 | 说明 |
|---|---|---|
| VoEAudioProcessing | voe_audio_processing.h | Adds support for Noise Suppression (NS), Automatic Gain Control (AGC) and Echo Control (EC). Receiving side VAD is also included. |
| VoEBase | voe_base.h | Enables full duplex VoIP using G.711.NOTE: This API must always be created. |
| VoECallReport | voe_call_report.h | Adds support for call reports which contains number of dead-or-alive detections, RTT measurements, and Echo metrics. |
| VoECodec | voe_codec.h | Adds non-default codecs (e.g. iLBC, iSAC, G.722 etc.), Voice Activity Detection (VAD) support. |
| VoEDTMF | voe_dtmf.h | Adds telephone event transmission, DTMF tone generation and telephone event detection. (Telephone events include DTMF.) |
| VoEEncryption | voe_encryption.h | Adds external encryption/decryption support. |
| VoEErrors | voe_errors.h | Error Codes for the VoiceEngine |
| VoEExternalMedia | voe_external_media.h | Adds support for external media processing and enables utilization of an external audio resource. |
| VoEFile | voe_file.h | Adds file playback, file recording and file conversion functions. |
| VoEHardware | voe_hardware.h | Adds sound device handling, CPU load monitoring and device information functions. |
| VoENetEqStats | voe_neteq_stats.h | Adds buffer statistics functions. |
| VoENetwork | voe_network.h | Adds external transport, port and address filtering, Windows QoS support and packet timeout notifications. |
| VoERTP_RTCP | voe_rtp_rtcp.h | Adds support for RTCP sender reports, SSRC handling, RTP/RTCP statistics, Forward Error Correction (FEC), RTCP APP, RTP capturing and RTP keepalive. |
| VoEVideoSync | voe_video_sync.h | Adds RTP header modification support, playout-delay tuning and monitoring. |
| VoEVolumeControl | voe_volume_control.h | Adds speaker volume controls, microphone volume controls, mute support, and additional stereo scaling methods. |
下表列的是目前在 VideoEngine中可用的sub APIs
| sub-API | 头文件 | 说明 |
|---|---|---|
| ViEBase | vie_base.h | Basic functionality for creating a VideoEngine instance, channels and VoiceEngine interaction.NOTE: This API must always be created. |
| ViECapture | vie_capture.h | Adds support for capture device allocation as well as capture device capabilities. |
| ViECodec | vie_codec.h | Adds non-default codecs, codec settings and packet loss functionality. |
| ViEEncryption | vie_encryption.h | Adds external encryption/decryption support. |
| ViEErrors | vie_errors.h | Error codes for the VideoEngine |
| ViEExternalCodec | vie_external_codec.h | Adds support for using external codecs. |
| ViEFile | vie_file.h | Adds support for file recording, file playout, background images and snapshot. |
| ViEImageProcess | vie_image_process.h | Adds effect filters, deflickering, denoising and color enhancement. |
| ViENetwork | vie_network.h | Adds send and receive functionality, external transport, port and address filtering, Windows QoS support, packet timeout notification and changes to network settings. |
| ViERender | vie_render.h | Adds rendering functionality. |
| ViERTP_RTCP | vie_rtp_rtcp.h | Adds support for RTCP reports, SSRS handling RTP/RTCP statistics, NACK/FEC, keep-alive functionality and key frame request methods. |
###Specifications:
- WebRTC 1.0: Real-time Communication Between Browsers：https://www.w3.org/TR/webrtc/
- Media Capture and Streams：https://w3c.github.io/mediacapture-main/
- Media Capture from DOM Elements：https://w3c.github.io/mediacapture-fromelement/
###Getting started: WebRTC官方网站：https://webrtc.org/start/
###Tutorials: https://www.html5rocks.com/en/tutorials/webrtc/basics/
###WebRTC API: https://developer.mozilla.org/zh-CN/docs/Web/API/WebRTC_API
###WebRTC codelab: A step-by-step guide that explains how to build a complete video chat app, including a simple signaling server. https://www.bitbucket.org/webrtc/codelab
###Javascript frameworks
- Video chat:
- https://github.com/andyet/SimpleWebRTC
- https://github.com/priologic/easyrtc
- https://github.com/webRTC-io/webRTC.io
- Peer-to-peer data:
###Demos: https://webrtc.github.io/samples/
###WebRTC提供商:
- 国外:
- https://xirsys.com
- https://tokbox.com/developer/
- https://cloud.aculab.com/documents/webrtcdemo
- https://www.twilio.com/webrtc
- http://www.frafos.com/webrtc/
- http://www.sightcall.com/
- 国内: