更新记录

1.0.1(2025-03-09)

修复了对vue2的适配 修复了在uniapp的适配

1.0.0(2025-02-02)

华为统一扫码服务sdk生成插件支持13中码制式快速识别和生成 目前兼容安卓Android 4.4 ~ 14,iOS暂不支持 华为手机EMUI 3.0 ~ 11、HarmonyOS 2.0及以上


平台兼容性

Vue2 Vue3
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
Android:5.0,iOS:不支持,HarmonyNext:不支持 × × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序 鸿蒙元服务
× × × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
× × × × × × × × ×

wui-scanCode开发文档

介绍

uniapp和uniappx均可使用,注意:本插件只对uniapp和uniappX均为4.45以上做适配4.45以前不确定可以试用测试 本插件是集成了华为统一扫码服务sdk实现原生扫码快速识别同时支持13中码生成和码识别 分别可以识别和生成 二维码 QR,PDF417,Aztec,DataMatrix。条形码UPC-A,UPC-E ITF14,EAN-8,EAN-13,Codabar,Code93,Code39,Code128。声名本插件需要云打包 自定义基座才能正常运行测试使用,目前兼容安卓Android 4.4 ~ 14,iOS暂不支持 华为手机EMUI 3.0 ~ 11、HarmonyOS 2.0及以上,目前扫码只支持单码模式识别。

华为统一扫码服务应用场景视频介绍

码生成以及扫码效果视频介绍

快速使用

注意:uniapp需在manifest.json寻找 / 安卓常用其他设置 /minSdkVersion 设置成 21 uniappx不用设置 如图: 1 . 插件市场下载导入当前项目 2 . 在使用页面引入插件

import { scanCode, generateCode } from '@/uni_modules/wui-scanCode';

3 . 完整实例用法

<template>
    <view>
        <text>扫码内容是:{{scanValue}}</text>
        <text>码类型是:{{scanType}}</text>
        <button @click="SYS">扫一扫</button>
        <button @click="SYSENG">码生成</button>
        <image :src="src" mode="aspectFit"></image>
    </view>
</template>

<script>
    import { scanCode, generateCode } from '@/uni_modules/wui-scanCode';
    export default {
        data() {
            return {
                src: "",
                scanValue:"",
                scanType:""
            }
        },
        onLoad() {

        },
        onReady() {

        },
        methods: {
            //扫一扫识别
            SYS() {
                scanCode({
                    soundSrc: '/static/saoma.mp3,  //扫码音效配置 需要时可以添加成你自己的音效文件
                    shake: true,   //是否开启震动提示
                    setTitle: 0, //扫码页面标题0为二维码/条形码1为二维码
                    success: (res) => {
                        this.scanValue = res.scanValue;
                        this.scanType = res.scanType;
                    },
                    fail: (res) => {
                        console.log('fail', res);
                    }
                })
            },
            //生成二维码
            SYSENG() {
                generateCode({
                    content: `这里是要生的二维码内容`,
                    type: 'QRCODE',
                    QRErr: 'H',
                    fgColor: '#0000ff',
                    width: 380,
                    height: 380,
                    success: (res) => {
                        //res就是Base64编码二维码图片
                        this.src = res;
                    }
                })
            }
        }
    }
</script>

<style>

</style>

3 .云打包自定义基座 如图:

构建扫码 scanCode(options : scanCodeOptions)

配置 scanCodeOptions的配置项 scanCodeOptions 必备 类型 说明
soundSrc 否 ( 默认null ) string 扫码音效的文件路径及网络地址
shake 否 ( 默认false ) boolean 扫码成功同时是否开启震动提示
setTitle 否 ( 默认0 ) Int 扫码页面标题0为二维码/条形码1为二维码
success 否 ( 默认null ) (res : scanSuccess) => void 扫码成功回调,码值res.scanValue ,码类型res.scanType
fail 否 ( 默认null ) (res : string) => void 扫码失败回调,失败信息提示 res
complete 否 ( 默认null ) () => void 扫码执行完成回调成不成功都执行

构建码生成generateCode(options : generateCodeOptions)

