WebRTC 的核心：RTCPeerConnection

WebRTC 的核心：RTCPeerConnection

  • WebRTC 的核心：RTCPeerConnection
    • 创建 RTCPeerConnection 对象
    • RTCPeerConnection 与本地音视频数据绑定
    • 媒体协商
    • ICE
      • 什么是 Candidate？
      • 收集 Candidate
      • 交换 Candidate
      • 尝试连接
    • SDP 与 Candidate 消息的互换
    • 远端音视频渲染
    • 参考

WebRTC 的核心：RTCPeerConnection

RTCPeerConnection 是 WebRTC API 中的一个对象，它提供了两个浏览器之间的实时通信。它使用音频、视频和数据流来进行点对点通讯，没有中介服务器的参与。这是一个极其有用的特性，使得实时通信变得更加高效和私密。

RTCPeerConnection的作用是在两个浏览器之间建立WebRTC通信通道。它使用ICE（Interactive Connectivity Establishment）协议决定浏览器之间的最佳路径来传输音频、视频和数据流。它让浏览器之间的网络连接变得简单、快捷和高效。
RTCPeerConnection API可以用于：

  1. 视频会议
  2. 实时游戏
  3. 文件共享
  4. 流媒体
  5. 实时语音聊天

创建 RTCPeerConnection 对象

语法：

new RTCPeerConnection()
new RTCPeerConnection(configuration)

参数 configuration 是一个 JSON 对象，用于提供配置新连接的选项。

在这里插入图片描述

  1. iceServers：一个由 RTCIceServer 对象组成的数组，每个对象描述一个可能被 ICE 代理使用的服务器。这些通常是 STUN 或 TURN 服务器。如果未指定，则将在没有可用的 STUN 或 TURN 服务器的情况下进行连接尝试，这将连接限制为本地对等点。
  2. iceTransportPolicy：当前的 ICE 传输策略。如果未指定策略，则默认使用 all 策略，允许考虑所有的候选。可能的值有：
    • “all”：所有的 ICE 候选都会被考虑。
    • “public”：只有拥有公共 IP 地址的 ICE 候选才会被考虑，已被移除。
    • “relay”：只有 IP 地址被中继的 ICE 候选，例如那些通过 STUN 或 TURN 服务器传递的，才会被考虑。
  3. bundlePolicy：指定当远程对等点与 SDP BUNDLE 标准不兼容时，应如何处理候选的协商。如果远程端点可以感知 BUNDLE，则在协商完成时，所有媒体轨道和数据通道都将捆绑到单个传输上，而不管使用何种策略，并且最初创建的任何多余传输都将在此时关闭。用技术术语来说，BUNDLE 允许两个对等点之间的所有媒体流流经单个 5 元组；也就是说，使用相同的传输协议从一个对等点的单个 IP 和端口到另一个对等点的单个 IP 和端口。如果假定为不平衡（balanced），这必须是以下字符串值之一：
    • “balanced”：ICE 代理最初为每一种内容类型（音频、视频、数据通道）创建一个 RTCDtlsTransport。如果远程端点无法感知 BUNDLE，那么每一个 DTLS 传输用于处理一种数据类型的通信。
    • “max-compat”：ICE 代理最初为每个媒体轨道创建一个 RTCDtlsTransport，对数据通道则创建一个单独的传输。如果远程端点无法感知 BUNDLE，那么对于所有的内容都会协商一个单独的 DTLS 传输。
    • “max-bundle”：ICE 代理最初仅创建一个 RTCDtlsTransport 来承载所有的 RTCPeerConnection 的数据。如果远程端点无法感知 BUNDLE，那么仅会协商一个轨道而忽略其余的轨道。
  4. rtcpMuxPolicy：收集 ICE 候选时使用的 RTCP mux 策略，以支持非复用的 RTCP。可能的值有：
    • “require”：告诉 ICE 代理仅收集 RTP 的 ICE 候选，并在它们之上多路复用 RTCP。如果远程对等点不支持 RTCP 多路复用，则会话协商失败。这是默认值。
    • “negotiate”：指示 ICE 代理收集 RTP 和 RTCP 候选。如果远程对等点支持 RTCP 复用，那么 RTCP 候选将在相应的 RTP 候选之上多路复用。否则，分别返回 RTP 和 RTCP 候选。
  5. peerIdentity：一个字符串，用于指定 RTCPeerConnection 目标对等点的标识。如果设置了该值（其默认为 null），则在成功验证远程对等点的身份为给定的名称之前，RTCPeerConnection 不会与其建立连接。
  6. certificates：一个由 RTCCertificate 对象组成的数组，用于连接的身份验证。如果未指定该属性，则会为每一个 RTCPeerConnection 实例自动创建一组证书。尽管一个给定的连接只使用一个证书，但提供多个证书可以支持多种算法，从而提高某些情况下的连接成功的机率。此配置选项在首次指定后便不能更改；一旦设置了证书，此属性将在之后调用 RTCPeerConnection.setConfiguration() 时被忽略。
  7. iceCandidatePoolSize：一个无符号 16 位整数，其指定了预获取的 ICE 候选池的大小。其默认值为 0（表示不会发生候选的预获取）。如果这个值发生变化了，那么会重新收集候选者。

