实时通信的方式——WebRTC
文章目录
- 基于WebRTC实现音视频通话
- P2P通信原理
- 如何发现对方?
- 不同的音视频编解码能力如何沟通?(媒体协商SDP)
- 如何联系上对方?(网络协商)
- 常用的API
- 音视频采集getUserMedia
- 核心对象RTCPeerConnection
WebRTC (Web Real-Time Communications) 是一项实时通讯技术,它允许网络应用或者站点,在不借助中间媒介的情况下,建立浏览器之间点对点(Peer-to-Peer)的连接,实现视频流和(或)音频流或者其他任意数据的传输。
基于WebRTC实现音视频通话
背景: 随着互联网技术的飞速发展,实时音视频通话已经成为在线教育、远程办公、社交媒体等领域的核心且常用的功能。WebRTC(Web Real-Time Communication)作为一项开放的实时通信标准,为开发者提供了快速构建实时音视频通话系统的能力。在本课程中,我们将从0到1使用 WebRTC构建一个基于P2P 架构的音视频通话的应用案例。
应用场景:
- 点对点视频聊天:如 微信视频 等实时视频通话应用。
- 多人视频会议:企业级多人视频会议系统,如飞书、钉钉、腾讯会议等。
- 在线教育:如腾讯课堂、网易云课堂等。
- 直播:游戏直播、课程直播等。
P2P通信原理
传统通信方式:一个客户端发个消息给服务端,服务端转发给目标客户端
P2P点对点通信:不需要依赖服务器,两个客户端可以直接进行通信,但也并不是完全不需要 不依赖服务器,还需要一个(跟踪服务器 好像是这个名字) 服务器去交换一些元数据。
要实现两个客户端的实时音视频通信 并且这两个客户端可能处于不同的网络环境,使用不同的设备,都需要解决哪些问题?
主要是下面这三个问题:
- 如何发现对方?
- 不同的音视频编码能力如何沟通?
- 如何联系上对方
如何发现对方?
在 P2P 通信的过程中,双方需要交换一些元数据比如媒体信息、网络数据等等信息,我们通常称这一过程叫做”信令(signaling) "。
对应的服务器即“信令服务器(signaling server)",通常也有人将之称为“房间服务器”,因为它不仅可以交换彼此的媒体信息和网络信息,同样也可以管理房间信息。
比如:
1)通知彼此 who 加入了房间;
2)who 离开了房间
3)告诉第三方房间人数是否已满是否可以加入房间。
为了避免出现冗余,并最大限度地提高与已有技术的兼容性,WebRTC标准并没有规定信令方法和协议。在本课程中会使用websocket来搭建一个信令服务器
不同的音视频编解码能力如何沟通?(媒体协商SDP)
不同浏览器对于音视频的编解码能力是不同的。
比如:以日常生活中的例子来讲,小李会讲汉语和英语,而小王会讲汉语和法语。为了保证双方都可以正确的理解
对方的意思,最简单的办法即取他们都会的语言,也就是汉语来沟通。
在 WebRTC 中:有一个专门的协议,称为 Session Description Protocol(SDP),可以用于描述上述这类信息。
因此:参与音视频通讯的双方想要了解对方支持的媒体格式,必须要交换SDP 信息。而交换 SDP 的过程,通常称之为 媒体协商 。
如何联系上对方?(网络协商)
其实就是网络协商的过程,即参与音视频实时通信的双方要了解彼此的网络情况,这样才有可能找到一条相互通讯的链路。
理想的网络情况是每个客户端都有自己的私有公网IP 地址,这样的话就可以直接进行点对点连接。实际上呢,出于网络安全和其他原因的考虑,大多数客户端之间都是在某个局域网内(比如说公司内网),需要 网络地址转换(NAT)
在 WebRTC中我们使用 ICE 机制建立网络连接。ICE 协议通过一系列的技术(如 STUN、TURN服务器)帮助通信双方发现和协商可用的公共网络地址,从而实现 NAT 穿越。(通信双方找到能联系上对方的IP地址)
ICE 的工作原理如下:
1.首先,通信双方收集本地网络地址(包括私有地址和公共地址)以及通过STUN和TURN 服务器获取的候选地址。
2.接下来,双方通过信令服务器交换这些候选地址。
3.通信双方使用这些候选地址进行连接测试,确定最佳的可用地址。
4.一旦找到可用的地址,通信双方就可以开始实时音视频通话。
在WebRTC中,网络信息通常用candidate来描述
针对上面三个问题的总结:就是通过 WebRTC 提供的 API 获取各端的媒体信息SDP 以及 网络信息 candidate并通过信令服务器交换,进而建立了两端的连接通道完成实时视频语音通话。
常用的API
音视频采集getUserMedia
const getLocalStream= async =>{const stream=await navigator.mediaDevices.getUserMedia({//获取音视频流,获取到声音和画面 传入两个参数audio:true,video:true})localVideo.value!.srcObject=stream//进行音视频的播放localVideo.value.play()return stream
}
核心对象RTCPeerConnection
RTCPeerConnection作为创建点对点连接的API,是我们实现音视频实时通信的关键
//核心对象RTCPeerConnection
const peer=new RTCPeerConnection({//构造函数的配置,这里和上面的知识点关联起来(网络协商里面的两个服务)iceServers:[{url:"stun:stun.l.google.com:19302"},//谷歌的公共服务{urls:"turn:***",credential:"***",username:"***",},]
})
主要会用到以下爱几个方法:
媒体协商方法:
通过下面这些方法去生成上面的媒体信息SDP和网络信息candidate
- createOffer
- createAnswer
- setLocalDesccription
- setRemoteDesccription
重要事件:
- onicecandidate
- onaddstream
整个媒体协商过程可以简化为三个步骤对应上述四个媒体协商方法:
- 呼叫端创建 Offer(createOffer)井将 offer 消息(内容是呼叫端的 SDP 信息)通过 信令服务器 传送给接收端,同时调用 setLocalDesccription 将含有本地JSDP 信息的 Offer 保存起来
- 接收端收到对端的 Offer 信息后调用 setRemoteDesccription 方法将含有对端 SDP 信息的 Offer 保存起来,并创建 Answer(createAnswer)并将 Answer 消息(内容是接收端的 SDP 信息)通过信令服务器传送给呼叫端
- 呼叫端收到对端的 Answer 信息后调用 setRemoteDesccription 方法将含有对端 SDP 信息的 Answer 保存起来
交换candidate信息的过程:
经经过上述三个步骤,则完成了 P2P 通信过程中的媒体协商部分,实际上在呼叫端以及接收端调用setLocalDesccription 同时也开始了收集各端自己的网络信息(candidate),然后各端通过监听事件onicecandidate 收集到各自的 candidate 并通过信令服务器传送给对端,进而打通 P2P 通信的网络通道,并通过监听 onaddstream 事件拿到对方的视频流进而完成了整个视频通话过程。
完整的通信过程图如下:
相关文章:

实时通信的方式——WebRTC
文章目录 基于WebRTC实现音视频通话P2P通信原理如何发现对方? 不同的音视频编解码能力如何沟通?(媒体协商SDP)如何联系上对方?(网络协商) 常用的API音视频采集getUserMedia核心对象RTCPeerConne…...

Android 使用 ActivityResultLauncher 申请权限
前面介绍了 Android 运行时权限。 其中,申请权限的步骤有些繁琐,需要用到:ActivityCompat.requestPermissions 函数和 onRequestPermissionsResult 回调函数,今天就借助 ActivityResultLauncher 来简化书写。 步骤1:创…...

如何将前端项目打包并部署到不同服务器环境
学习源码可以看我的个人前端学习笔记 (github.com):qdxzw/frontlearningNotes 觉得有帮助的同学,可以点心心支持一下哈(笔记是根据b站尚硅谷的前端讲师【张天禹老师】整理的,用于自己复盘,有需要学习的可以去b站学习原版视频&…...

什么样的展馆场馆才是科技满满?就差一张智慧场馆大屏
随着科技的飞速发展,传统的场馆展示方式已经无法满足现代人对信息获取和体验的需求。智慧场馆大屏作为一种新型的展示方式,应运而生。它将高清大屏显示技术、智能交互技术、数据分析技术等融为一体,为观众带来更加丰富、生动的展示体验。 一…...

python核心编程(二)
python面向对象 一、基本理论二、 面向对象在python中实践2.1 如何去定义类2.2 通过类创建对象2.3 属性相关2.4 方法相关 三、python对象的生命周期,以及周期方法3.1 概念3.2 监听对象的生命周期 四、面向对象的三大特性4.1 封装4.2 继承4.2.1 概念4.2.1 目的4.2.2 分类4.2.3 t…...

【wiki知识库】02.wiki知识库SpringBoot后端的准备
📝个人主页:哈__ 期待您的关注 目录 一、🔥今日目标 二、📂打开SpringBoot项目 2.1 导入所需依赖 2.2修改application.yml配置文件 2.3导入MybatisPlus逆向工程工具 2.4创建一个公用的返回值 2.5创建CopyUtil工具类 2.6创建…...
python tuple(元组)
python list(列表)、创建、访问、内置index、判断in、not in、添加元素、insert、append、extend、列表排序、颠倒顺序、删除元素、remove、pop、clear-CSDN博客 目录 tuple: 元组的主要特点包括: tuple的创建 单个元组需要注…...
opencv调用摄像头保存视频
opencv调用摄像头保存视频 文章目录 opencv调用摄像头保存视频保存视频(采用默认分辨率640 x 480)保存视频(指定分辨率,例1280720) 保存视频(采用默认分辨率640 x 480) import cv2 import time # 定义视频捕捉对象 cap cv2.Vide…...

STM32定时器四大功能之定时器编码接口
1什么是编码器接口? 编码器接口接受编码器的正交信号,根据编码器产生的正交信号脉冲控制CNT的自增和自减,从而指示编码器的旋转方向和旋转速度。 每个高级定时器和通用定时器都有一个编码器接口,同时正交编码器产生的正交信号分…...

全国各城市间驾车耗时和距离矩阵数据集(更新至2022年)
数据简介:城市之间距离越远,耗时越长。经济发达地区的交通状况较好。各城市之间的驾车耗时和距离存在差异。有些城市之间的交通非常便捷,而有些城市之间的交通则较为不便。这表明中国的交通网络发展尚不平衡,需进一步优化。特别是…...

推荐二轮电动车仪表盘蓝牙主芯片方案-HS6621CGC
随着国内二轮电动车的火热开启,电动车的智能化程度越来越高;电动车的智能操控需求也越来越高,现在介绍蓝牙控制面板的一些功能;例如:定位(GNSS),设防,实时上报数据&#…...

『香橙派』基于Orange Pi AIpro打造高效个人云存储解决方案
读完这篇文章里你能收获到 了解Orange Pi AIpro硬件优势,为构建高效云存储基础设施的理想平台。学会使用Orange Pi AIpro硬件平台,搭载Ubuntu Server系统,打造云存储环境。掌握利用Kodbox软件,享受文件管理、多格式预览及编辑的全…...
Sylvester矩阵、子结式、辗转相除法的三者关系(第二部分)
【三者的关系】 首先,辗转相除法可以通过Sylvester矩阵进行,过程如下(以 m 8 、 l 7 m 8、l 7 m8、l7为例子)。 首先调整矩阵中 a a a系数到最后面几行,如下所示: S ( a 8 a 7 a 6 a 5 a 4 a 3 a 2 …...

PyTorch的数据处理
💥今天看一下 PyTorch数据通常的处理方法~ 一般我们会将dataset用来封装自己的数据集,dataloader用于读取数据 Dataset格式说明 💬dataset定义了这个数据集的总长度,以及会返回哪些参数,模板: from tor…...

第14章-蓝牙遥控小车 手把手做蓝牙APP遥控小车 蓝牙串口通讯讲解
本文讲解手机蓝牙如何遥控小车,如何编写串口通信指令 第14章-手机遥控功能 我们要实现蓝牙遥控功能,蓝牙遥控功能要使用:1.单片机的串口、2.蓝牙通信模块 所以我们先调试好:单片机的串口->蓝牙模块->接到一起联调 14.1-电脑控制小车 完成功能…...
【补充1】字节对齐
文章目录 1.字节对齐的基本概念2.字节对齐规则3.实践出真知(加大难度)4 位域 1.字节对齐的基本概念 (1)现代计算机中内存空间都是按照byte划分的, 从理论上讲似乎对任何类型的变量的访问可以从任何地址开始࿰…...
Java数据库连接(JDBC)
一、引言 在Java应用程序中,经常需要与数据库进行交互以存储、检索和处理数据。Java数据库连接(JDBC)是Java平台中用于执行这一任务的标准API。JDBC允许Java程序连接到关系数据库,并使用SQL语句来执行查询和更新操作。本教程将详…...
记录一次cas单点登录的集成
主要思路:浏览器访问CAS服务器登录,拿到凭证给后端,后端用此凭证到CAS服务器验证登录并拿到用户信息,之后基于该凭证维持用户的登录状态。 主要流程: 1.浏览器访问后端需认证登录地址(不带ticket…...

【吊打面试官系列】Java高并发篇 - 什么是乐观锁和悲观锁?
大家好,我是锋哥。今天分享关于 【什么是乐观锁和悲观锁?】面试题,希望对大家有帮助; 什么是乐观锁和悲观锁? 1、乐观锁: 就像它的名字一样,对于并发间操作产生的线程安全问题持乐观状态, 乐观锁认为竞争…...
机器学习之词袋模型
目录 1 词袋模型基本概念 2 词袋模型的表示方法 2.1 三大方法 1 独热表示法(One-Hot) 2 词频表示法(Term Frequency, TF) 3 词频-逆文档频率表示法(TF-IDF) 2.2 例子 1 词袋模型基本概念 词袋模型&a…...

网络六边形受到攻击
大家读完觉得有帮助记得关注和点赞!!! 抽象 现代智能交通系统 (ITS) 的一个关键要求是能够以安全、可靠和匿名的方式从互联车辆和移动设备收集地理参考数据。Nexagon 协议建立在 IETF 定位器/ID 分离协议 (…...
<6>-MySQL表的增删查改
目录 一,create(创建表) 二,retrieve(查询表) 1,select列 2,where条件 三,update(更新表) 四,delete(删除表…...

SCAU期末笔记 - 数据分析与数据挖掘题库解析
这门怎么题库答案不全啊日 来简单学一下子来 一、选择题(可多选) 将原始数据进行集成、变换、维度规约、数值规约是在以下哪个步骤的任务?(C) A. 频繁模式挖掘 B.分类和预测 C.数据预处理 D.数据流挖掘 A. 频繁模式挖掘:专注于发现数据中…...
WEB3全栈开发——面试专业技能点P2智能合约开发(Solidity)
一、Solidity合约开发 下面是 Solidity 合约开发 的概念、代码示例及讲解,适合用作学习或写简历项目背景说明。 🧠 一、概念简介:Solidity 合约开发 Solidity 是一种专门为 以太坊(Ethereum)平台编写智能合约的高级编…...

学习STC51单片机32(芯片为STC89C52RCRC)OLED显示屏2
每日一言 今天的每一份坚持,都是在为未来积攒底气。 案例:OLED显示一个A 这边观察到一个点,怎么雪花了就是都是乱七八糟的占满了屏幕。。 解释 : 如果代码里信号切换太快(比如 SDA 刚变,SCL 立刻变&#…...
ip子接口配置及删除
配置永久生效的子接口,2个IP 都可以登录你这一台服务器。重启不失效。 永久的 [应用] vi /etc/sysconfig/network-scripts/ifcfg-eth0修改文件内内容 TYPE"Ethernet" BOOTPROTO"none" NAME"eth0" DEVICE"eth0" ONBOOT&q…...

AirSim/Cosys-AirSim 游戏开发(四)外部固定位置监控相机
这个博客介绍了如何通过 settings.json 文件添加一个无人机外的 固定位置监控相机,因为在使用过程中发现 Airsim 对外部监控相机的描述模糊,而 Cosys-Airsim 在官方文档中没有提供外部监控相机设置,最后在源码示例中找到了,所以感…...
Bean 作用域有哪些?如何答出技术深度?
导语: Spring 面试绕不开 Bean 的作用域问题,这是面试官考察候选人对 Spring 框架理解深度的常见方式。本文将围绕“Spring 中的 Bean 作用域”展开,结合典型面试题及实战场景,帮你厘清重点,打破模板式回答,…...

淘宝扭蛋机小程序系统开发:打造互动性强的购物平台
淘宝扭蛋机小程序系统的开发,旨在打造一个互动性强的购物平台,让用户在购物的同时,能够享受到更多的乐趣和惊喜。 淘宝扭蛋机小程序系统拥有丰富的互动功能。用户可以通过虚拟摇杆操作扭蛋机,实现旋转、抽拉等动作,增…...
多元隐函数 偏导公式
我们来推导隐函数 z z ( x , y ) z z(x, y) zz(x,y) 的偏导公式,给定一个隐函数关系: F ( x , y , z ( x , y ) ) 0 F(x, y, z(x, y)) 0 F(x,y,z(x,y))0 🧠 目标: 求 ∂ z ∂ x \frac{\partial z}{\partial x} ∂x∂z、 …...