摘要

文章先阐述 WebRTC 中 PeerConnection 的核心概念、方法和事件以及连接方式，然后介绍了 p2p 会话连接流程，接着讲述搭建简易信令服务器的设计、示例代码和功能解析，最后进行小结，整体深入剖析了 WebRTC 的核心技术及其应用。

摘要

文章先阐述 WebRTC 中 PeerConnection 的核心概念、方法和事件以及连接方式，然后介绍了 p2p 会话连接流程，接着讲述搭建简易信令服务器的设计、示例代码和功能解析，最后进行小结，整体深入剖析了 WebRTC 的核心技术及其应用。

WebRTC 连接的核心概念与实现

1. 核心概念

• 在 WebRTC 里，信令是建立连接前交换控制信息的过程，包含 SDP 的交换。SDP 即会话描述协议，用来在通信双方间交换多媒体会话参数。
• ICE 是一种网络协议，用于在 NAT 或防火墙后的用户建立 P2P 连接，其主要目标是简化复杂网络环境中的连接建立过程。
• Candidate 是一种网络候选描述，每个 WebRTC PeerConnection 会生成多个，包含不同网络接口信息等。
• 在 SDP 交换过程中，发起方创建offer，接收方创建answer来协商会话的媒体参数。

2. PeerConnection 的核心方法和事件

• 核心方法：
  • addIceCandidate()：添加 ICE 候选信息。
  • addTrack()：添加音频或视频轨道。
  • createAnswer()：创建应答信令。
  • createDataChannel()：创建数据通道。
  • createOffer()：创建初始信令。
  • setRemoteDescription()：设置远端描述信息。
  • setLocalDescription()：设置本地描述信息。
• 核心事件：
  • ondatachannel：监听数据通道的创建及数据传输事件。
  • ontrack：监听远程媒体轨道。
  • onicecandidate：监听 ICE 候选信息的生成和传输。

3. WebRTC 的连接方式

3.1 通过本地网络直接连接

• 当设备位于同一局域网时，可直接对等连接通信，利用本地网络低延迟和高速特性实现快速数据传输和实时通信。

3.2 通过公共 IP 地址 Internet 直接连接

• 不在同一局域网的设备需通过公共 IP 地址互相访问，但设备通常不知自己的公共 IP 地址，所以需要 STUN 服务器。
• STUN 服务器可发现公共 IP 地址并协助 NAT 穿透，但这种连接方式仍可能受 NAT 和防火墙限制。

3.3 通过 TURN 服务器路由连接媒体

• 当 P2P 连接失败时，TURN 服务器可作为中间服务器转发数据，保证通信连续性，但需要额外带宽成本。

4. 信令服务器与 STUN/TURN 服务器的协作

• 信令服务器负责交换建立连接所需信息，STUN 服务器帮助发现公共 IP 地址，TURN 服务器在 P2P 连接失败时提供备选路径。

WebRTC p2p 会话连接流程

• 连接信令服务器：Peer A 和 Peer B 首先分别与信令服务器建立连接。
• Peer A 创建 RTCPeerConnection 对象并生成 SDP Offer，设置本地会话描述后通过信令服务器发给 Peer B。
• Peer B 收到 SDP Offer 后设置远程会话描述，创建自己的 RTCPeerConnection 对象并生成 SDP Answer，设置本地会话描述后发回给 Peer A。
• Peer A 收到 SDP Answer 后设置远程会话描述。
• 双方收集并交换 ICE 候选信息，最后尝试建立 P2P 连接。

搭建一个简易的信令服务器

1. 信令服务器设计

• 核心功能包括用户连接管理（跟踪连接和断开状态）和信息转发（转发 SDP 信息和 ICE 候选信息）。

2. 示例代码

const express = require('express');
const http = require('http');
const socketIo = require('socket.io');
// 创建 Express 应用
const app = express();
const server = http.createServer(app);
const io = socketIo(server);
// 提供静态文件服务（例如 HTML 文件）
app.use(express.static('public'));
// 监听 HTTP 请求并发送主页面
app.get('/', (req, res) => {
  res.sendFile(__dirname + '/index.html');
});
// 处理 WebSocket 连接
io.on('connection', (socket) => {
  console.log('A user connected');
  // 处理 SDP Offer 事件
  socket.on('offer', (data) => {
    // data 包含目标客户端 ID 和 SDP Offer
    const { to, offer } = data;
    // 将 SDP Offer 转发给目标客户端
    socket.to(to).emit('offer', { offer, from: socket.id });
  });
  // 处理 SDP Answer 事件
  socket.on('answer', (data) => {
    // data 包含目标客户端 ID 和 SDP Answer
    const { to, answer } = data;
    // 将 SDP Answer 转发给目标客户端
    socket.to(to).emit('answer', { answer, from: socket.id });
  });
  // 处理 ICE 候选信息事件
  socket.on('ice-candidate', (data) => {
    // data 包含目标客户端 ID 和 ICE 候选信息
    const { to, candidate } = data;
    // 将 ICE 候选信息转发给目标客户端
    socket.to(to).emit('ice-candidate', { candidate, from: socket.id });
  });
  // 处理客户端断开连接事件
  socket.on('disconnect', () => {
    console.log('A user disconnected');
  });
});
// 启动服务器并监听 3000 端口
server.listen(3000, () => {
  console.log('Server is running on port 3000');
});

3. 信令服务器功能解析

• 用户管理连接管理：客户端连接时服务器记录日志，断开时处理事件并记录。
• 信令转发：转发 SDP Offer、SDP Answer 和 ICE 候选信息。

小结

• 文章从 WebRTC 连接基本概念出发，揭示了 P2P 会话连接流程，解析了信令和 ICE 协作，还搭建了信令服务器，让读者掌握了核心原理并收获实践经验。