spring boot2 基於百度雲apiface實現人臉檢測與認證1

時間 2019-11-19

標籤 spring boot2 boot 基於百度 apiface 實現檢測認證欄目 Spring 简体版

原文原文鏈接

原理介紹：css

基於百度雲的人臉資料庫(用戶上傳)，調用本地攝像頭抓拍的圖像，與百度雲的用戶圖像作比對，實現人臉認證。html

主要步驟以下：java

1. 建立百度去帳號jquery

2. 在百度雲控制檯中建立人臉識別的應用，並記錄app id ,api key, api sercet.web

3. 建立用戶組，建立用戶並上傳圖像。spring

4. 建立spring boot建立並使用themleaf模板，實現功能。json

主要邏輯：bootstrap

1. 在頁面中調用攝像頭canvas

2. 點擊登陸後，會抓拍一張圖片發送到服務端api

3. 服務端收到圖片後，對圖片進行處理，並設置參數，發給百度雲認證。

4. 收到服務端返回的結果，進行結果判斷。

主要代碼以下：

只有一個html頁面：

<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>人臉認證</title>
    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/twitter-bootstrap/4.2.1/js/bootstrap.min.js"></script>
    <link href="https://cdn.bootcss.com/twitter-bootstrap/4.2.1/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<video width="400" height="300"></video>

<!-- 圖像畫布 -->
<canvas width="200" height="150"></canvas>
<button id="" onclick="face_login()" class="btn btn-info"><i class="icon-play"></i>&nbsp;登陸</button>
<script>
    function $(elem){
        return document.querySelector(elem);
    }
    var canvas = $('canvas'),
        context = canvas.getContext('2d'),
        video = $('video'),
        snap = $('#snap'),
        upload = $('#upload'),
        uploaded = $('#uploaded'),
        mediaStreamTrack;
    //打開攝像頭
    if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
        navigator.mediaDevices.getUserMedia({
            video: true,
        }).then(function(stream) {
            mediaStreamTrack = typeof stream.stop === 'function' ? stream : stream.getTracks()[1];
            // 舊的瀏覽器可能沒有srcObject
            if ("srcObject" in video) {
                video.srcObject = stream;
            } else {
                // 防止再新的瀏覽器裏使用它，應爲它已經再也不支持了
                video.src = window.URL.createObjectURL(stream);
            }
            video.play();
        });
    }else if (navigator.getMedia) {
        navigator.getMedia({
            video: true
        }, function(stream) {
            mediaStreamTrack = stream.getTracks()[0];
            video.src = (window.URL || window.webkitURL).createObjectURL(stream);
            video.play();
        });
    }
    //人臉識別參考文檔：https://cloud.baidu.com/doc/FACE/
    function face_login(){
        context.drawImage(video, 0, 0, 200, 150);
        jQuery.post('faceLogin', {           //指定發送圖片到的servlet
            snapData: canvas.toDataURL('image/jpg')
        }).done(function(rs) {
            //對結果集進行解析，判斷是否存在人臉
            console.log(JSON.stringify(rs));
            if(rs.error_code == "222202"){
                alert("沒有人臉信息或人臉數量非1，請從新拍照！");
            }else if(rs.error_code == "222207"){
                alert("人臉庫中沒有您的註冊信息，請先註冊。");
            }else if(rs.error_code == "223120"){
                alert("請正確登陸，不得僞造！");
            }else if(rs.error_msg == "SUCCESS"){
                alert("登陸成功！");
            }
        });
    }
</script>
</body>
</html>

服務端代碼也只有一個類：代碼中百度雲帳號信息，已處理，不能直接用。

package com.cis.cloud;

import com.alibaba.fastjson.JSON;
import com.baidu.aip.face.AipFace;
import org.json.JSONObject;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;

import java.util.HashMap;
import java.util.Map;

@Controller
@RequestMapping("/user")
public class UserController {

    private static final String APP_ID_FACE ="155671420";
    private static final String API_KEY_FACE ="6jnC1LDLEox5SsGfktlWhYZqx";
    private static final String SECRET_KEY_FACE ="Q0C1Y2upbpxxVuPkTNwqkxOWYMDpCwwwI";


    @GetMapping("face")
    public  String face(){
        return "user/face";
    }

    //005.人臉識別登陸
    @ResponseBody
    @RequestMapping(value = "faceLogin",method = RequestMethod.POST)
    public Map faceLogin(@RequestParam("snapData") String str) throws Exception{
        //使用Ajax提交base64字符串，須要通過去頭轉碼
        String img_data = str.substring(22, str.length());
        AipFace client = new AipFace(APP_ID_FACE, API_KEY_FACE, SECRET_KEY_FACE);
        HashMap<String,String> options = new HashMap<String,String>();  //請求預置參數
        options.put("quality_control", "NORMAL");
        options.put("liveness_control", "LOW");
        options.put("user_id", "hkk"); //與後臺用戶ID匹配
        options.put("max_user_num", "3");

        JSONObject res = client.search(img_data,"BASE64","family", options);    //人臉庫搜索 family爲後臺用戶組名稱
        System.out.println(res.toString(2));

        Map map = JSON.parseObject(res.toString());
        return map;
    }

}

附一段百度雲返回的結果：

{
  "result": {
    "face_token": "59b1966b9042068a95d69713e48e50bf",
    "user_list": [{
      "score": 94.014793395996,
      "group_id": "family",
      "user_id": "hkk",
      "user_info": ""
    }]
  },
  "log_id": 304569203895258121,
  "error_msg": "SUCCESS",
  "cached": 0,
  "error_code": 0,
  "timestamp": 1550389525
}

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。