基于WebRTC的局域网低延迟投屏方案设计与实现

1. 项目背景与核心需求

去年在开发一个智能家居控制系统时，我遇到了一个典型需求：用户希望将手机上的监控视频实时投射到客厅的电视大屏上。市面上的商业投屏方案要么需要额外硬件（如Chromecast），要么存在明显的延迟和画质损失。这促使我开始研究如何构建一个轻量级的局域网投屏解决方案。

MVP（Minimum Viable Product）理念在这个场景下特别适用。我们需要实现的核心功能其实很明确：

• 局域网内设备自动发现
• 视频流低延迟传输（控制在200ms以内）
• 支持至少720P分辨率
• 跨平台兼容（至少覆盖Android和Web）

经过技术选型，WebRTC成为最佳选择。它原生支持点对点传输，延迟可控制在100-300ms，且不需要中转服务器。更重要的是，其开源实现（如libwebrtc）可以让我们完全掌控传输流程。

2. 技术架构设计

2.1 整体架构分层

整个系统采用分层设计，自下而上分为：

1. 设备发现层：

   • 使用mDNS协议（Android端通过NSDManager实现）
   • 广播包含设备类型（sender/receiver）、支持编解码器等元数据
   • 发现响应时间控制在3秒内

2. 信令层：

   • 采用WebSocket建立初始连接
   • 信令服务器用Node.js实现，代码不到200行
   • 关键交换信息包括：

     json复制{
       "sdp": "...",
       "candidate": {
         "sdpMLineIndex": 0,
         "sdpMid": "0",
         "candidate": "candidate:..."
       }
     }
     

3. 媒体传输层：

   • 视频采集：Android端使用Camera2 API
   • 编码：H.264 Baseline Profile（兼容性最好）
   • 传输：基于libdatachannel的WebRTC实现

2.2 关键性能优化点

在实际测试中，我们发现三个主要性能瓶颈：

1. 编码延迟：
   • 默认配置下编码延迟可达80-120ms