配置 generateCodeOptions的配置项 generateCodeOptions 必备 类型 说明
content string 生成码的内容,字符串类型
type string 生成码的类型,字符串类型,在指定错误时默认指向QR二维码
logoSrc 否 ( 默认null ) string 生成码的log图片文件路径及网络地址,字符串类型,只针对QR二维码有效
QRErr 否 ( 默认null ) string 生成码的纠错等级默认为"L",字符串类型,只针对QR二维码有效
width Int 生成码的宽,必须指定
height Int 生成码的高,必须指定
margin 否 ( 默认1 ) Int 生成码的边距,默认为1
bgColor 否 ( 默认 "#FFFFFF" ) string 生成码的背景色,默认为白色
fgColor 否 ( 默认 "#000000" ) string 生成码的前景色,默认为黑色
success 否 ( 默认null ) (res : string) => void 生成码成功回调,Base64图片res
fail 否 ( 默认null ) (res : string) => void 生成码失败回调,失败信息提示res
complete 否 ( 默认null ) () => void 生成码执行完成回调,成不成功都执行
针对QR二维码的纠错等级QRErr的设置参数 L M Q H
可纠正约7%错误 可纠正约15%错误 可纠正约25%错误。 可纠正约30%错误

生成码参数建议以及type值参照表

  • 码图颜色和背景建议 建议使用默认背景:白色背景,黑色码图。如果使用反色会影响识别率。

  • 码图边框建议 建议使用默认边框,单位为像素,取值范围为[1, 10]。

  • 码图大小建议 生成QR、DataMatrix、Aztec制式的码,建议输入的width和height相同,并且大于200,否则生成的码过小会影响识别。 生成EAN-8、EAN-13、UPC-A、UPC-E、Codabar、Code 39、Code 93、Code 128、ITF14、PDF417制式的码,建议输入的width和height比例在2:1,并且width要大于400,否则生成的码过小影响识别。

  • 长度和内容限制参考如下表格:

type值 string 生成码类型 长度支持 内容支持
QRCODE QR二维码 最长支持2953个UTF-8编码字节 支持中文,1个中文字占用3个字节,如果内容过长会导致码复杂,影响识别。
AZTEC Aztec二维码 最长支持2953个UTF-8编码字节 支持中文,1个中文字占用3个字节,如果内容过长会导致码复杂,影响识别。
PDF417 PDF417二维码 最长支持1777个UTF-8编码字节 支持中文,1个中文字占用3个字节,如果内容过长会导致码复杂,影响识别。
DATAMATRIX DataMatrix二维码 最长支持2335个UTF-8编码字节 iOS支持中英文,1个中文字占用3个字节,Android只支持英文,如果内容过长会导致码复杂,影响识别。
UPCCODE_A UPC-A条形码 支持11位数字输入 只支持数字,生成包含12位数字的码图,包含最后一位校验数字。
UPCCODE_E UPC-E条形码 支持7位数字输入 只支持数字,首位需要是0或1,生成包含8位数字的码图,包含最后一位校验数字。
ITF14 ITF14条形码 支持80位以内数字输入,并且需要是偶数位 只支持数字,生成包含偶数位数字的码图,如果内容过长会导致码复杂,影响识别。
EAN8 EAN-8条形码 支持7位数字输入 只支持数字,生成包含8位数字的码图,包含最后一位校验数字。
EAN13 EAN-13条形码 支持12位数字输入 只支持数字,首位不可以是0,生成包含13位数字的码图,包含最后一位校验数字。Android端首位如果不是0则生成UPC-A码。
CODE39 Code 39条形码 最长支持80字节长度 字符集可以是数字、大写字母和- . $ / + % SPACE英文格式符号。
CODE93 Code 93条形码 最长支持80字节长度 字符集可以是数字、大写字母和- . $ / + % * SPACE英文格式符号。
CODE128 Code 128条形码 最长支持80字节长度 字符集是编码表中的字符集。
CODABAR Codabar条形码 最长支持2953个UTF-8编码字节 开头如果是ABCDTN*E字符,结尾也要是相应字符,如果不是上述字符,则默认添加A到码值的开头和结尾。其他字符可以是数字和- . $ / : +英文格式符号。

本插件所涉及的权限与页面交互逻辑

  • 针对扫码权限,已实现获取本地相机权限用户同意或不同意的交互逻辑及授权提醒
  • 针对扫码权限,已实现获取本地相册权限用户同意或不同意的交互逻辑及授权提醒
  • 当获取权限的同时用户禁止了再次使用提醒用户会跳转到授权页面去手动设置权限

隐私、权限声明

1. 本插件需要申请的系统权限列表:

相机、相册读取

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问