最近項目中客戶需要實現身份證識別功能,合理計划了之後決定使用百度ai的身份證識別。 身份證識別是文字識別的一種,類似的功能有很多比如駕駛證識別等等,原理都是相同的。 對於前端初學者來說,如果要實現這種功能靠頁面,js是實現不了的,可以確定地說就是讓後臺配合實現。實現過程是上傳一張圖片給後臺,後臺使用 ...
最近項目中客戶需要實現身份證識別功能,合理計划了之後決定使用百度ai的身份證識別。
身份證識別是文字識別的一種,類似的功能有很多比如駕駛證識別等等,原理都是相同的。
對於前端初學者來說,如果要實現這種功能靠頁面,js是實現不了的,可以確定地說就是讓後臺配合實現。實現過程是上傳一張圖片給後臺,後臺使用java,php等服務端語言來調取百度ai的sdk,獲取到的參數再返回到前臺頁面來展示。這個介面的調用必須是服務端的,前端如果想實現,只能通過node.js來實現。
那麼下麵就具體說明一下整個流程:
1.node
首先需要對node進行下載安裝,node的安裝教程在官網或者菜鳥教程中有明確的實例。
安裝之後,在cmd命令行中輸入 node -v,如果返回版本號,證明安裝成功。
同樣在命令行中輸入 npm -v,可以查看cmd版本,現在node集成cmd,如果照著教程來安裝,node成功npm應該是成功的。
2.項目搭建
先找到項目根目錄或者新建一個文件夾作為根目錄
安裝百度的組件有兩種方式,一種是通過去百度ai下載baidu-aip-SDK,另一種是通過命令行直接安裝baidu-aip-SDK的包,這裡一切從簡,通過命令行安裝:
在該目錄下運行cmd命令行,如果對命令行操作不是太好的童鞋,可以在當前文件夾 Shift+右鍵 右鍵菜單中就會增加在此處打開命令視窗的選項
輸入 npm install baidu-aip-sdk
等候安裝完成之後目錄中會新增這樣的一個文件夾和一個.json格式文件
可以打開node_modules文件夾中,確認是否有baidu-aip-sdk文件夾
這樣的話,功能就算是搭建好了。
3.功能代碼
新建一個js文件在根目錄下,如圖
這個js就是圖像識別的node客戶端,用來提供一系列交互方法的地方。
在js中加入如下代碼:
var AipOcrClient = require("baidu-aip-sdk").ocr; // 設置APPID/AK/SK var APP_ID = "你的 App ID"; var API_KEY = "你的 Api Key"; var SECRET_KEY = "你的 Secret Key"; // 新建一個對象,建議只保存一個對象調用服務介面 var client = new AipOcrClient(APP_ID, API_KEY, SECRET_KEY);
這裡的APP ID / Api Key / Secret Key 需要在百度雲管理中心去申請 https://cloud.baidu.com/
之後在這個js中繼續添加功能代碼,我們現在在做的是身份證識別,那麼就去將身份證識別的相關代碼拷入js中。
var fs = require('fs'); var image = fs.readFileSync("你的身份證路徑").toString("base64"); var idCardSide = "front"; // 調用身份證識別 client.idcard(image, idCardSide).then(function(result) { console.log(JSON.stringify(result)); }).catch(function(err) { // 如果發生網路錯誤 console.log(err); });
將你需要識別的身份證圖片放到根目錄中,如圖
將js中的身份證路徑改成圖片路徑 ,例如
var image = fs.readFileSync("./png1.png").toString("base64");
4.調用
在根目錄打開命令行,輸入 node start.js
稍等個幾秒鐘,在命令行中就會返回身份證圖片中的各項參數。
好啦,這裡只是提供了node調用百度ai,身份證識別的一種思路,在項目實現過程中,如果整個項目並沒有使用到node,就交給後端人員實現這個功能,就算用了node,推薦也讓後臺人員實現...畢竟前端大佬們的時間可是很寶貴的。
百度ai 的功能很強大,基本涵蓋了現在市面上所有需求的技術,身份證識別甚至文字識別隻是其中一丟丟的小部分,識別功能的原理都是相同的,在熟悉node的前提下,多看看api sdk文檔,都能寫出來。
以上純屬個人見解與經驗,不喜勿噴,謝謝!