RTCPeerConnection 与本地音视频数据绑定

RTCPeerConnection 提供2种方法进行数据绑定：addTrack() 和 addStream()。

其中 addStream() 已经被 WebRTC 标记为过时，因此建议使用 addTrack() 方法。

当客户端从服务端接收到 joined 消息后，它会创建 RTCPeerConnection 对象，然后调用 bindTrack() 函数将其与之前通过 getUserMedia() 采集到的音视频数据绑定：

function bindTrack() {...ls.getTracks().foreach((track) => {pc.addTrack(track, ls);...})...
}

其中，ls 是一个全局变量，当通过 getUserMedia() 采集到 MediaStream 后，需要将其交由 ls 管理；pc 是 RTCPeerConnection 的缩写，也是一个全局变量，当 RTCPeerConnection 创建好后，交由 pc 管理。

媒体协商

当 RTCPeerConnection 对象与音视频数据绑定后，紧接着需要进行媒体协商。看双方都支持那些编码方式，支持哪些分辨率等。协商的方法是通过信令服务器交换媒体能力信息，交换的内容是 SDP 格式的。

在 WebRTC 中，媒体协商是有严格的协商顺序的，如下图所示：

在这里插入图片描述

整个过程分为 8 步：

  1. Amy 调用 createOffer 方法创建 offer 消息。offer 消息中的内容是 Amy 的 SDP 信息。
  2. Amy 调用 setLocalDescription 方法，将本端的 SDP 信息保存起来。
  3. Amy 将 offer 消息通过信令服务器传给 Bob。
  4. Bob 收到 offer 消息后，调用 setRemoteDescription 方法将其存储起来。
  5. Bob 调用 createAnswer 方法创建 answer 消息， 同样，answer 消息中的内容是 Bob 的 SDP 信息。
  6. Bob 调用 setLocalDescription 方法，将本端的 SDP 信息保存起来。
  7. Bob 将 anwser 消息通过信令服务器传给 Amy。
  8. Amy 收到 anwser 消息后，调用 setRemoteDescription 方法，将其保存起来。

通过以上步骤就完成了通信双方媒体能力的交换。

ICE

当媒体协商完成后，WebRTC 就开始建立网络连接了，其过程叫 ICE（Interactive Connectivity Establishment，交互式连接建立）。更确切地说，ICE 是在各端调用 setRemoteDescription 方法后就开始了。其操作过程如下：

  1. 收集 Candidate
  2. 交换 Candidate
  3. 按优先级尝试连接

什么是 Candidate？

Candidate 是 WebRTC API 的接口之一，表示用于建立 RTCPeerConnection 的候选交互连接建立（ICE）的配置信息。它是至少包含 {address, port, protocol} 三元组的一个信息集。

RTCIceCandidate 实例属性：

  1. candidate：表示用于连接检查的候选者的传输地址的字符串。
    格式为：a=candidate:{foundation} {component} {protocol} {priority} {ip} {port} typ {type} generation {generation} ufrag {username} network_id {id} network_cost {cost}。
    以如下 candidate 为例说明其代表的含义：a=candidate:1221703924 1 udp 2122260223 192.168.0.105 51417 typ host generation 0 ufrag Q8Wv network-id 1 network-cost 10。
    typ host 表示本地候选者，使用的 IP 是 192.168.0.105，端口为 51417，使用 UDP 协议，其优先级为 2122260223，generation 表示代数，初始值为 0，用户名为 Q8Wv，如果更新 candidate 则 generation 值会递增，替换老的 candidate。
  2. sdpMid：表示候选者的媒体流标识标签的字符串，该标签在候选者关联的组件中唯一标识媒体流，如果不存在这样的关联，则为 null。
  3. sdpMLineIndex：如果值不为 null，sdpMLineIndex 表示 SDP 中候选者关联的从零开始的媒体描述索引编号。

