HTML5在APP中调用相机失败主因是WebView容器未授权或配置缺失：Android需声明CAMERA权限并运行时申请，iOS需配置NSCameraUsageDescription；旧版WebView不支持getUserMedia应降级为input file capture；Hybrid方案通过JSBridge由原生调起相机更可靠；调试须用chrome://inspect定位问题层级。
HTML5页面里用navigator.mediaDevices.getUserMedia调起相机，但APP里常失败
WebView默认禁用摄像头权限，即使HTML5代码写对了，在Android/iOS的APP内大概率黑屏或报错NotAllowedError或NotFoundError。核心不是代码问题，而是容器没授权、没配置。
- Android WebView需在
AndroidManifest.xml中声明：<uses-permission android:name="android.permission.CAMERA"></uses-permission>，且6.0+还要运行时申请 - iOS WKWebView需在
Info.plist加键值：NSCameraUsageDescription（字符串描述用途），否则直接拒绝 - 部分旧版WebView（如Android 4.x系统自带）根本不支持
getUserMedia，得降级用<input type="file" accept="image/*" capture="environment">
Hybrid方案中用JSBridge让H5“喊”原生调相机更稳
纯Web API在APP里水土不服是常态，绕过WebView限制的通用做法是：H5发指令 → 原生拦截 → 原生调系统相机 → 拍完回传base64或文件路径给H5。
- Android端可在
WebView.addJavascriptInterface()暴露一个Java对象，比如叫NativeBridge，H5执行window.NativeBridge.takePhoto() - iOS端用
WKScriptMessageHandler监听takePhoto消息，再调UIImagePickerController - 务必约定好回调方式，例如成功后触发
window.onPhotoTaken({ base64: "..." })，避免用alert或全局变量传值
input[type="file"]在APP里触发相机的兼容写法
这是最轻量、兼容性最好的兜底方案，不依赖JS API，靠系统原生控件行为驱动。
- 写法必须带
capture属性：<input type="file" accept="image/*" capture="environment" id="camera-input">（environment指后置，user为前置） - 某些Android WebView会忽略
capture，此时可加click()模拟触发，但需用户真实交互上下文（比如按钮点击后立即调用，不能延时或异步） - 拿到
FileList后，用FileReader.readAsDataURL()转base64，注意大图可能卡顿，建议限制input的capture仅用于拍照，不用录像
调试时怎么看是H5问题还是APP容器问题
别一出问题就改JS，先快速定位瓶颈在哪一层。
立即学习“前端免费学习笔记（深入）”；
- 在APP里打开Chrome DevTools连真机：Chrome地址栏输入
chrome://inspect→ 找到你的WebView → 点“inspect”，看Console是否报DOMException: Permission denied类错误 - 用原生Log确认权限是否真正授予：Android用
Log.d打日志，iOS用NSLog，检查AVCaptureDevice.requestAccess(for:.video)返回值 - 临时把H5页面扔进手机浏览器（Chrome/Safari）打开，如果能调起相机，基本锁定是APP WebView配置或权限问题
requestLegacyExternalStorage配置和iOS的PHPhotoLibrary相册权限——哪怕只拍照不存图，某些系统版本也会因隐私策略拦截整个流程。 
