2. 进入开发者平台,创建OCR文字识别应用
- 在AI能力服务类目中选择“OCR文字识别”,进入文字识别产品的应用页。
- 点击“立即使用”,进入OCR文字识别应用创建页。
3. 获取AppID和AK
- 输入应用名称,选择应用类型为“公开应用”或“私有应用”,填写验证码后点击“创建应用”。
- 应用创建成功把对应的client_id和client_secret保存好添加到项目里
图片转base64(兼容APP、H5、小程序)
新建一个js文件导出toBase64函数
将图片文件路径转为base64格式
/\*\*
\* @description 本地图片转base64方法(兼容APP、H5、小程序)
\* @param {number} path 图片本地路径
\* @returns Promise对象
\*/
const toBase64 = (path) => {
return new Promise((resolve, reject) => {
// #ifdef APP-PLUS
plus.io.resolveLocalFileSystemURL(path, (entry) => {
entry.file((file) => {
let fileReader = new plus.io.FileReader()
fileReader.readAsDataURL(file)
fileReader.onloadend = (evt) => {
let base64 = evt.target.result.split(",")[1]
resolve(base64)
}
})
})
// #endif
// #ifdef H5
uni.request({
url: path,
responseType: 'arraybuffer',
success: (res) => {
resolve(uni.arrayBufferToBase64(res.data))
}
})
// #endif
// #ifdef MP-WEIXIN
uni.getFileSystemManager().readFile({
filePath: path,
encoding: 'base64',
success: (res) => {
resolve(res.data)
}
})
// #endif
})
}
export {
toBase64
}
具体代码
1. 在data里声明申请好的秘钥
data() {
return {
dataObj: {
client\_id: '填你自己的',
client\_secret: '填你自己的',
}
}
},
2. 声明接受参数dataType,用于判断需要识别的类型
props: {
dataType: {
type: String,
default: 'idcard',
}
},
3. 选择本地图片
使用uni.chooseImage()选择需要识别的图片:
// 选择本地图片
chooseImage() {
let self = this
uni.chooseImage({
count: 1,
success: (ress) => {
uni.showLoading({
title: '正在识别中...'
})
// 下面将图片本地路径转base64
convert.toBase64(ress.tempFilePaths[0]).then((res) => {
self.getAccessToken(res, ress)
})
},
fail(err) {
uni.hideLoading()
console.log(err)
}
})
},
4. 获取AccessToken
调用相应的识别接口
根据需要识别的卡证类型,调用不同的OCR识别接口,传入图片base64和token进行识别:
请求百度AI开放平台的token接口,获取后续接口的访问凭证:
getAccessToken(path, ress) {
let self = this
uni.request({
url: 'https://aip.baidubce.com/oauth/2.0/token',
data: {
grant\_type: 'client\_credentials',
client\_id: self.dataObj.client_id,
client\_secret: self.dataObj.client_secret
},
method: 'POST',
header: {
'Content-Type': 'application/x-www-form-urlencoded'
},
success: (res) => {
if (self.dataType == 'idcard') {
self.uploadImage(path, res.data.access_token, ress)
} else {
self.uploadlicense(path, res.data.access_token, ress)
}
uni.hideLoading()
},
fail(err) {
uni.hideLoading()
console.log(err)
}
})
},
5.通用文字识别(高精度版)
uploadImage(path, token) {
uni.request({
url: 'https://aip.baidubce.com/rest/2.0/ocr/v1/accurate\_basic',
data: {
image: path,
access\_token: token
},
method: 'POST',
header: {
'Content-Type': 'application/x-www-form-urlencoded'
},
success: (res) => {
this.$emit('end', {
animal: false,
words: res.data.words_result
})
}
})
},
6. 身份证识别:
正反面都可以使用这个,请求返回内容不一样。
最后
中年危机是真实存在的,即便有技术傍身,还是难免对自己的生存能力产生质疑和焦虑,这些年职业发展,一直在寻求消除焦虑的依靠。
-
技术要深入到什么程度?
-
做久了技术总要转型管理?
-
我能做什么,我想做什么?
-
一技之长,就是深耕你的专业技能,你的专业技术。(重点)
-
独立做事,当你的一技之长达到一定深度的时候,需要开始思考如何独立做事。(创业)
-
拥有事业,选择一份使命,带领团队实现它。(创业)
一技之长分五个层次
-
栈内技术 - 是指你的前端专业领域技术
-
栈外技术 - 是指栈内技术的上下游,领域外的相关专业知识
-
工程经验 - 是建设专业技术体系的“解决方案”
-
带人做事 - 是对团队协作能力的要求
-
业界发声 - 工作经验总结对外分享,与他人交流
永远不要放弃一技之长,它值得你长期
信仰持有
。
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
主要内容包括html,css,html5,css3,JavaScript,正则表达式,函数,BOM,DOM,jQuery,AJAX,vue 等等。