其他更多属性见于：RTCIceCandidate

WebRTC 还将 Candidate 分为了四种类型：host、srflx、prflx、relay，它们的优先级依次递减。假如 WebRTC 收集到两个 Candidate，一个是 host 类型，另一个是 relay 类型，那么 WebRTC 会先尝试与 host 类型的 Candidate 建立连接，如果不成功，才会使用 relay 类型的 Candidate。

收集 Candidate

WebRTC 收集 Candidate 时有几种途径：

  1. host 类型的 Candidate 由主机的网卡个数决定。一般一个网卡对于一个 IP 地址，每个 IP 地址随机分配一个端口从而生成一个 host 类型的 Candidate；
  2. srflx 类型的 Candidate 由 STUN 服务器获得的 IP 地址和端口生成；
  3. relay 类型的 Candidate 由 TRUN 服务器获得的 IP 地址和端口生成。

收集到 Candidate 后，为了通知上层，WebRTC 还在 RTCPeerConnection 对象中提供了 onicecandidate 事件。为了将收集到的 Candidate 交换给对端，需要为 onicecandidate 事件设置一个回调函数：

pc.onicecandidate = (e) => {if (e.candidate) {...}
}

通过该回调函数就可以获得 WebRTC 底层收集到的所有 Candidate 了。同时，还可以在函数内实现发送给对端的操作。

交换 Candidate

WebRTC 收集 Candidate 后，会通过信令系统将它们发送给对端。对端接收后，会与本地的 Candidate 形成 CandidatePair（连接候选者对）。

有了 CandidatePair，WebRTC 就可以开始尝试建立连接了。

注意，Candidate 的交换不是等所有 Candidate 收集好了再进行的，而是边收集边交换。

尝试连接

当 WebRTC 形成 CandidatePair 后，便开始尝试进行连接。一旦发现一个可以连通的 CandidatePair 时，就不再进行其他的连接尝试了，但发现新的 Candidate 时仍然可以继续交换。

SDP 与 Candidate 消息的互换

媒体协商和 ICE 都需要通信双方做信息的交换，如交换 SDP 和 Candidate。这种信息交换使用的也是信令系统，只不过需要为这种需求专门设置一个新的信令，即 message。

信息交换的过程：

  1. 发起方向信令服务器发送 message；
  2. 服务器收到 message 后不做任何处理，直接转发给目标用户；
  3. 目标用户接收 message。

客户端发送消息：

function sendMsg(roomid, data) {...socket.emit('message', roomid, data);
}

服务器转发：

socket.on('message', (room, data) => {socket.to(room).emit('message', room, data);
});

客户端接收：

socket.on('message', (room, data) => {...if (data.hasOwnProperty('type') && data.type === 'offer') {...} else if (data.hasOwnProperty('type') && data.type === 'answer') {...} else if (data.hasOwnProperty('type') && data.type === 'candidate') {...} else {...}
});

远端音视频渲染

当各端将收集到的 Candidate 通过信令系统交换给对方后，WebRTC 内部就开始就开始尝试建立连接了。连接一旦建成，音视频数据就开始源源不断地由发送端发送给接收端。

每当有远端的音视频数据传过来时，RTCPeerConnection 对象的 ontrack() 事件就会被触发。因此只需要给 ontrack() 事件设置一个回调函数，就可以拿到远端的 MediaStream 了。再将远端音视频流赋值给本地 <video> 标签的 srcObject 属性，就可以播放音视频数据了。

具体代码如下所示：

function getRemoteStream(mediaStream) {...// 将远端音视频流赋值给本地 <video> 标签的 srcObject 属性videoElement.srcObject = mediaStream;
}
let pc = new RTCPeerConnection(...);
...
pc.ontrack = getRemoteStream;
...

参考

  1. https://developer.mozilla.org/zh-CN/docs/Web/API/RTCPeerConnection
  2. https://www.cnblogs.com/ssyfj/p/14811253.html
  3. https://webrtc.org.cn/webrtc-tutorial-2-signaling-stun-turn/

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/diannao/9948.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

线程同步--互斥锁，读写锁

线程同步--互斥锁，读写锁

线程同步 基本概念 线程的能力在于能够方便地通过全局变量或共享内存来交换信息&#xff0c;但这也带来了并发控制的复杂性&#xff0c;主要表现在如何安全地管理多个线程对共享资源的访问。这里涉及到几个关键的概念和技术&#xff1a; 临界区&#xff08;Critical Section…
阅读更多...
jenkins部署想定报错

