玩了一我的臉識別登陸

最近溫差大，請別感冒

前言

這篇文章就沒有目錄了，直接從頭正序開始便可。

由於忽然接到了一個需求，一個xx局，內部使用的移動端項目（是咱們開發的），須要添加一我的臉識別登陸的需求。

內部員工使用的識別登陸，只需也只能作平面的圖像識別。因此，針對內部使用的一些權限沒那麼高的平臺。這麼開發我的臉識別，客戶需增添一些科技感，作平面人臉識別是沒什麼問題的。

由於項目中有圖像識別的業務，因此，人相對比的算法放在了後臺。後來調研，tracking也能夠作到圖像比對，可是真實業務中圖像庫不能夠放在本地，因此此階段邏輯只能放在後臺。

我這邊作了一下技術調研，作了一個Demo，在此記錄一下。Demo地址放在了文章結尾。單純跟你們分享一下這個小東西，別指着前端能作3D識別。

開發

一、找個架子

我這邊直接用的dva-cli,十分方便，反正我寫demo都直接拉的這個架子。感謝做者。

二、插件tracking.js

tracking.js庫將不一樣的計算機視覺算法和技術引入瀏覽器環境。經過使用現代HTML5規範，咱們使您可以進行實時顏色跟蹤、人臉檢測以及更多——全部這些都是經過一個輕量級的核心（約7kb）和直觀的界面實現的。

傳送門tracking.js

三、插件face-api.js

基於tracking.js的瀏覽器端人臉識別的插件，提供了一些api

四、調用

直接導入，stats.min.js是face-min

五、設計結構

這裏確認一下需求流程。

• 一、調用攝像頭
• 二、檢測攝像頭中有無人臉
• 三、若是有人臉，同步畫到canvas層
• 四、導出base64
• 五、發送給數據庫進行比對。(這部分後臺同窗作，固然前端也能夠本地作，但沒什麼必要)
• 六、返回比對分數，是否符合登陸節點。

六、HTML結構

核心就是，須要一個video標籤顯示攝像頭內容，一個canvas畫布抓取圖像。（HTML並不徹底，只是展現核心）

七、引入聲明

八、效果

九、聯調

這個我就很少說了，剩下的就是業務階段，拿到了圖片，發送給服務器，服務器比對事後返回給你登陸結果或者一個類似度分數，這樣咱們就能夠判斷是否能夠登陸。

十、GitHub地址

傳送門: face-web

END

簡單的記錄一下一種實現方式，也算投石問路，你們能夠一塊兒交流一下。

最近又出差了，仍是很忙，簡單的沉澱一下文章。謝謝各位。

準備更正錯誤

文章編寫了兩天以後，首先感謝一下各位的指正，很是感謝@Yoha AI·前端給我指出了文章的錯誤和不少不足，接下來我打算深刻理解人臉識別原理，並更正此篇文章的錯誤。但願你們諒解。