微信小程式雲開發-雲存儲的應用-識别營業執照

一、準備工作

1、建立雲函數identify

二、雲函數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 }      

二、建立頁面并寫相應代碼

 建立頁面IdentifyBusinessLicense，用于OCR識别營業執照

 1、IdentifyBusinessLicense.wxml

1 <!-- 識别營業執照資訊 -->
 2 <button bindtap="IdentifyBusinessLicense" type="primary">識别營業執照</button>
 3 <!-- 把識别到的營業執照圖檔顯示到頁面上 -->
 4 <view class="idcard">
 5 <image src="{{IdentifyBusinessLicenseURL}}" ></image>
 6 </view>
 7 <!-- 把識别到的營業執照資訊顯示到頁面上 -->
 8 <view class="front" wx:if="{{showdBusinessLicense}}">
 9   <view>【證件标題】：{{BusinessLicenseMsg.title}}</view>
10   <view>【注冊編号】：{{BusinessLicenseMsg.regNum}}</view>
11   <view>【企業名稱】：{{BusinessLicenseMsg.enterpriseName}}</view>
12   <view>【企業類型】：{{BusinessLicenseMsg.typeOfEnterprise}}</view>
13   <view>【企業住所】：{{BusinessLicenseMsg.address}}</view>
14   <view>【法定代表人】：{{BusinessLicenseMsg.legalRepresentative}}</view>
15   <view>【注冊資本】：{{BusinessLicenseMsg.registeredCapital}}</view>
16   <view>【成立日期】：{{BusinessLicenseMsg.registeredDate}}</view>
17   <view>【營業期限】：{{BusinessLicenseMsg.validPeriod}}</view>
18   <view>【經營範圍】：{{BusinessLicenseMsg.businessScope}}</view>
19   <view>【外廓尺寸】：{{BusinessLicenseMsg.imgSize.h}}*{{BusinessLicenseMsg.imgSize.w}}</view>
20 </view>      

2、IdentifyBusinessLicense.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: 800rpx;
14 }      

3、IdentifyBusinessLicense.js

1 // pages/IdentifyDriverLicense/IdentifyDriverLicense.js
 2 Page({
 3   //初始化資料
 4     data:{
 5       showdBusinessLicense:false,
 6       BusinessLicenseMsg:{}
 7     },
 8   
 9   //識别駕駛證資訊
10   IdentifyBusinessLicense(){
11       //選擇圖檔
12       wx.chooseImage({
13       count: 1,
14       sizeType: ['original', 'compressed'],
15       sourceType: ['album', 'camera'],
16     }).then(res=>{
17       console.log("圖檔選擇成功",res);
18       console.log("所選圖檔的臨時連結",res.tempFilePaths[0]);
19       //上傳圖檔
20       wx.cloud.uploadFile({
21         cloudPath: (new Date()).valueOf()+'.png',
22         filePath: res.tempFilePaths[0], 
23       }).then(res=>{
24         console.log("圖檔上傳到雲存儲成功",res);
25         console.log("圖檔在雲存儲裡的fileID",res.fileID);
26         //将上傳成功的圖檔顯示到頁面上
27         this.setData({
28           IdentifyBusinessLicenseURL:res.fileID,
29         })
30         //擷取圖檔真實URL
31         wx.cloud.getTempFileURL({
32           fileList:[res.fileID]
33         }).then(res=>{
34           console.log("擷取圖檔真實連結成功",res);
35           //識别身份證背面資訊
36           wx.cloud.callFunction({
37             name:"identify",
38             data:{
39               imgUrl:res.fileList[0].tempFileURL,   //傳遞參數給雲函數
40               action:"5"       //action為1表示身份證，2表示銀行卡，3表示駕駛證，4表示行駛證，5表示營業執照，6表示通用印刷體（在雲函數中自定義的）
41             }
42           }).then(res=>{
43             console.log("圖檔識别成功",res);
44             this.setData({
45               BusinessLicenseMsg:res.result,
46               showdBusinessLicense:true
47             })  
48           }).catch(err=>{
49             console.log("圖檔識别失敗",err);
50           })
51         }).catch(err=>{
52           console.log("擷取圖檔真實連結失敗",err);
53         })   
54       }).catch(err=>{
55         console.log("圖檔上傳到雲存儲失敗",err);
56       })
57   
58     }).catch(err=>{
59       console.log("圖檔選擇失敗",err);
60     }) 
61     }
62   })      

三、效果展示