当前位置: 首页 > news >正文

WebRTC(一):整体架构

架构总览

在这里插入图片描述

模块划分

媒体采集模块

  • 使用浏览器 API:getUserMedia()
  • 采集摄像头(video)、麦克风(audio)。
  • 通过 MediaStreamTrack 管理单轨道。

媒体处理与编解码

  • 编码器(发送端):
    • 音频:Opus、G.711。
    • 视频:VP8、VP9、H.264、AV1。
  • 解码器(接收端):
    • 支持上述编解码格式。
  • 其他处理:
    • AEC(回声消除)、AGC(自动增益)、NS(降噪)等。

RTCPeerConnection 连接管理

核心对象:RTCPeerConnection

  • 管理媒体轨道、协商 SDP、控制网络连接。
  • 与远端建立加密媒体通道。
  • 支持 addTrack() / addTransceiver() 管理轨道。

传输与安全模块

协议栈(底层网络):

协议作用
ICENAT 穿透候选路径收集和选择
STUN获取公网地址,打洞
TURN中继服务器
DTLS建立加密通道
SRTP安全传输媒体流
SCTP数据通道的基础协议

媒体传输:

  • 使用 RTP/RTCP 发送音视频流。
  • 支持 NACK、PLI、FEC、REMB、TCC 等反馈机制提升媒体质量。

数据通道(RTCDataChannel)

  • 基于 SCTP over DTLS over ICE 实现。
  • 用于传输非媒体数据,类似 WebSocket,但具备 P2P 优势。

信令机制(自定义实现)

WebRTC 不定义信令协议,常用方案:

  • WebSocket
  • HTTP POST/REST
  • MQTT

信令交换内容包括:

  • SDP(Session Description Protocol):音视频能力协商。
  • ICE Candidate:网络地址候选信息。
                        +----------------------+|    JavaScript 应用层  |+----------------------+|        |        |+----------+        |        +------------------+|                   |                           |+------------------+  +----------------+         +------------------+| getUserMedia()   |  | PeerConnection | <-----> |  DataChannel     |+------------------+  +----------------+         +------------------+|                   |+------+-------------------+-------+|      |           |              |
+-------------+ +----------------+ +--------------+
| 音视频采集  | | 编码/解码      | | 传输协议栈   |
+-------------+ +----------------+ +--------------+| STUN/TURN/ICE || DTLS/SRTP/SCTP|

通信流程

[用户A]                                    [用户B]|                                           || getUserMedia()                            || 采集本地音视频                              ||                                           || createOffer()                             || setLocalDescription(offer)                ||------------------>  信令服务器  ------------------->||                                setRemoteDescription(offer)|                                createAnswer()|                                setLocalDescription(answer)|<------------------  信令服务器  <-------------------|| setRemoteDescription(answer)                        ||                                           || ICE candidate gathering and exchange      ||<------------------->STUN/TURN<------------------>||                                           ||       DTLS 握手,SRTP 密钥协商              ||                                           ||       媒体传输(RTP+ 控制(RTCP||<=========================================>|

服务端组件架构

虽然 WebRTC 是 P2P,但实际场景常常需要以下服务器支撑:

组件作用常见实现
Signaling Server交换 SDP 和 ICE 信息Node.js + WebSocket、Socket.io
STUN Server提供公网地址探测Google STUN、Coturn
TURN Server中继数据(P2P 失败时)Coturn
SFU(选择转发)多人通话中只转发媒体流mediasoup、Janus、Jitsi
MCU(混合转发)多人通话中混合为一路流Kurento、Jitsi MCU

相关文章:

  • 基于深度学习的图像分割技术:原理、应用与实践
  • ES6(ES2015)特性全解析
  • Shell 解释器​​ bash 和 dash 区别
  • laravel8+vue3.0+element-plus搭建方法
  • composer init
  • 香港虚拟主机安装WordPress
  • Maotu流程图编辑器:Vue3项目中的集成实战与自定义流程开发指南
  • 基于 CNN-SHAP 分析卷积神经网络的多分类预测【MATLAB】
  • JS红宝书10.1-10.5 函数
  • JS - 函数防抖详解
  • 从零开始的python学习(八)P108+P109+P110+P111+P112+P113+P114
  • 提升移动端网页调试效率:WebDebugX 与常见工具组合实践
  • WebGL与Three.js:从基础到应用的关系与原理解析
  • Web 架构之 API 安全防护:防刷、防爬、防泄漏
  • WEB3全栈开发——面试专业技能点P7前端与链上集成
  • 【CANN全新升级】CANN创新MLAPO算子,DeepSeek模型推理效率倍增
  • 如何用Coze+Fetch快速构建结构化文档
  • 在ARM+Ascend NPU上适配Step-Audio模型
  • JS红宝书笔记 10.6 - 10.10 函数
  • Android Framework 之 AudioDeviceBroker
  • 泰州网站制作案例/百度企业
  • wordpress 迁移后空白/seo如何优化关键词上首页
  • 奇趣网做网站/抖音推广渠道有哪些
  • 网站和网页的目的/网站优化培训学校
  • 洛阳网站建设汉狮报价/云南网站建设百度
  • 域名网站排名/seo研究协会