jenkins部署想定报错

报错&#xff1a; 解决办法&#xff1a; 登录被编译的设备&#xff0c;清楚旧代码&#xff0c;在重新执行
阅读更多...
Dependencies：查找项目中dll关联文件是否缺失。

Dependencies：查找项目中dll关联文件是否缺失。

前言 Dependencies工具作为一款优秀的DLL解析工具&#xff0c;能让你很直观地看到DLL的相关信息&#xff0c;如具备哪些功能函数、参数&#xff0c;又比如该DLL基于哪些DLL运行。判断该dll基于哪些dll运行&#xff0c;如果基于的dll丢失&#xff0c;那么就会提示。就能判断缺少…
阅读更多...
【Ubuntu永久授权串口设备读取权限‘/dev/ttyUSB0‘】

【Ubuntu永久授权串口设备读取权限‘/dev/ttyUSB0‘】

Ubuntu永久授权串口设备读取权限 1 问题描述2 解决方案2.1 查看ttyUSB0权限&#xff0c;拥有者是root&#xff0c;所属用户组为dialout2.2 查看dialout用户组成员&#xff0c;如图所示&#xff0c;普通用户y不在dialout组中2.3 将普通用户y加入dialout组中2.4 再次查看dialout用…
阅读更多...
Redis-新数据类型-Hyperloglog

Redis-新数据类型-Hyperloglog

新数据类型-Hyperloglog 简介 在我们做站点流量统计的时候一般会统计页面UV(独立访客:unique visitor)和PV(即页面浏览量&#xff1a;page view)。 什么是基数&#xff1f; 数据集&#xff5b;1&#xff0c;2&#xff0c;5&#xff0c;7&#xff0c;5&#xff0c;7&#xff…
阅读更多...
AI绘画的基本原理是什么？

AI绘画的基本原理是什么？

目录 一、AI绘画的基本原理是什么&#xff1f; 二、Python中有几个库可以用于AI绘画&#xff1f; 三、OpenCV画一个人形 四、AI画的红苹果 一、AI绘画的基本原理是什么&#xff1f; AI绘画的原理基于机器学习和人工智能技术&#xff0c;通过这些技术模型能够理解文本描述并…
阅读更多...
vivado 配置存储器支持-Artix-7 配置存储器器件

vivado 配置存储器支持-Artix-7 配置存储器器件

配置存储器支持 本章主要讲解 Vivado 软件支持的各种非易失性器件存储器。请使用本章作为指南 &#xff0c; 按赛灵思系列、接口、制造商、 密度和数据宽度来为您的应用选择适用的配置存储器器件。 Artix-7 配置存储器器件 下表所示闪存器件支持通过 Vivado 软件对 A…
阅读更多...
HTTP 1.1 与 HTTP 1.0

HTTP 1.1 与 HTTP 1.0

什么是HTTP HTTP 就是一个 超文本传输协议 协议 : 双方 约定 发送的 域名 数据长度 连接(长连接还是短连接) 格式(UTF-8那些) 传输 :数据虽然是在 A 和 B 之间传输&#xff0c;但允许中间有中转或接力。 超文本:图片、视频、压缩包,在HTTP里都是文本 HTTP 常见状态码 比如 20…
阅读更多...
在go-zero中使用jwt

在go-zero中使用jwt

gozero使用jwt 两个步骤 获取token验证token 前端获取token 先编写 jwt.api 文件&#xff0c;放在api目录下 syntax "v1"info (title: "type title here"desc: "type desc here"author: "type author here"email: &quo…
阅读更多...
工控组态技术：实现工业自动化控制的重要手段

工控组态技术：实现工业自动化控制的重要手段

体验地址&#xff1a;by组态[web组态插件] 工控组态技术是一种应用于工业自动化控制领域的重要技术&#xff0c;它通过将各种不同的硬件设备和软件系统进行组合和配置&#xff0c;实现了工业生产过程的自动化控制和优化。 随着工业技术的不断发展和进步&#xff0c;工控组态技…
阅读更多...
拥有蝴蝶效应的爬虫如何进行防护

拥有蝴蝶效应的爬虫如何进行防护

美国气象学家爱德华罗伦兹&#xff08;Edward N.Lorenz&#xff09;1963年在一篇提交纽约科学院的论文中分析了一个叫做蝴蝶效应的理论&#xff1a;“一个气象学家提及&#xff0c;如果这个理论被证明正确&#xff0c;一只海鸥扇动翅膀足以永远改变天气变化。”在以后的演讲和论…
阅读更多...
IP 地理定位神话与事实

IP 地理定位神话与事实

ip地理定位是一项技术&#xff0c;用于通过访问设备的ip地址来获取地理位置信息&#xff0c;例如国家、城市、经纬度等。该技术广泛应用于网站内容自定义、广告定位、网络安全和用户分析等领域。它通过与包含ip地址和地理位置映射的大型数据库进行查询来工作&#xff0c;但在准…
阅读更多...
软件测评报告：除了软件测评中心，还有哪些选择？

软件测评报告：除了软件测评中心，还有哪些选择？

传统的观念中&#xff0c;软件测评中心往往被视为进行软件测评的首选机构。然而&#xff0c;随着技术的发展和市场的扩大&#xff0c;除了软件测评中心&#xff0c;越来越多的机构和平台也提供了专业的软件测评服务。本文将探讨除了软件测评中心之外&#xff0c;还有哪些地方可…
阅读更多...
工作中使用Optional处理空指针异常

工作中使用Optional处理空指针异常

工作中使用Optional处理空指针异常 实体类以前对空指针的判断Optional处理空指针测试结果 实体类 package po;import lombok.AllArgsConstructor; import lombok.Data; import lombok.NoArgsConstructor;import java.io.Serializable;Data AllArgsConstructor NoArgsConstruct…
阅读更多...
单调栈：（C++）

单调栈：（C++）

在题目的要求中&#xff0c;存在先进后出&#xff08;即在前面的数据需要遍历到后面的某一数据时才能确定计算值&#xff09;单调栈在一部分解题场景中避免了暴力解法的高时间复杂度问题&#xff0c;但是在做题过程中视情况而定&#xff0c;有些题目的最优解不一定使用单调栈&a…
阅读更多...
2024下载旧版本谷歌浏览器和谷歌驱动器chromedriver,亲测有效

2024下载旧版本谷歌浏览器和谷歌驱动器chromedriver,亲测有效

2024下载旧版本谷歌浏览器和谷歌驱动器chromedriver,亲测有效 1. 下载旧版本谷歌浏览器 找了很多博客&#xff0c;实验了很多种&#xff0c;我发现最有效的是下面的网址&#xff0c;可能需要一些科技。 但是下载下来的谷歌浏览器版本是ok的。拿来就能用&#xff0c;亲测有效…
阅读更多...
QT创造一个新的类（柱状图的类），并关联属性和方法

QT创造一个新的类（柱状图的类），并关联属性和方法

1.以在UI上添加柱状图的类为例&#xff08;Histogram&#xff09; #ifndef STUDY_HISTOGRAM_H #define STUDY_HISTOGRAM_H#include <QVector> #include <QWidget>// 前向声明 QT_BEGIN_NAMESPACE class QColor; class QRect; class QString; class QPaintDevice; …
阅读更多...
【机器学习300问】84、AdaGrad算法是为了解决什么问题？

【机器学习300问】84、AdaGrad算法是为了解决什么问题？

神经网络的学习的目的是找到使损失函数的值尽可能小的参数。这是寻找最优参数的问题&#xff0c;解决这个问题的过程称为最优化。因为参数空间非常复杂&#xff0c;无法轻易找到最优解&#xff0c;而且在深度神经网络中&#xff0c;参数的数量非常庞大&#xff0c;导致最优化问…
阅读更多...
【SpringBoot篇】基于Redis分布式锁的 误删问题 和 原子性问题

【SpringBoot篇】基于Redis分布式锁的 误删问题 和 原子性问题

文章目录 &#x1f354;Redis的分布式锁&#x1f6f8;误删问题&#x1f388;解决方法&#x1f50e;代码实现 &#x1f6f8;原子性问题&#x1f339;Lua脚本 ⭐利用Java代码调用Lua脚本改造分布式锁&#x1f50e;代码实现 &#x1f354;Redis的分布式锁 Redis的分布式锁是通过利…
阅读更多...
基于FPGA的音视频监视器，音视频接口采集器的应用

基于FPGA的音视频监视器，音视频接口采集器的应用

① 支持1路HDMI1路SDI 输入 ② 支持1路HDMI输出 ③ 支持1080P高清屏显示实时画面以 及叠加的分析结果 ④ 支持同时查看波形图&#xff08;亮度/RGB&#xff09;、 直方图、矢量图 ⑤ 支持峰值对焦、斑马纹、伪彩色、 单色、安全框遮幅标记 ⑥ 支持任意缩放画面&#xff0c;支…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023