目录
- 前言
- 百度端创建应用
- 实现过程
- 结语
前言
微信小程序集成百度图像识别功能,实现对上传或拍照的身份证进行扫描,并获取身份证信息。
百度端创建应用
- 访问网址https://login.bce.baidu.com/,选择“人工智能”--“图像识别”;
- 在栏目“应用列表”下新建应用,并勾选项目需要的接口;保存后列表会生成对应的“API Key”和“Secret Key”。
实现过程
- 为了演示方便,页面只放了一个上传按钮,代码如下:
- test.js文件存放逻辑代码,如下图:
// pages/test/test.js Page({ /** * 页面的初始数据 */ data: { baiduToken: '' }, /** * 生命周期函数--监听页面加载 */ onLoad: function(options) { this.getBaiduToken(); }, // 获取百度access_token getBaiduToken: function() { const apiKey = '生成的API Key'; const seckey = '生成的Secret Key'; const tokenUrl = `https://aip.baidubce.com/oauth/2.0/token?grant_type=client_credentials&client_id=${apiKey}&client_secret=${seckey}`; let that = this; wx.request({ url: tokenUrl, method: 'POST', dataType: 'json', header: { 'content-type': 'application/json; charset=UTF-8' }, success: function(res) { console.log('getBaiduToken提示pass', res); that.setData({ baiduToken: res.data.access_token }) }, fail: function(res) { console.log('getBaiduToken提示fail', res); } }) }, // 上传图片 uploadImg: function() { let that = this; wx.chooseImage({ count: 1, sizeType: ['original', 'compressed'], sourceType: ['album', 'camera'], success(res) { // tempFilePath可以作为img标签的src属性显示图片 const tempFilePaths = res.tempFilePaths console.log(tempFilePaths) // 路径转化为base64图片 wx.getFileSystemManager().readFile({ filePath: tempFilePaths[0], encoding: 'base64', success: res => { console.log('读图片数据pass', res.data); that.scanImageInfo(res.data); }, fail: res => { console.log('读图片数据fail', res.data); } }) } }) }, // 扫描图片中的数据 scanImageInfo: function(imageData) { let that = this; const detecUrl = 'https://aip.baidubce.com/rest/2.0/ocr/v1/idcard?access_token=' + this.data.baiduToken; wx.showLoading({ title: '加载中', }); wx.request({ url: detecUrl, data: { image: imageData, id_card_side: 'front' }, method: 'POST', dataType: 'json', header: { 'content-type': 'application/x-www-form-urlencoded' }, success: res => { console.log('success', res.data.words_result) }, fail: res => { console.log('fail') }, complete: res => { wx.hideLoading(); } }) } })
- 真机调试获取数据如下(预览获取数据有问题):
结语
文中以小程序为例,也可以实现其它语言,只需修改为相应的API即可。