SpringBoot實(shí)現(xiàn)人臉識(shí)別功能
來(lái)源:blog.csdn.net/lw1124052197/article/details/106077837/
1
去年在公司參與了一個(gè)某某機(jī)場(chǎng)建設(shè)智能機(jī)場(chǎng)的一個(gè)項(xiàng)目,人臉登機(jī)是其中的一個(gè)功能模塊,當(dāng)時(shí)只是寫(xiě)了后臺(tái)的接口,調(diào)用人臉識(shí)別設(shè)備的api,給閘機(jī)回傳數(shù)據(jù)信號(hào),以保障該功能的正常使用。當(dāng)時(shí)因?yàn)轫?xiàng)目進(jìn)度緊張,手里還有其他項(xiàng)目趕進(jìn)度,也就沒(méi)時(shí)間去分享這個(gè)功能的實(shí)現(xiàn)。前幾天刷臉進(jìn)公司大樓的時(shí)候,突然想起來(lái)應(yīng)該寫(xiě)一個(gè)功能類(lèi)似的demo分享個(gè)人的一些小小的經(jīng)驗(yàn)。在當(dāng)時(shí)項(xiàng)目中刷臉的設(shè)備終端是采購(gòu)某某AI公司,當(dāng)然咱們?cè)赿emo里面也不可能買(mǎi)一臺(tái)那東西來(lái)瞎搞,于是乎就拿系統(tǒng)刷臉登錄來(lái)練練手,人臉識(shí)別解決方案就用百度云的吧,當(dāng)然騰訊、阿里這方面也很牛逼的。
?
2
一、人臉注冊(cè)
step1:人像采集。在注冊(cè)頁(yè)面上用html中video組件和js調(diào)用筆記本攝像頭,并抓取人像圖片。沒(méi)有攝像頭的筆記本、臺(tái)式機(jī)的童鞋告辭吧,走好不送。。。
step2:人像上傳至項(xiàng)目文件夾。將在頁(yè)面采集到的人像數(shù)據(jù)轉(zhuǎn)換成bash64字符傳輸?shù)絯eb后臺(tái),在后臺(tái)將bash64轉(zhuǎn)換成圖片上傳至項(xiàng)目文件夾。
step3:將用戶(hù)的注冊(cè)信息寫(xiě)入數(shù)據(jù)庫(kù),用戶(hù)的照片使用路徑存儲(chǔ)。
step4:將采集到的人像信息(bash64)上傳至百度云的人臉識(shí)別云端服務(wù)器。ps這塊實(shí)現(xiàn)也可離線(xiàn)私有化處理方案,有興趣的童鞋可自行研究。
二、人臉登錄
step1:人像采集。在登錄頁(yè)面上用html中video組件和js調(diào)用筆記本攝像頭,并抓取人像圖片。
step2:人像數(shù)據(jù)傳輸。抓取的人臉圖片信息回傳至web后臺(tái)。
step3:人像比對(duì)。在web后臺(tái)實(shí)例化并調(diào)用百度云人臉識(shí)別的sdk,將登錄頁(yè)面采集到的圖像數(shù)據(jù)和注冊(cè)的圖像信息相比對(duì)(這塊是百度云人臉識(shí)別解決方案實(shí)現(xiàn)的,也是最牛B的地方),返回的比分大于95分即可實(shí)現(xiàn)登錄。
?
3
好了,前言和需求分析也嗶嗶了這么久了,接下來(lái)是實(shí)現(xiàn)和上代碼了。
一、人臉注冊(cè)
前端頁(yè)面代碼
<html>
<head>
<meta?charset="UTF-8">
<title>Insert title heretitle>
??<style?type="text/css">
?????/**解決瀏覽器兼容性問(wèn)題**/
????*{margin:?0;padding:?0;}
????html,body{width:?100%;height:?100%;}/**/
????body{background:?url(img/bg03.jpg) no-repeat center;}
????h1{color:?#fff;text-align: center;line-height:?80px;}
????.media{width:?534px;height:?400px;margin:?40px?auto?0;
????????}
????#register{width:?200px;height:50px;background-color:?#2196f3;?margin:?60px?auto?0;
????text-align: center;line-height:?50px;color:?#fff;border-radius:?10px;}
????#canvas{display: none;}
????#shuru{width:?200px;height:50px;background-color:?#2196f3;?margin:?20px?auto?0;}
??style>
head>
<body>
??<h1>百度云人臉注冊(cè)h1>
??<div?id="shuru">
??用戶(hù)名:
??<input?type="text"?name="username"?id="username"/>
??div>
??
??<div?class="media">
????<video?id="video"?width="450"?height="300"?src=""?autoplay>video>
????<canvas?id="canvas"?width="450"?height="300">canvas>
????
??div>
??<button?id="register"?>確定注冊(cè)button>
??<script?type="text/javascript"?src="js/jquery-3.3.1.js">script>
??<script?type="text/javascript">
??/**調(diào)用攝像頭,獲取媒體視頻流**/
??var?video =?document.getElementById('video');
??//返回畫(huà)布二維畫(huà)圖環(huán)境
??var?userContext = canvas.getContext("2d");
??var?getUserMedia =
????//瀏覽器兼容,表示在火狐、Google、IE等瀏覽器都可正常支持
????(navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia)
????//getUserMedia.call(要調(diào)用的對(duì)象,約束條件,調(diào)用成功的函數(shù),調(diào)用失敗的函數(shù))
????getUserMedia.call(navigator,{video:?true,audio:?false},function(localMediaStream){
??????//獲取攝像頭捕捉的視頻流
??????video.srcObject=localMediaStream;
????},function(e){
??????console.log("獲取攝像頭失敗!!")
????});
??//點(diǎn)擊按鈕注冊(cè)事件
???var?btn =?document.getElementById("register");
??
??btn.onclick =?function?()?{
????var?username = $("#username").val();
????alert($("#username").val());
??????if(username !=?null){
????????//點(diǎn)擊按鈕時(shí)拿到登陸者面部信息
???????????????userContext.drawImage(video,0,0,450,300);
???????????????var?userImgSrc =?document.getElementById("canvas").toDataURL("img/png");
???????????????//拿到bash64格式的照片信息
???????????????var?faceBase = userImgSrc.split(",")[1];
???????????????
???????????????//ajax異步請(qǐng)求
???????????????$.ajax({
?????????????????url:?"register",
?????????????????type:?"post",
?????????????????data: {"faceBase": faceBase,
???????????????????"userName": username
?????????????????},
?????????????????success:?function(result){
???????????????????if(result ===?'1'){
?????????????????????alert("注冊(cè)成功!!,點(diǎn)擊確認(rèn)跳轉(zhuǎn)至登錄頁(yè)面");
?????????????????????window.location.href="toLogin";
???????????????????}else?if(result ===?'2'){
?????????????????????alert("您已經(jīng)注冊(cè)過(guò)啦!!");
???????????????????}else{
?????????????????????alert("系統(tǒng)錯(cuò)誤!!");
???????????????????}
???????????????????
?????????????????}
???????????????})
??????}else{
????????alert("用戶(hù)名不能為空");
??????}
???????}
??script>
body>
html>頁(yè)面截圖,本人太帥,先行打碼,嘿嘿

后臺(tái)具體代碼如下:
private?static?final?String?APP_ID =?"****";
private?static?final?String?API_KEY =?"*******";
private?static?final?String?SECRET_KEY =?"*******";
??
@Autowired
private?IUserService userService;
??
??
??@RequestMapping(value =?"register",method = RequestMethod.POST)
??public?String?register(String?userName,String?faceBase) throws IOException {
????if(!StringUtils.isEmpty(userName) && !StringUtils.isEmpty(faceBase)) {
???????//文件上傳的地址
??????????String?upPath = ResourceUtils.getURL("classpath:").getPath()+"static\\photo";
??????????//用于查看路徑是否正確
??????????System.out.println(upPath);
??????????// 圖片名稱(chēng)
??????????String?fileName = userName+System.currentTimeMillis() +?".png";
??????????System.out.println(upPath+"\\"+fileName);
??????????File file =?new?File(upPath+"\\"+fileName);
??????//初始化百度云的AipFace
??????AipFace client =?new?AipFace(APP_ID, API_KEY, SECRET_KEY);
??????
??????//往自己demo數(shù)據(jù)庫(kù)里插入一條用戶(hù)數(shù)據(jù)
??????Users user =?new?Users();
??????user.setUserName(userName);
??????user.setUserPhoto(upPath+"\\"+fileName);
??????Users exitUser = userService.selectUserByName(user);
??????if(exitUser !=?null) {
????????return?"2";
??????}
??????userService.addUsers(user);
??????
??????
??????// 往自己demo服務(wù)器里面上傳攝像頭捕獲的圖片
??????GenerateImage(faceBase, file);
??????//向百度云人臉庫(kù)插入一張人臉
??????facesetAddUser(client,faceBase,userName);
????}
????return?"1";
????
??}APP_ID 、API_KEY、SECRET_KEY三個(gè)參數(shù)分別為百度云人臉識(shí)別上面的三個(gè)數(shù)據(jù)項(xiàng),如下圖


點(diǎn)擊完注冊(cè)按鈕后,就會(huì)發(fā)現(xiàn)。。。



到這就算一個(gè)用戶(hù)注冊(cè)成功了,個(gè)人這張大帥臉也算是錄進(jìn)去了,下面就是刷臉登錄了。
二、刷臉登錄
當(dāng)我注冊(cè)完周后就會(huì)進(jìn)入登錄頁(yè)面

這時(shí)我點(diǎn)擊登錄按鈕,js觸發(fā)后臺(tái)方法,具體入下:
@RequestMapping(value =?"login",method = RequestMethod.POST)
??public?String?login(String?faceBase) {
????String?faceData = faceBase;
????//進(jìn)行人像數(shù)據(jù)對(duì)比
????AipFace client =?new?AipFace(APP_ID,API_KEY,SECRET_KEY);
????Double num = verifyUser(faceData,client);
????if(num>95) {
??????return?"1";
????}else?{
??????return?"2";
????}
????
??}
??
??/**
???* 人臉比對(duì)
???* @param imgBash64 照片轉(zhuǎn)bash64格式
???* @param imgType 類(lèi)型
???* @param groupList 百度云人臉識(shí)別用戶(hù)組
???* @return
???*/
??public?Double verifyUser(String?imgBash64,AipFace client) {
????// 傳入可選參數(shù)調(diào)用接口
??????HashMap<String,?String> options =?new?HashMap<String,?String>();
??????
??????JSONObject res = client.search(imgBash64,?"BASE64",?"user_01", options);
??????
??????System.out.println(res.toString(2));
??????System.out.println(res.getJSONObject("result"));
??????System.out.println(res.getJSONObject("result").getJSONArray("user_list"));
??????JSONObject user = (JSONObject) res.getJSONObject("result").getJSONArray("user_list").get(0);
??????Double score = (Double) user.get("score");
??????
????return?score;
??}接著我正面面對(duì)攝像頭,點(diǎn)擊登錄按鈕,就進(jìn)入了一個(gè)大大的success頁(yè)面
我側(cè)臉或者拿照片試一下,不好意思,您老只能是404了
以上就是整個(gè)實(shí)現(xiàn)的思路和一些步驟了,demo涉及的類(lèi)和頁(yè)面比較多,不方便一一截圖,隨后我把資源上傳到本站。如有需要可自行下載。
綜合而言實(shí)現(xiàn)還是比較簡(jiǎn)單的,牛逼的地方都在人家百度云那邊呢,咱們只是根據(jù)需求合理利用人家的解決方案罷了。其實(shí)如果不是很牛逼的專(zhuān)項(xiàng)技術(shù)研發(fā)公司,做項(xiàng)目能合理利用別人的產(chǎn)品是最有效率的,項(xiàng)目建設(shè)最重要的還是投入產(chǎn)出比嘛。與其自己團(tuán)隊(duì)苦苦研究,花點(diǎn)成本買(mǎi)人家的成品直接用它不香嗎?
