应直接使用 video.srcObject = stream 绑定 MediaStream，这是 HTML5 推荐标准；错误赋值 src 会静默失败；动态切换流或设为 null 可自动释放资源，无需 revokeObjectURL。
可以直接将获取到的 MediaStream 对象（如来自 navigator.mediaDevices.getUserMedia() 或 WebRTC 远端流）赋值给 <video></video> 元素的 srcObject 属性，无需经过 URL.createObjectURL() 转换，这是 HTML5 规范推荐的标准做法。
确保使用 srcObject 而非 src
srcObject 是原生支持 MediaStream 的属性，而 src 只接受字符串 URL（如 blob URL 或网络地址）。若错误地把 MediaStream 赋给 src，视频将无法播放且无报错提示。
- ✅ 正确：
video.srcObject = stream; - ❌ 错误：
video.src = stream;（会静默失败） - ⚠️ 已弃用但兼容：
video.src = URL.createObjectURL(stream);（需手动 revoke，不推荐）
基本绑定流程（以本地摄像头为例）
只需三步：获取流 → 获取 video 元素 → 赋值 srcObject。注意需在用户交互（如点击）后调用 getUserMedia，避免被浏览器拦截。
- 监听按钮点击，调用
navigator.mediaDevices.getUserMedia({ video: true }) - 成功后得到
MediaStream实例（含 video track） - 直接赋值：
document.getElementById('myVideo').srcObject = stream;
处理流变更与清理
srcObject 支持动态切换，也支持设为 null 来停止播放并释放资源。
- 切换流：
video.srcObject = newStream;（旧流自动停止解码） - 停止播放：
video.srcObject = null;（推荐方式，比 revoke URL 更简洁） - 无需手动调用
URL.revokeObjectURL()—— 使用 srcObject 时没有生成 blob URL
兼容性与注意事项
现代浏览器（Chrome 53+、Firefox 51+、Edge 17+、Safari 11+）均支持 srcObject。旧版 Safari（≤10）或 IE 不支持，需降级使用 createObjectURL。
- 可做简单判断：
if ('srcObject' in video) { video.srcObject = stream; } else { video.src = URL.createObjectURL(stream); } - 设置
autoplay和muted属性有助于自动播放（尤其移动端或音频流） - 流为空（如无可用摄像头）时，
srcObject设为null或未赋值，video 显示黑屏，不会报错
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
