uni-app无法仅靠uni.scancode实现跨平台扫一扫,因h5端完全不可用,app端需启用barcode模块并补全权限,小程序端须配置permission与scantype,h5端只能用zxing-library或扫码枪替代。

uni-app 无法靠 uni.scanCode 一句就实现类似微信的扫一扫——它在 H5 端完全不可用,App 端依赖原生模块是否启用,小程序端权限配置稍有遗漏就会静默失败,且默认不带扫描动画、不支持连续扫码、结果结构也不统一。
App 端必须启用 Barcode 模块并补全权限
很多开发者以为 manifest.json 勾了 Camera 就够了,其实不够:
- manifest.json 的「模块配置」里必须手动勾选
Barcode(不是 Camera),否则uni.scanCode在 App 端直接 fallback 到相册选择 - iOS 需在
manifest.json的plus → distribute → apple下添加NSCameraUsageDescription字段,值不能为空,例如"用于扫描商品条码",否则审核被拒 - Android 6.0+ 必须运行时申请
android.permission.CAMERA,仅在permissions数组里声明无效;建议在调用前加uni.authorize({ scope: 'scope.camera' }),并处理用户点“拒绝”后的引导逻辑
小程序端要配 permission + 显式指定 scanType
微信小程序里 uni.scanCode 不是“写了就能扫”,常见静默失败就是因为没写权限描述或类型限制太松:
由于微信的大热,为了更好的方便使用微信的用户查询一些信息,这篇文章是入门级的微信公众平台开发教程,需要的朋友可以参考下 这篇入门教程将引导你完成如下任务: 创建百度云平台应用启用微信公众平台开发模式获取订阅、文字、图片、语音、视频消息回复文本、图文及音乐消息程序开发
-
mp-weixin节点下必须写{"permission": {"scope.userCamera": {"desc": "用于扫码识别条形码"}}},漏掉desc字段会导致调用无反应 - 务必传
scanType: ['barCode'],否则某些安卓机型(尤其华为)默认只识别二维码,条形码直接跳过 - 加
onlyFromCamera: true可禁用相册选图,避免用户误点相册导致业务流程中断
H5 端只能换方案,别碰 uni.scanCode
uni.scanCode 在 H5 下永远走 fail 回调,错误信息是 not supported,这不是 bug,是浏览器策略限制。真实可用路径只有两条:
- 对接扫码枪:把
<input type="text" autofocus>放在页面上,监听input和keyup.enter,因为扫码枪本质是 HID 键盘,输入完自动回车 - 用
@zxing/library自建视频流识别:需 HTTPS 环境(本地开发用@vitejs/plugin-basic-ssl启 HTTPS),手动控制video设备选择、帧率和解码频率;注意它对 EAN-13/UPC-A 支持好,但对反光、模糊条码识别率明显低于原生 SDK,得加提示语“请保持条码平整、光线充足”
结果解析必须按 scanType 分支处理
不同平台返回的 res 结构差异极大,直接取 res.result 容易报错:
-
res.scanType === 'bar'时,res.result是纯数字字符串(如"6923450654321"),不含校验位,业务层得自己做模10校验 -
res.scanType === 'qr'时,res.result可能是 URL、JSON 字符串甚至 base64,JSON.parse(res.result)会直接崩 - 微信小程序还可能返回
scanType: 'weapp',此时res.result是对象,要取res.result.path和res.result.extraData
最常被忽略的是:H5 用 @zxing/library 识别出的结果没有 scanType 字段,你得自己根据内容格式(比如是否全是数字+长度13/12)推断类型,而不是复用小程序/APP 的判断逻辑。










