工单条码扫描需按平台差异化实现:App端依赖Barcode模块启用与相机权限,小程序需manifest中声明scope.userCamera及中文desc,H5端须弃用uni.scanCode,改用html5-qrcode并启用HTTPS。

直接说结论:工单条码扫描不能只靠 uni.scanCode 一句调用,必须按平台拆解——App 端依赖 Barcode 模块是否启用+权限是否到位,小程序需 scope.userCamera 显式声明,H5 端则根本不能用该 API,得换方案。
App 端扫码失败?先查 manifest.json 和运行时权限
很多团队在真机上扫不出工单条码,不是代码问题,是配置漏了:
- manifest.json 的「App 模块配置」里必须勾选
Barcode,否则uni.scanCode在 Android/iOS 上静默降级为相册选择(且不报错) - iOS 需在
plus->distribute->apple下补NSCameraUsageDescription字段,值不能为空或英文,例如"用于扫描工单条码以汇报进度",否则 App Store 审核被拒 - Android 6.0+ 必须运行时申请
android.permission.CAMERA,仅在 manifest 声明不够;建议在扫码按钮点击前加uni.authorize({ scope: 'scope.camera' })并处理拒绝逻辑 - 工单条码多为
CODE128或EAN13,务必显式传scanType: ['barCode'],否则某些华为/小米机型默认只启二维码识别
小程序扫码没反应?检查权限 desc 是否写对了
微信小程序调用 uni.scanCode 后无弹窗、无报错、直接进 fail 回调,90% 是权限配置写错:
- manifest.json 中
mp-weixin节点下必须有完整结构:{"permission": {"scope.userCamera": {"desc": "用于扫描工单条码以汇报进度"}}} -
desc字段值必须是中文,且语义明确;写成 "扫码" 或英文会被微信静默拦截 - 真机调试时,首次调用会弹授权框;若用户点“拒绝”,后续调用不会再次弹窗,需引导手动开启——可在
fail回调里判断err.errMsg.includes('auth denied')并跳转设置页
H5 端扫码必须绕开 uni.scanCode,用 html5-qrcode + HTTPS
浏览器没有硬件扫码能力,uni.scanCode 在 H5 下永远走 fail,且不返回任何错误信息。真实可用路径只有一条:
- 开发阶段用 Vite 插件(如
@vitejs/plugin-basic-ssl)启用本地 HTTPS,否则navigator.mediaDevices.getUserMedia直接拒绝调用 - 安装
html5-qrcode(非@zxing/library,后者需手动抽帧,对低性能设备卡顿明显) - 初始化时指定
formats: [Html5QrcodeSupportedFormats.CODE128, Html5QrcodeSupportedFormats.EAN13],避免默认只扫 QR - 扫码成功后立刻调用
html5QrCode.clear(),否则连续扫码可能触发重复回调;工单场景常需“扫一个→提交→再扫下一个”,这个清理动作不能省
扫码结果怎么用?别直接 parse result
工单系统常要求校验条码格式、提取字段、防重复提交,但 res.result 不是总能当字符串安全使用:
- 先判断
res.scanType:值为'bar'时才是工单条码,'qr'可能是跳转链接,'weapp'是小程序码(微信返回对象) -
res.result是纯字符串,但工单码常含前缀(如"WO-20261030-001"),业务层需正则提取编号部分,别直接丢给后端 - 同一条码 1 秒内重复扫码,应做前端去重(例如记录上一次扫码时间戳和内容),避免重复提交工单进度
- 扫码失败时,别只弹
uni.showToast,建议加一个「手动输入」入口——工单现场光线差、条码褶皱、手机老旧时,键盘输入是刚需兜底
最易被忽略的点:H5 端的扫码组件必须在 #ifdef H5 条件编译块里加载,否则打包到 App 端会因找不到 html5-qrcode 报运行时错误;而 App 端的 Barcode 模块初始化逻辑,也必须包裹在 #ifdef APP-PLUS 里,混写会导致多端构建失败。


















