官方文档 文字识别 跑通 Demo（小程序） - 客户端 SDK 接入文档 - 文档中心 - 腾讯云
可以先按照腾讯云的demo 去跑通一下 （记得先开通哈）
一、代码解析
在demo中主要就是 id-card 文件去控制这识别 及显隐 ocrsdk/pages/id-card/id-card
在代码中就是通过 wx:if 来控制 相机组件 是否是显示和隐藏 showCamera
上传身份证之后 发现控制台并没有输出 在哪里调用的 所以我们要去它的内部去找出它识别的位置代码
在id-card 第一行中 require('../behaviors/multi-side-behavior'); 引入了一个js文件 而它里面有一个 onOcrSuccess 方法 这个方法就是识别出来的内容
二、引入到自己的项目
在自己的项目中并不想 要官方内置的样式 所以这时候只能去手动改官方的源码 实现自己想要的效果
先按照 官方提供的基础操作 文字识别 快速集成（小程序 ） - 客户端 SDK 接入文档 - 文档中心 - 腾讯云
总共分为三部分
1.引入官方sdk到根目录
2.在想要识别的地方引入到文件中
3. 修改官方代码 改成自己想要的效果
注意在配置sdk的参数时 腾讯云的秘钥要从服务端获取 保留在前端是不安全的~
接下来直接说如何放到自己项目下
先给身份证正面 来一个点击事件
uploadZ(){wx.setStorageSync('id-arrow', 'FRONT')ocrSdk.start({secretId:that.data.SecretId, //接口获取的秘钥secretKey:that.data.SecretKey,ocrType: ocrSdk.OcrType.ID_CARDF,ocrOption: {Config: {"CropIdCard": true,"CropPortrait": true}},cameraConfig: {autoMode: true,maxTry: 3,},resultPage: true,resultPageConfig: {modifiable: true,},theme: 'primary',success: (res) => {console.log('ocr result is:', res)// wx.navigateTo({// url: '您的小程序页面',// })wx.navigateTo({url: '/pages/mine/settlementDetails/settlementDetails',})},fail: (error)=> {console.log('ocr failed:', error)}});},wx.setStorageSync('id-arrow', 'FRONT') 在本地存储一个变量 来检测区分正反面 因为是官方内置的sdk 没办法携带参数 到识别页面
接下来就会触发 id-card.js文件 我们在onLoad 中去执行 调用代码 不通过点击事件去调用
id-card.js
onLoad(e){this.onItemTap( wx.getStorageSync('id-arrow'))},
onItemTap(side) {// const { side } = e.currentTarget.dataset;const { ocrResponse } = this.data;// 清除上次结果if (ocrResponse) {let temp = {};Object.keys(ocrResponse).forEach((item) => {if (ocrResponse[item].side !== side) {temp[item] = ocrResponse[item];}});if (Object.keys(temp).length === 0) {temp = null;}this.setData({ ocrResponse: temp });console.log(ocrResponse,'信息');}this.setData({showCamera: true,selectedSide: side,});},behaviors/multi-side-behavior.js
在执行成功的文件中 判断是正反面 从使用小程序的页面栈去赋值上一页的变量 就可以啦
onOcrSuccess(detail, res) {console.log(detail,res,'数据');if(detail.side=="FRONT"){const pages = getCurrentPages()pages[pages.length-2].__data__.form.f_id_card=respages[pages.length-2].__data__.frontImage=detail.filePath}else if(detail.side=='BACK'){const pages = getCurrentPages()pages[pages.length-2].__data__.form.b_id_card=respages[pages.length-2].__data__.BackImage=detail.filePath}wx.navigateBack({delta: 0,})
}
