答案：实现点对点视频通话需使用WebRTC，先通过getUserMedia获取本地音视频流并显示，再创建RTCPeerConnection连接并添加流；借助STUN/TURN服务器辅助NAT穿透，通过信令服务器交换SDP Offer/Answer及ICE候选信息建立直连，最后监听ontrack接收远程流、onicecandidate发送候选、onconnectionstatechange监控连接状态，确保信令可靠与网络通畅即可稳定通话。
要实现一个点对点的视频通话应用，WebRTC 是目前最直接和高效的技术方案。它允许浏览器之间直接传输音视频流，无需经过服务器中转。虽然 WebRTC 本身支持点对点通信，但建立连接仍需要一些辅助机制。下面分步骤说明如何实现。
1. 获取本地音视频流
使用 getUserMedia() API 可以请求用户的摄像头和麦克风权限，并获取媒体流：
navigator.mediaDevices.getUserMedia({ video: true, audio: true })
.then(stream => {
// 将本地视频显示在页面上
document.getElementById('localVideo').srcObject = stream;
// 后续将此流添加到 RTCPeerConnection
})
.catch(err => console.error('无法获取媒体流：', err));
确保页面运行在 HTTPS 环境或 localhost，否则浏览器会阻止媒体访问。
2. 建立 RTCPeerConnection 连接
RTCPeerConnection 是 WebRTC 的核心，用于管理点对点连接和传输音视频流：
const configuration = { iceServers: [{ urls: 'stun:stun.l.google.com:19302' }] };
const peerConnection = new RTCPeerConnection(configuration);
// 将本地流加入连接
stream.getTracks().forEach(track => peerConnection.addTrack(track, stream));
// 处理远程流
peerConnection.ontrack = event => {
document.getElementById('remoteVideo').srcObject = event.streams[0];
};
STUN 服务器用于发现公网 IP 和端口，帮助穿透 NAT。如果网络环境复杂，还可以加入 TURN 服务器作为中继备份。
3. 通过信令服务器交换连接信息
WebRTC 不提供内置的信令机制，你需要自己搭建一个信令通道（例如使用 WebSocket）来交换以下信息：
- SDP 提议（Offer）和应答（Answer）：描述媒体能力与连接配置
- ICE 候选地址：网络路径信息，用于建立直连
示例流程：
- A 创建 Offer，设置为本地描述，并通过信令服务器发送给 B
- B 收到 Offer，设置为远程描述，创建 Answer 并发回 A
- A 设置远程描述
- 双方通过 onicecandidate 事件收集 ICE 候选并互相发送
- 候选被添加到对方的 RTCPeerConnection 中
peerConnection.onicecandidate = event => {
if (event.candidate) {
// 发送 ICE 候选到对方
signalingSocket.send(JSON.stringify({ candidate: event.candidate }));
}
};
4. 处理连接状态与错误
监听连接状态变化有助于调试和提升用户体验：
peerConnection.onconnectionstatechange = () => {
console.log('连接状态：', peerConnection.connectionState);
if (peerConnection.connectionState === 'failed') {
alert('连接失败，请检查网络');
}
};
常见问题包括防火墙限制、缺少 TURN 服务器、信令消息丢失等，建议开发时开启日志监控 ICE 候选类型和连接质量。
基本上就这些。WebRTC 的点对点通话不复杂，但细节关键。只要媒体流正确获取、信令可靠、ICE 路径打通，视频通话就能稳定运行。
