WebRTC 的三块拼图：MediaDevices（getUserMedia 拿摄像头与麦克风权限）、RTCPeerConnection（建立点对点连接、协商编解码与传输）、RTCDataChannel（传任意数据）。两个浏览器要连通还需要信令服务器交换 SDP 描述与 ICE 候选，之后媒体流即可直连不再经过服务端。
一对一通话上手容易：双方交换 offer 与 answer 完成协商，STUN 服务器帮忙发现自己公网地址。多人会议则要引入 SFU 转发服务器降低上行带宽。实际项目极少从零写底层，多基于 mediasoup、LiveKit 等开源方案封装。调试时可用 chrome://webrtc-internals 观察连接状态。
// 打开摄像头并预览（最简演示，不含连接协商） var video = document.createElement('video'); video.autoplay = true; video.muted = true; document.body.appendChild(video); if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) { navigator.mediaDevices.getUserMedia({ video: true, audio: false }) .then(function (stream) { video.srcObject = stream; console.log('摄像头已打开，视频轨数量:', stream.getVideoTracks().length); }) .catch(function (err) { console.log('无法访问摄像头:', err.name === 'NotAllowedError' ? '用户拒绝授权' : err.message); }); } else { console.log('当前浏览器不支持 WebRTC'); }