uni.scanCode在H5不支持,需用input+qrcode.js替代;真机失败主因是权限未配置(manifest、系统描述、authorize调用顺序);关键参数包括scanType、onlyFromCamera、autoDecodeCharSet;鸿蒙/安卓14需额外适配权限声明。

uni.scanCode 在绝大多数平台能直接扫码,但H5 环境完全不支持——这不是你代码写错了,是浏览器根本没开放实时摄像头扫码的权限接口。
uni.scanCode 调用失败的常见原因和检查点
真机跑不起来、黑屏、报错 fail sys permission denied 或直接静默失败,90% 是权限或配置没到位:
-
manifest.json里没配相机权限:App端要勾选「Camera(相机)」模块;Android 需确认"permissions"数组含"android.permission.CAMERA";iOS 要补"NSCameraUsageDescription"描述字段 - 微信小程序需在
mp-weixin节点下加permission配置:{"scope.camera": {"desc": "用于扫码"}} - 没先调
uni.authorize({ scope: 'scope.camera' })就直接扫——iOS 和部分安卓会直接拒绝,连弹窗都不给 - 用户之前点过“拒绝”,后续再调
uni.authorize不会再次弹窗,得引导去系统设置手动开启
uni.scanCode 的参数怎么选才靠谱
别全靠默认值,几个关键参数直接影响体验和兼容性:
-
scanType:设成['qrCode'](只扫二维码)比默认全开更稳,避免误识别条形码;若需兼容一维码,加'barCode'即可 -
onlyFromCamera:设为true可禁用相册选图,适合签到、核销等强现场场景 -
autoDecodeCharSet:设为true能更好处理中文、特殊符号,尤其扫带中文参数的链接时别漏掉 - H5 平台传任何参数都无效——它压根不会执行,
fail回调会立刻触发,错误信息是not supported
H5 环境下怎么“假装”能扫码
浏览器不让直接调摄像头?那就换路子:让用户拍照或选图,再用 JS 解码。这个方案实测在 iOS Safari、Chrome Android、甚至鸿蒙 Browser 都能跑通:
- 用
实现「拍照 or 相册二选一」,capture="environment"强制调后置摄像头(部分安卓有效) - 选完图片后,用
qrcode.js(不是 npm 上那个同名包,是纯前端、无依赖的解码库)调qrcode.decode(file) - 注意:图片必须是 JPEG/PNG,且不能太大(建议限制
2MB),否则解码超时或内存溢出 - 别用
qrcode-decoder这类老库——对倾斜、反光、低对比度二维码识别率极低;qrcode.js的容错逻辑更成熟
容易被忽略的鸿蒙和安卓 14+ 兼容细节
鸿蒙 NEXT 和安卓 14 对摄像头权限做了更细粒度管控,uni.scanCode 表面能调起,但可能扫不出结果或闪退:
- 鸿蒙侧需确认
module.json5中已声明ohos.permission.CAMERA,且用户授权时选的是「仅在使用中允许」而非「始终允许」(后者在鸿蒙上实际不生效) - 安卓 14 要求 targetSdkVersion ≥ 34 时,必须显式声明
android:usesPermissionFlags="neverForLocation",否则相机预览黑屏 - 某些国产厂商 ROM(如小米 HyperOS)会拦截非系统级扫码请求,此时 fallback 到「文件上传 + qrcode.js」是最稳妥的兜底方案
真正在意扫码成功率的项目,从来不是只写一遍 uni.scanCode 就完事——得按平台切逻辑,H5 必须走图片解析,鸿蒙和新安卓得额外验权限标志位,而用户那句“扫不出来”,往往卡在 manifest 里少敲了一个引号。











