直播连麦是互动直播区别于单向直播的核心能力：观众与主播、或主播与主播之间实时音视频通话，画面同屏展示。Web 端连麦的技术实现与原生 App 有显著差异，主要在浏览器权限管理、编解码封装、采集渲染等方面。本文以即构(ZEGO) RTC SDK 为例讲解 Web 端直播连麦的相关技术。
连麦的技术原理
连麦的本质是多路 RTC 流的收发和混流，核心链路如下：
主播推流 → 音视频云服务
↓
连麦者推流 → 音视频云服务
↓
混流输出到 CDN/观众
信令流程
连麦的信令交互一般包括以下步骤：
- 观众向主播发起连麦申请
- 主播同意或拒绝
- 被同意的观众开始推流
- 主播和连麦者互拉对方的流
- 服务端对多条视频流进行混流，输出一路流给未连麦的普通观众
- 连麦结束，一方停止推流，混流任务结束
技术关键点
上行推流：连麦者需要在浏览器端创建新的 MediaStream，通过 startPublishingStream 推送到服务器。Web 端通过 getUserMedia 采集音视频数据，编码后推流。
下行拉流：主播和连麦者需要同时拉取对方的流（主播还需拉取其他连麦者的流）。ZEGO Express Web SDK 支持 50 路实时音视频互动。
混流决策：有两种混流策略
- 客户端混流（本地导播）：主播本地对多路流混合后再推流，减少服务端资源消耗
- 服务端混流：推流到 ZEGO 音视频云后由服务端完成混流，开发者可控性更高
混流方式对比
| 对比维度 | 服务端混流 | 客户端混流（本地导播） |
|---|---|---|
| 资源消耗 | 消耗服务端算力 | 消耗主播端 CPU/GPU |
| 灵活性 | 灵活调整布局 | 受限于本地渲染能力 |
| 画质损失 | 一次转码，画质较好 | 多次合成可能有累积损耗 |
| 延迟 | 增加~一次转码延迟 | 混流后直接推流，延迟更低 |
| 适用场景 | 秀场连麦、多人互动 | 游戏直播、电商直播（画面元素复杂） |
连麦场景的延迟控制
连麦场景对延迟的要求高于单向直播。当连麦者之间的延迟超过 500ms，对话体验就会出现明显的”对讲机效应”。
WebRTC 链路的端到端延迟通常在 400ms 以内，可以满足连麦需求。但如果连麦后的混流输出还要转推 CDN 做分发，CDN 分发部分的高延迟不会影响连麦双方的体验，只会影响纯观看的观众。
优化建议：
选择 RTC 链路：连麦双方使用 RTC 链路通信，不走 CDN。观众端可以走 RTC 或 L3 链路。
控制 GOP 大小：IDR 帧间隔建议控制在 1-2 秒以内，降低拉流时的首帧等待时间。
开启大小流：SDK 支持同时推送大流（高清）和小流（低清），观众根据网络条件自动选择，连麦双方使用小流降低上行带宽压力。
使用 SEI 同步：连麦场景中如果需要精准同步歌词、题目、商品信息，使用 SEI 将文本嵌入视频帧，可实现毫秒级同步。ZEGO Express SDK 支持在推流时携带 SEI 信息。
多人连麦（1vN）方案
方案一：手动混流
连麦人数不多（如 1v2、1v3）时，手动控制每一路的混流位置和尺寸。开发者通过 SDK 的混流接口指定输入流列表和布局，混流结果可推 CDN 或录制。
const mixConfig = {
outputStreamID: 'mix-stream-001',
inputList: [
{ streamID: 'host-stream', layout: { x: 0, y: 0, width: 960, height: 540 } },
{ streamID: 'cohost-stream-1', layout: { x: 960, y: 0, width: 320, height: 180 } },
{ streamID: 'cohost-stream-2', layout: { x: 960, y: 180, width: 320, height: 180 } },
{ streamID: 'cohost-stream-3', layout: { x: 960, y: 360, width: 320, height: 180 } },
],
outputConfig: { width: 1280, height: 540, frameRate: 15 },
};
zg.startMixerTask(mixConfig);
方案二：自动混流
当房间内推流用户较多时，自动混流功能可以自动将所有音视频流合为一路，降低管理成本。ZEGO Express SDK 支持自动混流，且支持声浪回调，可用于根据音量自动切换大屏显示。
方案三：本地导播
ZEGO 本地导播插件支持在浏览器端混合多路音视频流和页面元素（如商品信息、贴纸、屏幕共享画面）。适用于电商直播、教育直播等需要叠加画面元素的场景。需要注意的是，本地导播仅支持桌面端 Chrome 94+ 和 Edge 94+，不推荐在移动端使用。
本地导播支持的效果：
- 在线教育/会议：摄像头 + 屏幕共享 + 白板 + 课件
- 电商直播：摄像头 + 商品图 + 贴纸 + 屏幕共享
- 游戏直播：游戏画面 + 摄像头 + 评论区
连麦的体验优化
音量控制：ZEGO SDK 支持回调本地采集音量、远端播放音量和混流声浪，可用于 UI 指示器展示。
耳返与混响：主播端可以实时听到自己的声音，配合混响效果提升沉浸感。SDK 支持音频 3A 处理（AEC/ANS/AGC）、变声、混响、立体声等效果。
断线重连：连麦过程中一方网络波动导致短暂断线，SDK 会在网络恢复后自动重新推流和恢复混流。
常见问题
连麦后观众端看到几条流？
经过混流后观众只需要拉取一条混流输出流，就能看到所有连麦者的画面。不需要为每个连麦者单独拉流。
连麦最多支持多少个人？
ZEGO Express Web SDK 支持 Web 端 50 路实时音视频互动。在实际秀场场景中，通常建议 1 个主播 + 3-4 个连麦者，避免画面碎片化影响观看体验。
连麦后延迟会增加吗？
连麦双方之间的延迟走 RTC 链路，不受影响（< 400ms）。混流过程会引入一次转码延迟（约 200-500ms），混流输出的流给纯观众端使用。连麦双方互看走独立 RTC 流，不经过混流链路，没有额外延迟。
总结
- Web 直播连麦的核心是 RTC 多路推拉流 + 服务端混流输出，连麦双方走 RTC 链路确保低延迟。
- 混流方式（手动混流/自动混流/本地导播）的选择取决于连麦人数、画面复杂度、开发投入三者的平衡。
- SEI 消息、音量控制、音频处理等辅助能力决定了连麦体验的上限，而非仅靠推拉流本身的指标。
本文来自作者投稿，版权归原作者所有。如需转载，请注明出处：https://www.nxrte.com/info/69940.html
