微信小程序云开发-云存储的应用-识别身份证(正面和反面)

阅读原文时间：2023年07月09日阅读：2

一、准备工作

1、创建云函数identify

2、云函数identify中index.js代码

1 // 云函数入口文件
2 const cloud = require('wx-server-sdk')
3
4 //cloud.init()
5 //环境变量初始化
6 cloud.init({
7 evn:cloud.DYNAMIC_CURRENT_ENV //标志当前所在环境
8 })
9
10 // 云函数入口函数
11 exports.main = async (event,context) => {
12 const wxContext = cloud.getWXContext()
13 if(event.action=="1"){ //action为1 返回身份证的信息
14 try {
15 const result = await cloud.openapi.ocr.idcard({
16 "type": 'photo',
17 "imgUrl": event.imgUrl
18 })
19 return result
20 } catch (err) {
21 return err
22 }
23 }else if(event.action=="2"){ //action为2 返回银行卡的信息
24 try {
25 const result = await cloud.openapi.ocr.bankcard({
26 "type": 'photo',
27 "imgUrl": event.imgUrl
28 })
29 return result
30 } catch (err) {
31 return err
32 }
33 }else if(event.action=="3"){ //action为3 返回驾驶证的信息
34 try {
35 const result = await cloud.openapi.ocr.driverLicense({
36 "type": 'photo',
37 "imgUrl": event.imgUrl
38 })
39 return result
40 } catch (err) {
41 return err
42 }
43 }else if(event.action=="4"){ //action为4 返回行驶证的信息
44 try {
45 const result = await cloud.openapi.ocr.vehicleLicense({
46 "type": 'photo',
47 "imgUrl": event.imgUrl
48 })
49 return result
50 } catch (err) {
51 return err
52 }
53 }else if(event.action=="5"){ //action为5 返回营业执照的信息
54 try {
55 const result = await cloud.openapi.ocr.businessLicense({
56 "imgUrl": event.imgUrl
57 })
58 return result
59 } catch (err) {
60 return err
61 }
62 }else if(event.action=="6"){ //action为6 返回通用印刷体的信息
63 try {
64 const result = await cloud.openapi.ocr.businessLicense({
65 "imgUrl": event.imgUrl
66 })
67 return result
68 } catch (err) {
69 return err
70 }
71 }
72 }

二、创建页面并写相应代码

创建页面IdentifyIdcard，用于OCR识别身份证正面和反面

1、IdentifyIdcard.wxml

正反：{{idcardFrontMsg.type}} 身份证号：{{idcardFrontMsg.id}} 姓名：{{idcardFrontMsg.name}} 住址：{{idcardFrontMsg.addr}} 性别：{{idcardFrontMsg.gender}} 民族：{{idcardFrontMsg.nationality}}

正反：{{idcardBankMsg.type}} 有效期：{{idcardBankMsg.validDate}} 公安局：{{idcardBankMsg.authority}} 属性：{{idcardBankMsg.cardProperty}}

2、IdentifyIdcard.wxss

1 button{
2 margin: 20rpx;
3 }
4 .front{
5 margin: 20rpx;
6 }
7
8 .idcard{
9 text-align: center;
10 }
11 .idcard image{
12 width: 95%rpx;
13 height: 300rpx;
14 }

3、IdentifyIdcard.js

