更新记录

1.0.5(2026-04-19)

  • 移除iOS端本地依赖

1.0.4(2026-04-19)

  • 移除本地依赖,减少包体积

1.0.3(2026-04-19)

  • 返回参数增加原图字段返回
  • 预览图片字段增加车牌部分裁剪处理,方便在页面预览
查看更多

平台兼容性

uni-app(5.06)

Vue2 Vue2插件版本 Vue3 Vue3插件版本 Chrome Safari app-vue app-nvue Android Android插件版本 iOS 鸿蒙
1.0.0 1.0.0 - - - - 5.0 1.0.0 12 -
微信小程序 支付宝小程序 抖音小程序 百度小程序 快手小程序 京东小程序 鸿蒙元服务 QQ小程序 飞书小程序 小红书小程序 快应用-华为 快应用-联盟
- - - - - - - - - - - -

uni-app x(5.06)

Chrome Safari Android Android插件版本 iOS 鸿蒙 微信小程序
- - 5.0 1.0.0 12 - -

xwq-ocr-recognize

基于 UTS 车牌识别插件,支持 Android、IOS。

功能说明

  • 实时相机车牌识别
  • 从系统相册选择图片识别车牌
  • 传入应用本地图片绝对路径识别车牌
  • 成功回调返回车牌信息、置信度、车牌类型和缓存图片地址
  • 自动处理图片 EXIF 方向,提升横拍、竖拍图片识别成功率

插件亮点

  • 扫描页底部操作区已统一为图片按钮风格,包含返回按钮、相册按钮、识别状态文案和半透明操作栏
  • 相机识别会先按识别方向矫正图片,再根据 SDK 返回的车牌框裁剪,减少旋转导致的裁剪偏移
  • 成功回调中的 imagePath 优先返回车牌局部裁剪图,sourceImagePath 保留原始图片路径,方便页面预览与再次识别分开使用
  • 车牌裁剪区域已做适度外扩,避免车牌边缘裁切过紧

导出方法

import {
    showLPRScanner,
    recognizeImage,
    recognizeImagePath
} from "@/uni_modules/xwq-ocr-recognize";

showLPRScanner(options)

打开实时车牌扫描页。

recognizeImage(options)

打开系统相册选择图片并识别车牌。

recognizeImagePath(imagePath, options)

传入应用本地图片绝对路径,直接识别车牌。

  • imagePath: 应用可访问的本地绝对路径,支持 file:// 前缀或普通绝对路径

回调字段说明

成功回调结构:

type CallbackValType = {
    type: string,
    option: {
        plate?: string,
        imagePath?: string | null,
        sourceImagePath?: string | null,
        plateType?: number | null,
        plateTypeName?: string | null,
        confidence?: number | null
    }
}

字段说明:

  • plate: 识别到的车牌号
  • imagePath: 识别结果预览图地址,优先返回车牌局部裁剪图;页面可直接用于 <image><img> 等组件展示。iOS 端为 base64,Android 端为本地缓存文件路径
  • sourceImagePath: 原始识别图片地址,不做裁剪。iOS 端返回整图 base64,Android 端返回原始识别图路径,可继续作为本地路径识别入参使用
  • plateType: 车牌类型数值
  • plateTypeName: 车牌类型中文名称
  • confidence: 识别置信度

imagePath 典型返回示例:

/storage/emulated/0/Android/data/uni.app.xxxxx/cache/xwq-ocr-recognize/local_123456789.jpg

Vue 页面调用示例

<template>
    <view class="page">
        <button @click="scanPlate">实时识别</button>
        <button @click="pickPlate">相册识别</button>
        <button @click="recognizeLocalPlate">本地路径识别</button>

        <view class="result">
            <text>车牌号:{{ result.plate }}</text>
            <text>车牌类型:{{ result.plateTypeName }}</text>
            <text>置信度:{{ result.confidenceText }}</text>
            <text selectable="true">图片地址:{{ result.imagePath }}</text>
            <image
                v-if="result.imagePath"
                :src="result.imagePath"
                mode="widthFix"
                class="preview"
            />
        </view>
    </view>
</template>

<script>
import {
    showLPRScanner,
    recognizeImage,
    recognizeImagePath
} from "@/uni_modules/xwq-ocr-recognize";

export default {
    data() {
        return {
            result: {
                plate: "",
                plateTypeName: "-",
                confidenceText: "-",
                imagePath: ""
            },
            sourceImagePath: ""
        };
    },
    methods: {
        updateResult(res) {
            const option = res && res.option ? res.option : {};
            // iOS 端这里是未裁剪整图 base64,Android 端这里是原始识别图路径
            this.sourceImagePath = option.sourceImagePath || this.sourceImagePath;
            this.result = {
                plate: option.plate || "",
                plateTypeName: option.plateTypeName || "-",
                confidenceText: typeof option.confidence === "number"
                    ? (option.confidence * 100).toFixed(2) + "%"
                    : "-",
                imagePath: option.imagePath || this.sourceImagePath || ""
            };
        },
        scanPlate() {
            showLPRScanner({
                success: (res) => {
                    this.updateResult(res);
                },
                error: (err) => {
                    console.log("实时识别失败", err);
                }
            });
        },
        pickPlate() {
            recognizeImage({
                success: (res) => {
                    this.updateResult(res);
                },
                error: (err) => {
                    console.log("相册识别失败", err);
                }
            });
        },
        recognizeLocalPlate() {
            const localImagePath = this.sourceImagePath || "/storage/emulated/0/Android/data/uni.app.xxxxx/files/test.jpg";
            recognizeImagePath(localImagePath, {
                success: (res) => {
                    this.updateResult(res);
                },
                error: (err) => {
                    console.log("本地图片识别失败", err);
                }
            });
        }
    }
};
</script>

<style>
.page {
    padding: 16px;
}

.result {
    margin-top: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.preview {
    width: 100%;
    margin-top: 12px;
}
</style>

说明

  • 插件会将识别图片回调,方便页面直接访问
  • 实时相机识别、相册识别、本地路径识别三种方式都会返回 imagePath
  • 返回结果中,imagePathsourceImagePath 已区分为“裁剪预览图”和“原始识别图”
  • iOS 端由于无法直接稳定访问沙盒路径,imagePathsourceImagePath 均使用 base64 返回,其中 sourceImagePath 为未裁剪整图
  • 相册图片和本地路径图片都会尝试按 EXIF 方向自动纠正后再识别
  • Android 5.0 及以上可用
  • Ios 12.0 及以上可用

其他插件预览

隐私、权限声明

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

相机、相册

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

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