微信小程序中OCR身份证识别流程
申请权限
登录微信小程序开发平台
设置 -> 第三方设置 -> 插件管理
点击添加，搜索OCR添加即可，如下图所示
点击详情可以看到插件的开发文档
文档传送门
这里值得注意的是要从开放平台购买微信 OCR 识别
不购买直接调用识别接口会报错 101003，官方文档并没有解释101003是因为没有购买。
这里购买每天一百次，一年以内都是免费的
代码
如果是原生微信小程序的写法，直接按照开发文档引入即可
OCR.idcard为例
因为 uni-app 中并没有可以支持微信小程序 OCR 功能的插件，所以我们为了适配直接在 uni-app 里面使用微信原生的 api 方法
根据官方文档，我们将步骤分为三步走
- 获取accessToken
- 选择本地图片（或者选择已经上传成功图片的网络地址）
- 调用接口进行识别
获取accesstoken 需要 appId 和 secret ，这两个参数在小程序开放平台均可查看
直接上代码
// 获取accessTokengetAccessToken() {return new Promise((resolve, reject) => {uni.request({url: 'https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=*****&secret=***',}).then(response => {// 这里的返回结果是经过我们自己封装的，请根据自己的实际情况返回if(response[1].statusCode === 200) {resolve(response[1].data.access_token)} else {reject(error)}}).catch(error => {reject(error)})}) }// OCR证件识别 - 仅用于微信小程序async identifyIDcard() {const accessToken = await this.getAccessToken()console.log(accessToken)// 这里使用的是uni，但并不影响，改成wx也可行，不比纠结uni.chooseMedia({count: 1,sourceType: ['album', 'camera'],success(res) {console.log(res.tempFiles[0].tempFilePath)// 这里亲测了使用上传文件的临时缓存地址不可辨别！！！// 请使用上传成功后的网络地址或将图片作为 FormData 直接上传uni.request({url: 'https://api.weixin.qq.com/cv/ocr/idcard?type=photo&img_url=' + encodeURIComponent('https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=2582405855,2667866727&fm=26&gp=0.jpg') + '&access_token=' + accessToken,method: 'POST',success: function(response) {console.log(response)if(response.statusCode === 200 && response.data.errcode === 0) {wx.showToast({title: response.data.name + '识别成功'})} else {wx.showToast({title: response.data.errmsg})}},fail: function(error) {wx.showToast({title: error})}})}})}
我从网上随便找了一张示例图：
到此，我们需要的就可以了
值得注意的是，虽然我写了 chooseImage ，但其实是没有用到的
我们看一下执行结果
识别成功！
切记：101003的错误原因是因为没有申请免费试用权限
直接使用封装好的按钮
此种方法只能使用在线扫描，无法使用在线地址
逻辑为：扫描成功后上传服务器
其余申请权限都一样，JS方法不需要写
分别在app.json和page.json中添加使用的模块
"usingComponents": {"ocr-navigator": "plugin://ocr-plugin/ocr-navigator"}
然后在wxml中写入：
<!-- 直接调用按钮，无需自己写方法 --><ocr-navigator bind:onSuccess="success" certificateType="idCard" :opposite="false"><button type="primary" class="mainBtn">拍摄身份证头像面</button></ocr-navigator>
样式如上，可以自行修改
我们真机调试一下
这是调用识别成功之后的返回身份信息
识别成功之后我们就可以将正确的证照图片上传到服务器上
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！