百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术教程 > 正文

Android IOS WebRTC 音视频开发总结(七七)-- WebRTC的架构和协议栈

toqiye 2025-01-19 00:24 22 浏览 0 评论

本文主要介绍WebRTC的架构和协议栈(我们翻译和整理的,译者:litie),最早发表在【编风网】

为了便于理解,我们来看一个最基本的三角形WebRTC架构(见下图)。

在这个架构中,移动电话用“浏览器M”表示,笔记本电脑用“浏览器L”表示,通过Web服务器将它们连接起来。

要建立一个实时媒体通讯,两台设备需要了解彼此的媒体功能,通过交换呼叫信令控制协议实现。

诸如这样的信令协议在WebRTC标准中并非事先规定,而是由开发者自行制定。在浏览器RTC会话的步骤如下:

首先,两个浏览器都从Web服务器下载了WebRTC程序(HTML5/JavaScript);

其次,两个浏览器通过Web服务器交换控制信令信息(使用嵌入式信令服务器),建立媒体功能功能互通。

最后,两个浏览器直接建立RTC媒体的音频、视频和数据通道。

WebRTC使用P2P媒体流,音频、视频和数据的连接直接通过浏览器实现。但是,浏览器却隐藏在NAT(网络地址翻译)和防火墙的后面,这增加了建立P2P媒体会话的难度。这些流程和协议,如ICE或Trickle ICE,STUN和TURN,在建立P2P媒体流都是必不可少的。

如何使用STUN协议建立一个P2P RTC媒体(如图5所示),简化版的ICE流程如下:

1.两个浏览器通过自己的公网IP地址,使用STUN协议信息和STUN服务器建立联系;

2.两个浏览器通过SDP提供/应答机制,使用呼叫控制信令消息交换它们已发现的公共IP地址(ICE候选);

3.两个浏览器执行连接检查(ICE冲孔),确保P2P可以连接;

4.建立连接后,RTC媒体会话和媒体交换就可以实现了。

5.但是,假如在一个高度限制的NAT或防火墙,这种直接的路径将无法建立,只能到达TURN服务器。结果是媒体通过TURN服务器分程传递(如图6所示)。

由互联网工程任务组(IETF)基于标准的可互操作的通信模型和协议栈详细地定义了WebRTC技术(参见图7),如下:

?如前所述的信令栈,并非由WebRTC实现规定,而是由开发者自行决定。在这个例子中,我们将使用SIP-over-WebSocket(SIPoWS)作为信令栈。HTTP协议用于浏览器下载HTML5/JavaScript程序内容;

?NAT栈解决P2P连接问题;

?媒体栈用于发送和接收RTC的音频和视频。LETF标准规定G.711和Opus作为音频/视频解码器。视频解码器尚未授权,但是H.248和VP8已经获得授权。媒体栈也用于交换RTC数据。本例中,实时信息采用消息会话中继协议(MSRP),实时会议采用二层控制协议(BFCP),实时文本服务采用T.140。

译者:litie,具体详见:【编风网】

相关推荐

【SQL】SQL 语法差异大全(PgSQL/MySQL/Oracle/TiDB/OceanBase)

以下是针对不同数据库系统的SQL语法差异总结,按功能分类展示:一、基础查询1.分页查询--PostgreSQL/TiDB/OceanBaseSELECT*FROMTableNameL...

msf系列片之vps搭建,黑客的世界你真的了解嘛?

最后喜欢我文章的朋友请加圈子关注我们,私信关键词:学习。(送免费资料和优惠券)就会自动分享给你微信号。欢迎大家加入我们的安全大家庭。提高大家的安全意识,提升大家的网络安全技能一直是我们的初衷和愿景,让...

小技巧:ubuntu 24.04.1中自带Python升级到3.12.9和3.13.2最新版

喜欢的条友记得关注、点赞、转发、收藏,你们的支持就是我最大的动力源泉。这几天一直有朋友问我,如何将ubuntu24.04.1中自带Python升级到最新版,今天就来详细讲讲。方法1:使用DeadSn...

linux下开发一个应用,首先要做什么?

作为一个linux的忠实用户,日常工作基本上不用windows系统。为什么这么说呢?word加上QQ不用不行呀。有人说LibreOffice加上Pidgen可以替代,但实际上部分word会排版不正确,...

ubuntn部署flask(flask如何部署)

1.装一下pyenvgitclonehttps://github.com/pyenv/pyenv-virtualenv.git$(pyenvroot)/plugins/pyenv-virtu...

招聘平台HireVue完成E轮融资 并推面试平台

Yesky天极新闻2015-06-0316:31:55【Yesky新闻频道消息】日前,在线视频面试的招聘服务初创企业HireVue获得4500万美元E轮融资。由TechnologyCrossove...

面试官:说一下vue2和vue3的响应式原理

Vue2的响应式原理:初始化阶段:在创建Vue实例时,遍历data对象的属性,使用Object.defineProperty方法为每个属性定义getter和setter。Getter拦截:在gett...

vue3还用this吗?getCurrentInstance获取当前组件实例

在Vue2中,this关键字代表当前组件实例。在组件的选项对象中,this可以用于访问组件实例的属性、方法以及Vue实例的一些特定方法。在Vue3中,我们发现this是undefined...

Vue.js 中的异步组件是什么?(vue.js异步请求)

本号用于每日更新前端最新面试题,React、Vue、小程序、JavaScript、HTML5、CSS、uniapp、ES6、前端工程化、性能优化等热点面试题~~~欢迎关注,面试题刷起来~~升职加薪不是...

面试官:聊聊你知道的Vue与React的区别

最近面到很多大公司的时候,小编都会碰到一个很尴尬的问题,很多大公司的技术栈都是React,但是小编学的是Vue,其实从本质上来说两者都是比较优秀的前端框架,所以有些面试官会问到Vue和React的区别...

Vue核心响应式原理深度解析!手写TodoList实战

导读:搞懂这个知识点,秒杀80%前端面试题!原理+实战+调试技巧三合一核心1:数据响应式黑科技(图解)原理示意图数据变化→依赖收集→自动更新视图Vue2vsVue3实现对...

前端面试题-原生 js 如何进行监听路由的变化?vue框架是否用到?

在原生JavaScript中监听路由变化的方式主要分为两种场景:监听哈希(Hash)路由变化和监听HistoryAPI的路由变化。Vue框架本身并不直接处理路由监听,但Vue的官方路由...

vue引入element-ui后界面空白(vue怎么引入element)

正文部分配置vue:3.0vue-cli:4.5.11目的使用element-ui绘制ui界面原本操作(1)安装element-uinpmielement-ui-S(2)导入element-ui...

前端面试-关于vue3的响应式原理(vue响应式的原理一句话概括)

现在工作不好找的环境中,想要更好获得工作机会,让我们一起准备面试题吧~Vue3的响应式系统采用ES6的Proxy实现数据劫持,与Vue2的Object.defineProperty有...

2024前端大厂面试题 Vue.js中的keep-alive组件有什么作用

小伙伴们在面试前端开发工程师的时候是不是会遇到面试官问Vue.js中的keep-alive组件有什么作用?今天我们就来告诉大家,解锁2024大厂vue面试题Vue.js中的keep-alive组件有什...

取消回复欢迎 发表评论: