一,获取token
注册baidu AL云账号,登录选择图像识别,创建应用
拿到API Key 和Secret Key,请求百度获取Token接口
fetchToken: async function() {
let vm = this;
let params = {
grant_type:'client_credentials',
client_id:'Dt79Wwpqd4GmqPVZ9NmdkXYo',
client_secret:'VPyB2M7RdptgDkkjjP4dL6BbXwUB2qPa'
};
const res = await vm.http.get('/oauth/2.0/token', params);
if(!res){
return
}
let result = res.data;
vm.token = result.access_token;
},
ps:,如果是vue应用,一定要配置代理,调用接口的url去掉域名前缀,域名的配置写到`vue.config.js`文件里面
'/oauth/*': {
target: 'https://aip.baidubce.com/',
changeOrigin: true,
secure: false
},
二,身份证信息识别
<input type="file" id="file" class="filepath" @change="changepic" accept="image/*"><br>
通过file
标签上传/拍照图片,change
事件里面拿到base64
文件流,再调用身份识别接口
changepic() {
let vm = this;
let reads = new FileReader();
let f = document.getElementById('file').files[0];
reads.readAsDataURL(f);
reads.onload = function (e) {
vm.image = this.result;
vm.spinShow = true;
vm.fetchInfo();
};
},
/**
* 识别图片信息
*/
fetchInfo() {
let vm = this;
$.ajax({
type: "POST",
url: "/rest/2.0/ocr/v1/idcard",
data: {
access_token:vm.token,
image:vm.image.replace("data:image/jpeg;base64,",""),
id_card_side:'front'
},
dataType: "json",
beforeSend: function(request) {
request.setRequestHeader("Content-Type", 'application/x-www-form-urlencoded');
},
success: function(data){
vm.spinShow = false;
console.log(data.words_result);
vm.result = data.words_result;
},
error: function(data){
vm.spinShow = false;
}
});
},
这样就可以拿到身份证文字信息
三,图像文字信息识别
先上传,后识别,调用识别接口
fetchInfo1() {
let vm = this;
$.ajax({
type: "POST",
url: "/rest/2.0/ocr/v1/webimage",
data: {
access_token:vm.token,
image:vm.image1.replace("data:image/jpeg;base64,",""),
},
dataType: "json",
beforeSend: function(request) {
request.setRequestHeader("Content-Type", 'application/x-www-form-urlencoded');
},
success: function(data){
console.log(data);
vm.spinShow = false;
console.log(data.words_result);
vm.result1 = data.words_result;
},
error: function(data){
vm.spinShow = false;
}
});
}