合同小程序前端代码仓库
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

151 lines
3.3 KiB

<template>
<view class="idCard-box">
<view class="positive">
<image :src="upLoadPositiveImg == ''?positiveImg:upLoadPositiveImg" @tap.prevent="uploadPositive">
</image>
</view>
<view class="reverse">
<image :src="upLoadReverseImg == ''?reverseImg:upLoadReverseImg" @tap.prevent="uploadReverse">
</image>
</view>
</view>
</template>
<script>
export default {
data() {
return {
// 正面身份证
positiveImg: '',//自己图片路径
upLoadPositiveImg: '',
// 反面身份证
reverseImg: '', //自己图片路径
upLoadReverseImg: '',
baidu_token:' '//百度token
}
},
onLoad() {
// this.getACSS_TOKEN()
},
methods: {
// file文件转base64
getImageBase64(blob) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(blob);
reader.onload = () => {
const base64 = reader.result;
resolve(base64);
}
reader.onerror = error => reject(error);
});
},
// 身份证正面上传
uploadPositive() {
uni.chooseImage({
count: 1,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success: (res) => {
this.upLoadPositiveImg = res.tempFilePaths[0]
this.getImageBase64(res.tempFiles[0]).then(res => {
this.uploadIdentify(res)
})
}
})
},
// 身份证反面上传
uploadReverse() {
uni.chooseImage({
count: 1,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success: (res) => {
this.upLoadReverseImg = res.tempFilePaths[0]
this.getImageBase64(res.tempFiles[0]).then(res => {
this.uploadIdentify(res)
})
}
})
},
// 获取百度token
getACSS_TOKEN() {
let that = this
uni.request({
// url: '/baiduApi/oauth/2.0/token',
url: 'https://aip.baidubce.com/oauth/2.0/token',
method: 'POST',
data: {
grant_type: 'client_credentials',
client_id: '你的',
client_secret: '你的',
},
header: {
'Content-Type': 'application/x-www-form-urlencoded'
},
success: res => {
this.baidu_token = res.data.access_token
}
});
},
// 上传识别
uploadIdentify(res) {
uni.request({
url: '/baiduApi/rest/2.0/ocr/v1/idcard?access_token=' + this.baidu_token,
method: 'POST',
data: {
image: res,
id_card_side: 'back' // 身份证 正反面 front:身份证含照片的一面 back:身份证带国徽的一面
},
header: {
'Content-Type': 'application/x-www-form-urlencoded'
},
success: res => {
console.log(res.data)
}
})
},
}
}
</script>
<style lang="scss" scoped>
.idCard-box {
margin-top: 100px;
width: 100%;
height: 100%;
display: flex;
flex-direction: row;
background-color: #fff;
.positive {
flex: 1;
height: 30%;
width: 30%;
display: flex;
align-items: center;
justify-content: center;
background-color: red;
image {
width: 80%;
height: 100%;
}
}
.reverse {
flex: 1;
height: 30%;
width: 30%;
display: flex;
align-items: center;
justify-content: center;
background-color: blue;
image {
width: 80%;
height: 100%;
}
}
}
</style>