Previously developed a WeChat applet to customize the camera to take pictures and detect portraits and ID cards. I have always hoped to write an article to record it, and now I have some time to summarize it.
Demand point:
1. Ability to customize portraits
2. Can automatically take a front photo of the ID card
3. Identify the ID card and compare it with the face photo to see if it is the person (this function is temporarily closed due to the company's business logic)
Pre-preparation:
1. Use Baidu AI face detection function, so you need to register an application on Baidu open platform (choose face detection)
2. Camera functions uni.createCameraContext() and takePhoto()
3. Image compression uni.compressImage
4. Get the system file uni.getFileSystemManager().readFile
Special Note:
Baidu face detection to obtain token
getAccessToken(){
console.log(323232)
let that = this;
// 每次更新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;
//获取到token后开始检测人像
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: {//具体参数请自动查看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) { //检测到人脸就开启拍照
let faceList = res.data.result.face_list[0];
let face_probability = faceList.face_probability > 0.6; //人脸置信度
let quality = faceList.quality; //人脸质量
let blur = quality.blur < 0.5; //人脸模糊度 0-1 0清晰 1模糊
// let illumination = quality.illumination > 100; //脸部光照度 暂时不用
// left_eye : 0.6, #左眼被遮挡的阈值
// right_eye : 0.6, #右眼被遮挡的阈值
// nose : 0.7, #鼻子被遮挡的阈值
// mouth : 0.7, #嘴巴被遮挡的阈值
// left_cheek : 0.8, #左脸颊被遮挡的阈值
// right_cheek : 0.8, #右脸颊被遮挡的阈值
// chin_contour : 0.6, #下巴被遮挡阈值
let occlusion =quality.occlusion;//遮挡情况
let location = faceList.location;//头像位置信息
let top = location.top;
let left = location.left;
let completeness = quality.completeness == 1; //人脸完整度
if (face_probability && blur && completeness) {//获取人脸较为清晰可以开始身份检测
that.baseImage = 'data:image/png;base64,'+rr.data//获取到的图片base64
uni.showToast({
title:"获取照片成功"
})
that.$emit('changeDataReturn',{
baseImage:rr.data,//需要的base64图片
allImage:that.baseImage ,//完整链路的base64图片
})
}else{//否则重新开始拍照
setTimeout(()=>{
that.initBaiDuApiFunction()
},1000)
}
} else {//没有检测到人脸也重新开始拍照
setTimeout(()=>{
that.initBaiDuApiFunction()
},1000)
}
},
fail:()=>{
//调用失败，开启手动重新获取
that.reloadByHand = true;
}
})Renderings:
The specific code is packaged as a uni-app plug-in, and the plug-in address is:
https://ext.dcloud.net.cn/plugin?id=8070Arrange a wave of benefits:
