Uni develops wechat applet to customize automatic camera detection (portrait + ID card)

Previously, I developed a wechat applet to take photos with a custom camera to detect portraits and ID cards . I have been looking forward to writing an article to record , Take advantage of the time , To sum up .

Demand point ：

1、 Be able to shoot portraits on your own

2、 It can automatically take the front photo of the ID card

3、 Identify your ID card and compare it with your face （ This function depends on the business logic of the company , Not open for the time being ）

Lead to ：

1、 Use baidu ai Face detection function , So you need to register an application on Baidu open platform ( Select face detection )

2、 Camera function uni.createCameraContext() and takePhoto()

3、 Picture compression uni.compressImage

4、 Get system files uni.getFileSystemManager().readFile

In particular ：

Baidu face detection obtains token

getAccessToken(){
				console.log(323232)
				let that = this;
				//  Each update access_token
				let baiduApiData = that.baiduApiData;
				uni.request({
					url: "https://aip.baidubce.com/oauth/2.0/token?grant_type=client_credentials&client_id="+baiduApiData.apikey+"&client_secret="+baiduApiData.SecretKey,
					method: 'POST',
					dataType: "json",
					header: {
						'content-type': 'application/json'
					},
					success: function(res) {
						console.log(res,"-----")
						that.access_token = res.data.access_token;
						// Get token And then began to test the portrait 
						setTimeout(()=>{
							that.initBaiDuApiFunction()
						},1000)
					},fail(err) {
						console.log(err)
					}
				})
			},

Detect face data

uni.request({
										url: "https://aip.baidubce.com/rest/2.0/face/v3/detect?access_token=" + that.access_token,
										data: {// Please view the specific parameters automatically api
											image: rr.data,
											image_type: "BASE64",
											max_face_num: 1,
											face_field: 'quality',
										},
										method: 'POST',
										dataType: "json",
										header: {
											'content-type': 'application/json'
										},
										success: function(res) {
											console.log(5555)
											console.log(res)
											if (res.data.error_code === 0) { // When a face is detected, start taking photos 
												let faceList = res.data.result.face_list[0];
												let face_probability = faceList.face_probability > 0.6; // Face confidence 
												let quality = faceList.quality; // Face quality 
												let blur = quality.blur < 0.5; // Face blur  0-1 0 Clear  1 Fuzzy 
												// let illumination = quality.illumination > 100; // Facial illumination   Not for the time being 
												// left_eye : 0.6, # The threshold of occlusion of the left eye 
												// right_eye : 0.6, # Right eye occlusion threshold 
												// nose : 0.7, # The threshold at which the nose is obscured 
												// mouth : 0.7, # The threshold of mouth occlusion 
												// left_cheek : 0.8, # The threshold of occlusion of the left cheek 
												// right_cheek : 0.8, # The threshold of occlusion of the right cheek 
												// chin_contour : 0.6, # Jaw occlusion threshold 
												let  occlusion =quality.occlusion;// Occlusion 
												let location = faceList.location;// Avatar location information 
												let top = location.top;
												let left = location.left;
												
												let completeness = quality.completeness == 1; // Face integrity 
											
												if (face_probability && blur && completeness) {// Get a clear face and start identity detection 
													that.baseImage = 'data:image/png;base64,'+rr.data// Pictures obtained base64
													uni.showToast({
														title:" Get photos successfully "
													})
													that.$emit('changeDataReturn',{
														baseImage:rr.data,// Needed base64 picture 
														allImage:that.baseImage ,// Full link base64 picture 
													})
												}else{// Or start taking pictures again 
													setTimeout(()=>{
														that.initBaiDuApiFunction()
													},1000)
												}
												
											} else {// If no face is detected, start taking photos again 
												setTimeout(()=>{
													that.initBaiDuApiFunction()
												},1000)
											}
										},
										fail:()=>{
											// Call failed , Turn on manual reacquire 
											that.reloadByHand = true;
										}
									})

design sketch ：

 

  The specific code is encapsulated as uni-app plug-in unit , The plug-in address is ：

Wechat applet customization orc Check the portrait （ww-orc-idcard） - DCloud Plug in market Automatically detect portraits or ID photos https://ext.dcloud.net.cn/plugin?id=8070

Arrange a wave of benefits ：