1 Page({
2 //初始化数据
3 data:{
4 showIdCardFront:false,
5 showIdCardBack:false,
6 //定义对象，存放需要展示在页面的信息
7 idcardFrontMsg:{},
8 idcardBankMsg:{},
9 },
10 /*
11 识别身份信息。分为4步：
12 //第一步：选择图片
13 //第二步：上传图片到云存储
14 //第三步：获取云存储图片的真实链接
15 //第四步：OCR识别图片信息
16 */
17
18 //识别身份证正面信息
19 identifyIdcardFront(){
20 //调用函数，实现选择图片
21 this.chooseImage()
22 },
23
24 //自定义函数，从相册/拍照选择图片
25 chooseImage(){
26 wx.chooseImage({
27 count: 1,
28 sizeType: ['original', 'compressed'],
29 sourceType: ['album', 'camera'],
30 }).then(res=>{
31 console.log("图片选择成功",res);
32 console.log("所选图片的临时链接",res.tempFilePaths[0]);
33 //调用函数，实现上传图片到云存储(传递参数为临时链接)
34 this.uploadFile(res.tempFilePaths[0])
35 }).catch(err=>{
36 console.log("图片选择失败",err);
37 })
38 },
39
40 //自定义函数，上传所选图片到云存储
41 uploadFile(tempFile){
42 wx.cloud.uploadFile({
43 cloudPath: (new Date()).valueOf()+'.png',
44 filePath: tempFile,
45 }).then(res=>{
46 console.log("图片上传到云存储成功",res);
47 console.log("图片在云存储里的fileID",res.fileID);
48 //调用函数，实现获取图片的真实链接（传递参数为云存储的fileID）
49 this.getImageURL(res.fileID)
50 //将上传成功的图片显示到页面上
51 this.setData({
52 idcardFrontURL:res.fileID
53 })
54 }).catch(err=>{
55 console.log("图片上传到云存储失败",err);
56 })
57 },
58
59 //自定义函数，用获取云函数图片的真实链接
60 getImageURL(fileID){
61 wx.cloud.getTempFileURL({
62 fileList:[fileID]
63 }).then(res=>{
64 console.log("获取图片真实链接成功",res);
65 //调用函数，实现识别身份证信息（传递参数为图片在云存储中的真实链接）
66 this.identify(res.fileList[0].tempFileURL)
67 }).catch(err=>{
68 console.log("获取图片真实链接失败",err);
69 })
70 },
71
72 //自定义函数，识别身份证信息
73 identify(imgUrl){
74 //调用云函数OCR识别身份证信息
75 wx.cloud.callFunction({
76 name:"identify",
77 data:{
78 imgUrl:imgUrl, //传递参数给云函数
79 action:"1"
80 }
81 }).then(res=>{
82 console.log("身份证图片识别成功",res);
83 this.setData({
84 idcardFrontMsg:res.result,
85 showIdCardFront:true,
86 showIdCardBack:false,
87 })
88 }).catch(err=>{
89 console.log("身份证图片识别失败",err);
90 })
91 },
92
93 //识别身份证背面信息
94 identifyIdcardBack(){
95 //选择图片
96 wx.chooseImage({
97 count: 1,
98 sizeType: ['original', 'compressed'],
99 sourceType: ['album', 'camera'],
100 }).then(res=>{
101 console.log("图片选择成功",res);
102 console.log("所选图片的临时链接",res.tempFilePaths[0]);
103 //上传图片
104 wx.cloud.uploadFile({
105 cloudPath: (new Date()).valueOf()+'.png',
106 filePath: res.tempFilePaths[0],
107 }).then(res=>{
108 console.log("图片上传到云存储成功",res);
109 console.log("图片在云存储里的fileID",res.fileID);
110 //将上传成功的图片显示到页面上
111 this.setData({
112 idcardBackURL:res.fileID,
113 })
114 //获取图片真实URL
115 wx.cloud.getTempFileURL({
116 fileList:[res.fileID]
117 }).then(res=>{
118 console.log("获取图片真实链接成功",res);
119 //识别身份证背面信息
120 wx.cloud.callFunction({
121 name:"identify",
122 data:{
123 imgUrl:res.fileList[0].tempFileURL, //传递参数给云函数
124 action:"1" //action为1表示身份证，2表示银行卡，3表示驾驶证（在云函数中自定义的）
125 }
126 }).then(res=>{
127 console.log("身份证图片识别成功",res);
128 this.setData({
129 idcardBankMsg:res.result,
130 showIdCardBack:true,
131 })
132 }).catch(err=>{
133 console.log("身份证图片识别失败",err);
134 })
135 }).catch(err=>{
136 console.log("获取图片真实链接失败",err);
137 })
138 }).catch(err=>{
139 console.log("图片上传到云存储失败",err);
140 })
141
142 }).catch(err=>{
143 console.log("图片选择失败",err);
144 })
145 }
146 })

三、效果展示

1、图片展示

2、视频展示

································································································································································································

报错分析：

1、报错：调用云函数识别身份证时，报错fail not enough market quota hint