应先检查是否为https/localhost环境、是否由用户手势触发、iframe是否含allow="camera"属性；再根据error.name区分notallowederror（用户拒绝或策略拦截）、securityerror（协议不安全）、notfounderror（设备缺失）三类错误。
MediaDevices.getUserMedia() 权限拒绝时怎么查原因
浏览器拒绝调用摄像头，90% 是因为没走 HTTPS 或页面没在用户交互后触发。HTTP 协议下 getUserMedia() 直接抛 NotAllowedError，连提示都没有；本地文件（file://）协议也一样被禁。
- 检查地址栏：必须是
https://开头，或localhost（Chrome/Firefox 对其豁免） - 确保调用发生在用户手势之后，比如
button.onclick里，不能在page load或setTimeout里直接调 - 如果用了 iframe，确认它带
allow="camera"属性，否则会被 sandbox 阻断
video.srcObject = stream 赋值后没画面怎么办
srcObject 是现代标准写法，但容易漏掉关键步骤：video 元素必须已挂载到 DOM，且不能设 display: none 或父元素不可见，否则部分浏览器（尤其是 Safari）会静音/停帧。
- 先 append 到 body 或 visible 容器，再赋值
srcObject - 加
autoplay和muted属性（音频流默认需要静音才允许自动播放） - 别用
src属性——那是给 Blob URL 用的，srcObject是直接接 MediaStream
const video = document.getElementById('myVideo');
navigator.mediaDevices.getUserMedia({ video: true })
.then(stream => {
video.srcObject = stream; // ✅ 正确
// video.src = URL.createObjectURL(stream); ❌ 过时且易内存泄漏
});
只想要摄像头不想要麦克风，但 Chrome 还弹音频权限框
Chrome 从 94 版起，即使只请求 { video: true }，也会默认附带音频权限请求（除非明确禁用）。这不是 bug，是策略变更。
- 显式写成
{ video: true, audio: false }，避免歧义 - 若后端或业务真不需要音频，务必加
audio: false，否则用户看到“是否允许麦克风”会困惑 - Firefox 和 Safari 表现不同：Firefox 严格按配置请求，Safari 在 iOS 上可能忽略
audio: false，需实测
移动端 iOS 拍照模糊、预览镜像、无法对焦怎么办
iOS Safari 对 getUserMedia 支持有限：不支持 focusMode、torch、zoom 等约束，且默认预览是镜像（mirror），但 video 元素本身没镜像 CSS 属性可开。
- 用
transform: scaleX(-1)手动镜像 video 元素（仅视觉，不影响实际 capture） - 拍照用
canvas.captureStream().getVideoTracks()[0].getSettings()查当前分辨率，iOS 常固定为 640×480，没法提 - 真要高清，得走原生 App 或 WKWebView + 自定义插件，纯 Web 无解
WebRTC 的摄像头控制能力在 iOS 上就是残缺的——不是配错了，是平台不给。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
