Cordova使用百度OCR插件實現圖像識別

1. 下載aip.license文件

1.1 註冊登錄百度智能雲

網址: https://login.bce.baidu.com/ 
有賬戶直接登錄 沒有的話註冊一個再登錄
登錄後 左側菜單 >點開 查看所有服務 找到其中的圖像識別
這個佈局是不一定的 以後說不定會變 但是意思是一樣的 找到圖像識別即可

1.2 進入圖像識別 應用列表的頁面

1.2.1  點擊創建應用
1.2.2  填寫信息
	   應用名稱:隨意 不重複就好
	   應用類型:也隨意 看自己應用的類型選就好了
	   文字識別包名:就是cordova中config.xml中widget裏的id 複製粘貼即可
	   應用描述:隨便描述一下就好了
	   接口選擇: 根據自己的需求進行選擇  如:

1.2.3 點擊立即創建 即可創建成功

1.3 進入應用詳情頁面

點擊應用名或者管理進入應用詳情頁面

點擊下載aip.license按鈕進行下載

2. 配置Cordova

2.1 將aip.license移動到Cordova項目中

// 比較推薦第一種方式 比較簡單 
安卓：將 aip.license 放到 app/src/main/assets 目錄下
ios：將 aip.license 放到項目根目錄下

// 或

// src爲 aip.license原本存儲的位置 即從項目根目錄出發 找到aip.license文件 將aip.license放到根目錄比較好找
// target爲需要將aip.license複製到哪去 target不要改 
// 安卓和ios的位置是不一樣的
<platform name="android">
    // 這是aip.license放在根目錄的情況
	<resource-file src="aip.license" target="app/src/main/assets/aip.license" />
</platform>
<platform name="ios">
    // 這是aip.license放在根目錄的情況
	<resource-file src="aip.license" target="aip.license" />
</platform>

2.2 安裝 cordova-baidu-ocr 插件

cordova plugin add cordova-baidu-ocr

3. 編寫代碼

3.1 HTML部分

<button id="scanner">識別圖像</button>

3.2 JS部分

document.addEventListener('deviceReady',function(){
	// 初始化
	// 初始化完成之後纔可以識別 執行的是識別成功的回調函數
    // 初始化完成之前不可以識別 執行的是識別失敗的回調函數
    // 也就是說 等彈出初始化完成之後點 也可以將識別的方法寫在初始化成功的回調函數中
     BaiduOcr.init(
         ()=>{
             console.log('初始化完成');
         },
         (error)=>{
             console.log('初始化失敗')
         })
    // 識別身份證
    document.getElementById('scanner').onclick=function(){
    	// 接收三個參數(配置參數對象{},成功回調函數,失敗回調函數)
        BaiduOcr.scanId(
            {
            	// IDCardFront識別正面  IDCardBack識別背面
                contentType:"IDCardFront",
                // nativeEnable和nativeEnableManual 默認是true讀取本地圖片
                // 這裏改成false 即 使用相機拍攝圖片
                nativeEnable:false,
                nativeEnableManual:false
            },
            (result)=>{
            	// result爲識別的結果
                alert(JSON.stringify(result));
            },
            (error)=>{
                console.log(error)
            });
    }
})

3.3 識別其他圖像的方法

// 識別銀行卡
BaiduOcr.scanBankCard({}, (result)=>{
        console.log(JSON.stringify(result));
    },
    (error)=>{
        console.log(JSON.stringify(error));
    });
// 這裏是安卓和蘋果都支持的方法
// 用法都是一致的 BaiduOcr.xxx({},successCallback,failCallback) 舉一反三即可 
// 這裏就羅列一下方法名即可
// scanVehicleLicense(識別行駛證)   scanDrivingLicense(識別駕駛證)
// scanLicensePlate(識別車牌)       scanBusinessLicense(識別營業執照)
// scanReceipt(識別通用票據)   

// 安卓額外支持的方法
// scanPassport(護照)
// scanNumbers(數字)
// scanQrCode(二維碼)
// scanBusinessCard(名片)
// scanHandWriting(手寫)
// scanLottery(彩票)
// scanVatInvoice(增值稅發票)      

3.4 可在使用完之後進行銷燬 別還沒用完就銷燬了

// 銷燬本地控制模型
BaiduOcr.destroy(
        ()=>{
            console.log('銷燬成功');
        },
        (error)=>{
            console.log(error)
        });

4. 運行

4.1 cordova build android

先構建一下項目

4.2 cordova run android

構建完運行項目

總結:這個官方寫的不是很詳細 基本一筆帶過 在學習的過程中踩了好多坑 寫個筆記留個紀念 說不定哪天就用上了 踩坑不易 覺得有所幫助 可以點個讚唄