WebRTC（网络实时通信）是业界为增强网络浏览模式所做的努力。它允许浏览器通过对网络摄像头和麦克风等输入外设的安全访问，以点对点的方式与其他浏览器直接交换实时媒体。
传统的网络架构是基于客户-服务器模式的，客户向服务器发送HTTP请求，并获得包含所需信息的响应。相比之下，WebRTC允许N个对等体之间的数据交换。在这种交换中，对等体相互交谈，中间没有服务器。
WebRTC内置了HTML 5，所以你不需要第三方软件或插件来使用它，你可以通过WebRTC API在浏览器中访问它。
在这篇文章中，你将了解如何以及何时使用WebRTC，以及它与WebSockets的功能相比有何不同：
WebRTC的使用案例
作为一项技术，WebRTC具有广泛的适用性。在本节中，我们将介绍WebRTC是一个不错的选择的不同用例。
点对点的视频、音频和屏幕共享
WebRTC最初是为了促进互联网上的点对点通信，特别是视频和音频通话。现在它被用于更多的用例，包括基于文本的聊天、文件共享和屏幕共享。WebRTC被微软团队、Skype、Slack和谷歌会议等产品所使用。WebRTC还在教育科技和医疗保健领域发现了相关性。
文件交换
WebRTC可以用来分享各种格式的文件，即使没有视频或音频连接。WebTorrent是一个建立在WebRTC架构之上的文件共享应用的例子。
物联网
物联网设备嵌入了软件和传感器，使其有可能处理数据并与互联网或网络上的其他设备交换信息。当需要实时发送或接收数据时，WebRTC很有帮助。例如，如果无人机需要实时发送视频或音频，WebRTC可以使之成为可能。
监控是另一个物联网例子，WebRTC是一个强有力的选择。想想婴儿监视器、保姆摄像头、门铃和家庭摄像头。在这些场景中，WebRTC使其很容易将视频和音频信息流传到智能手机和笔记本电脑上。
娱乐和观众参与
WebRTC被用于娱乐和观众参与，包括增强现实、虚拟现实和游戏--例如，谷歌的游戏平台Stadia就使用了WebRTC的引擎。
实时语言处理
语言处理涉及实时闭合字幕、转录和自动翻译。通过HTML5语音API和WebRTC的数据通道的组合，转录本可以实时地跨平台发送。这方面的一个很好的例子是在YouTube和Google Meets中看到的，那里的封闭式字幕是根据需要自动生成的。
WebRTC的主要特点
WebRTC由几个相互关联的API组成。我们现在将仔细研究其中一些关键的API。MediaStream,RTCPeerConnection, 和RTCDataChannel 。
关于所有WebRTC接口的更多细节可在这里找到。
媒体流
MediaStream 接口旨在让你访问来自本地输入设备的媒体流，如摄像头和麦克风。它作为一种方式来管理数据流上的操作，如记录、发送、调整大小和显示流的内容。要使用一个媒体流，应用程序必须通过getUserMedia() 方法向用户请求访问。使用这个方法，你可以指定你是否只需要视频、音频或两者的权限。
要在一个网页上进行测试，你需要一个网络服务器。在浏览器中打开一个HTML文件是行不通的，因为安全和权限措施不允许它连接到摄像头或麦克风，除非它是由一个实际的服务器提供的。然而，一个简单的Node.js服务器可以帮助解决这个问题。
要开始使用，请下载并安装Node.js。然后打开终端或命令行界面，输入npm install -g node-static 。现在你可以很容易地提供一个静态文件。现在你可以导航到任何包含你想在服务器上托管的HTML文件的目录。
要做到这一点，创建一个名为index.html 的文件，并添加以下内容：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>MediaStream</title>
</head>
<body>
<video autoplay></video>
<script src="index.js"></script>
</body>
</html>
然后在同一目录下创建一个index.js 文件，并添加以下内容：
const streamOptions = {
video: true,
audio: true
}
function mediaStreamSuccess (stream) {
var video = document.querySelector('video');
video.srcObject = stream;
}
function mediaStreamError (error) {
alert("Sorry, your browser does not support getUserMedia.");
console.log(error)
}
navigator.mediaDevices.getUserMedia(streamOptions)
.then(mediaStreamSuccess).catch(mediaStreamError)
在终端目录中，运行static，它应该运行一个本地服务器。然后打开http://127.0.0.1:8080，你应该看到摄像头和麦克风的权限提示：
一旦权限被授予，你应该看到一个具有音频功能的视频信号。
RTCPeerConnection
RTCPeerConnection 对象是进入WebRTC API的主要入口点。它允许你启动一个连接，连接到对等体，并附加媒体流信息。
通常情况下，连接到另一个浏览器需要找到其他浏览器在网络上的位置。这通常是以一个IP地址和一个端口号的形式出现，这就像一个街道地址，可以导航到你的目的地。你的电脑或移动设备的IP地址让其他支持互联网的设备之间直接发送数据，也是RTCPeerConnection 的基础。
如果你想看看RTCPeerConnection ，你可以在GitHub Gist上下载代码。然后，在你的终端，运行static并右键点击peerconnection.html 。 之后，你可以用你的浏览器打开它，你应该看到如下图所示的东西。
RTCDataChannel
RTCDataChannel API旨在提供一种传输服务，允许网络浏览器以双向、点对点的方式交换通用数据。它使用流控制传输协议（SCTP）作为在现有的对等连接之上发送数据的方式。
每次对CreateDataChannel() 函数的后续调用都会在现有的SCTP关联中创建一个新的数据通道。创建数据通道的主要功能是RTCPeerConnection 对象。
var peerConnection = new RTCPeerConnection();
var dataChannel = peerConnection.createDataChannel('myLabel', {});
dataChannel.onerror = function (error) {
console.log('Data Channel error:', error);
}
dataChannel.onmessage = function (event) {
console.log('Data Channel message:', message);
}
dataChannel.onopen = function () {
console.log('Data Channel open for sending messages!');
dataChannel.send('Hello World');
}
dataChannel.onclose = function () {
console.log('Data Channel has been closed.');
}
dataChannel 事件是直截了当和直观的使用。你只有在 事件发生后才能发送消息。 方法可以接受 , , 或 类型。如果你把你的数据作为 方法的变量，你的浏览器会处理其余的事情。onopen send String Blob ArrayBuffer send
WebRTC与WebSockets相比有何不同？
WebSocket是一种技术，它使网络客户端和网络服务器之间能够通过持久的单套接字连接进行双向、全双工通信。这使得客户端和服务器可以随意交换低延迟、事件驱动的消息，而不需要轮询。值得注意的是，WebSocket协议工作在TCP之上，这是一个可靠的协议（保证订购和交付）。
相比之下，WebRTC使网络浏览器能够以点对点的方式进行通信。WebRTC可以在TCP上工作，但它主要在UDP上使用，这种协议的可靠性不如TCP（尽力交付，但没有保证），但也更快。
如果数据的完整性对你的使用情况至关重要，你应该使用WebSockets以受益于TCP的可靠性。另一方面，如果速度更重要，而且丢失一些数据包对你的使用情况来说是可以接受的（就像视频和音频流一样），那么UDP的WebRTC是一个更好的选择。
WebSockets和WebRTC实际上常常是相互补充的。WebRTC允许点对点通信，但它仍然需要服务器，以便客户端可以通过一个称为信令的过程交换元数据以协调通信。然而，WebRTC API本身并不提供信令机制。这是你必须单独实现的东西，而WebSockets是实时信令的最佳选择。
哪些组织使用WebRTC？
WebRTC，作为一个针对浏览器的网络标准，最初于2011年发布。从那时起，它就在大多数现代浏览器中得到了大规模的采用。它也被一些主要的组织用于Google Meets、Zoom、Skype、Facebook（聊天、Messenger、Live）、Gatheround、Discord、Bevy和Snapchat等应用。也有许多用WebRTC构建的开源项目。
WebRTC和Ably
Ably是一个功能丰富、高度可靠的解决方案，它提供了强大的、易于使用的API，为数百万并发连接的设备提供实时和协作体验。您可以使用我们的WebSocket API，为WebRTC应用快速实现可靠的信令机制。开始使用免费的Ably账户，并查看下面进一步阅读部分中列出的教程，以了解详情。
