微信小程序实现身份证识别功能——OCR插件

在项目中遇到需要收集用户身份证信息时，可以使用微信小程序提供的 OCR 插件扫描获取信息，实现步骤及方法入下：

1. 进入小程序平台添加插件

添加完成后 ，需要领取免费额度，是一天100次。多了就需要购买。链接地址：

fuwu.weixin.qq.com/detail/000c…

点击链接进入如下界面，进行对应的操作即可：

2. 在项目中进行配置

2.1 在小程序的 app.json 文件中增加声明引入插件
version选择最新版本

"plugins": {
    "ocr-plugin": {
      "version": "3.0.6",
      "provider": "wx4418e3e031e551be"
    }
 }

查看最新版本：

2.2 在需要使用到的页面的 json 也要增加声明

{
  "usingComponents": {
    "ocr-navigator": "plugin://ocr-plugin/ocr-navigator"
  }
}

2.3 在需要使用的位置添加以下代码即可：

<view class="app">
  <view>
    <ocr-navigator bind:onSuccess="success_1" certificateType="idCard" opposite="{{false}}">
      <button type="primary">身份证正面识别(头像面)</button>
    </ocr-navigator>
    <view class="mt20">
      <view>姓名：<text>{{name}}</text></view>
      <view>性别：<text>{{sex}}</text></view>
      <view>出生：<text>{{birthday}}</text></view>
      <view>民族: <text>{{national}}</text></view>
      <view>住址：<text>{{address}}</text></view>
      <view>公民身份证号：<text>{{idCardNO}}</text></view>
    </view>
  </view>
  
  <view>
    <ocr-navigator bind:onSuccess="success_2" certificateType="idCard" opposite="{{true}}">
      <button class="second" type="primary">身份证反面识别（国徽面）</button>
    </ocr-navigator>
    <view class="mt20">
      <view>
        签发机关：<text>{{organazation}}</text>
      </view>
      <view>
        有效日期: <text>{{validTime}}</text>
      </view>
    </view>
  </view>
</view>

2.4 在 js 文件中进行数据赋值即可

// pages/my/my.js
Page({
  data: {
    name: "", // 姓名
    sex: "",  // 性别
    birthday: "",  // 出生日期
    national: "", // 民族
    address: "", // 住址
    idCardNO: "", // 身份证号
    imgPath:"", // 图片地址
    organazation: "", // 签发机关
    validTime: ""', //有效日期
  },
  success_1(e) {
    this.setData({
      name: e.detail.name.text,
      sex: e.detail.gender.text,
      birthday: e.detail.birth.text,
      national: e.detail.nationality.text,
      address: e.detail.address.text,
      idCardNO: e.detail.id.text,
      imgPath: e.detail.image_path
    })
  },
  success_2(e) {
    this.setData({
      validTime: e.detail.valid_date.text,
      organazation: e.detail.authority.text
    })
  }
})

2.5 ocr-navigator 标签属性说明：
certificateType为识别卡片的类型, 包含以下五种：
身份证：idcard
行驶证：drivingLicense
驾驶证：driverslicense
银行卡：bankCard
营业执照：businessLicense

opposite：显示正/反面。