无需登录 数据私有 本地保存

WebRTC 本地对等连接演示 - 同页面音视频通信

开发工具 网络 WebRTC 对等连接 演示 视频
0
0
0
0

WebRTC 本地对等连接演示

同页面音视频通信 · 实时信令交换 · 数据通道测试

待机中
本地视频
等待摄像头采集
远程视频
等待 WebRTC 连接
0
ICE 候选
--
连接状态
--
ICE 状态
--
数据通道
数据通道消息
连接建立后可发送消息
事件日志
等待操作...
常见问题与知识点

WebRTC（Web Real-Time Communication）是一项使浏览器之间能够进行实时音视频通信和数据传输的技术。本地对等连接演示在同一页面内创建两个 RTCPeerConnection 实例，模拟信令交换过程，让开发者直观理解 WebRTC 的 offer/answer 握手、ICE 候选交换、以及媒体流传输的完整流程，无需服务器即可体验。

SDP（Session Description Protocol）描述媒体会话的元数据，包括编解码器、媒体类型、网络信息等。在 WebRTC 中，offer 和 answer 都是 SDP 格式。ICE（Interactive Connectivity Establishment）是用于发现最佳网络路径的框架，通过收集候选地址（host、srflx、relay）并进行连通性检测，找到可用的通信路径。本演示的日志区域实时展示 ICE 候选的发现过程。

STUN 服务器帮助客户端发现其公网 IP 和端口（产生 srflx 候选），解决 NAT 穿透问题。TURN 服务器在中继模式下转发媒体数据（产生 relay 候选），当端到端直连失败时作为兜底方案。本演示配置了 Google 公共 STUN 服务器（stun:stun.l.google.com:19302），由于两个 Peer 在同一页面，通常 host 候选即可完成连接。

数据通道基于 SCTP 协议，支持在 Peer 之间传输任意文本或二进制数据，延迟极低。常见用途包括：文件传输、实时聊天、游戏状态同步、协作编辑等。本演示内置了一个简单的聊天功能，连接建立后即可通过数据通道互发消息。

WebRTC 默认对所有媒体流和数据通道进行强制加密，使用 DTLS（数据报传输层安全）和 SRTP（安全实时传输协议）。信令通道不在 WebRTC 规范范围内，开发者需要自行确保信令服务器的安全（建议使用 WSS/HTTPS）。此外，浏览器要求 getUserMedia 必须在安全上下文（HTTPS 或 localhost）下使用。

WebRTC 在主流现代浏览器中得到广泛支持：Chrome 56+、Firefox 44+、Safari 11+（包括 iOS Safari）、Edge 79+。移动端浏览器同样支持良好。本工具会自动检测浏览器兼容性，如不支持会给出提示。需要注意的是，iOS Safari 对部分高级特性（如 simulcast）支持有限。

本工具配置了两台 Google 公共 STUN 服务器：stun:stun.l.google.com:19302 和 stun:stun1.l.google.com:19302。在同一页面演示中，ICE 通常直接选择 host 候选（本地地址），连接几乎瞬间完成。在真实跨网络场景中，STUN 服务器帮助穿透 NAT，生产环境建议配置自有 TURN 服务器作为备份。
🔧 相关工具