SpringBoot集成百度人脸识别实现登陆注册功能Demo(二)

前言

上一篇SpringBoot集成百度人脸demo中我使用的是调用本机摄像头完成人脸注册,本次demo根据业务需求的不同我采用文件上传的方式实现人脸注册。

效果演示

注册
在这里插入图片描述
后端响应数据:

在这里插入图片描述

登录

在这里插入图片描述
后端响应数据:

在这里插入图片描述

项目结构

在这里插入图片描述

后端代码实现

1、BaiduAiUtils工具类封装

package com.jzj.utils;import com.baidu.aip.face.AipFace;
import lombok.extern.slf4j.Slf4j;
import org.json.JSONArray;
import org.json.JSONObject;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.stereotype.Component;import javax.annotation.PostConstruct;
import java.util.HashMap;/*** 百度AI工具类封装** @author 黎明* @version 1.0* @date 2023/8/5 9:35*/
@Component
@Slf4j
public class BaiduAiUtils {/*注入百度个人用户相关配置*/@Value("${baidu.face.appId}")private String APP_ID;@Value("${baidu.face.apiKey}")private String API_KEY;@Value("${baidu.face.secretKey}")private String SECRET_KEY;@Value("${baidu.face.imageType}")private String IMAGE_TYPE;@Value("${baidu.face.groupId}")private String groupId;// 声明私有变量client,AipFace是百度人脸识别 API 的 Java 客户端类,用于与人脸识别服务进行通信。private AipFace client;// 用于存储一些参数配置(图片质量控制、活体检测控制)private HashMap<String, String> map = new HashMap<>();/*私有的构造函数,表明该类是一个单例类,只能通过静态方法获取实例*/private BaiduAiUtils() {// 图片质量控制 NONE: 不进行控制 LOW:较低的质量要求 NORMAL: 一般的质量要求 HIGH: 较高的质量要求 默认 NONEmap.put("quality_control", "NORMAL");// 活体检测控制 NONE: 不进行控制 LOW:较低的活体要求(高通过率 低拒绝率) NORMAL: 一般的活体要求(平衡的拒绝率, 通过率) HIGH: 较高的活体要求(高拒绝率 低通过率) 默认NONEmap.put("liveness_control", "LOW");}/*用于在类初始化时执行client的初始化操作*/@PostConstructpublic void init() {client = new AipFace(APP_ID, API_KEY, SECRET_KEY);}/*** 人脸注册:用户照片存入人脸库中*/public Boolean faceRegister(String userId, String image) {JSONObject res = client.addUser(image, IMAGE_TYPE, groupId, userId, map);log.info("人脸注册响应数据 :{}", res);Integer errorCode = res.getInt("error_code");return errorCode == 0 ? true : false;}/*** 人脸更新:更新人脸库中的用户照片*/public Boolean faceUpdate(String userId, String image) {JSONObject res = client.updateUser(image, IMAGE_TYPE, groupId, userId, map);log.info("人脸更新响应数据 :{}", res);Integer errorCode = res.getInt("error_code");return errorCode == 0 ? true : false;}/*** 人脸检测:判断上传的图片中是否具有面部信息*/public Boolean faceCheck(String image) {JSONObject res = client.detect(image, IMAGE_TYPE, map);log.info("人脸检测响应数据 :{}", res);if (res.has("error_code") && res.getInt("error_code") == 0) {JSONObject resultObject = res.getJSONObject("result");Integer faceNum = resultObject.getInt("face_num");return faceNum == 1 ? true : false;} else {return false;}}/*** 1.搜索人脸库中相似的人脸并返回数据* <p>* 2.判断人脸匹配得分(score)大于80分则认为是同一个人*/public String faceSearch(String image) {JSONObject res = client.search(image, IMAGE_TYPE, groupId, map);log.info("人脸搜索响应数据 :{}", res);if (res.has("error_code") && res.getInt("error_code") == 0) {JSONObject result = res.getJSONObject("result");JSONArray userList = result.getJSONArray("user_list");if (userList.length() > 0) {JSONObject user = userList.getJSONObject(0);double score = user.getDouble("score");if (score > 80) {return user.getString("user_id");}}}return null;}}

2、FaceServiceImpl

package com.jzj.service.impl;import com.jzj.service.FaceService;
import com.jzj.utils.BaiduAiUtils;
import lombok.extern.slf4j.Slf4j;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;/*** FaceService实现类** @author 黎明* @version 1.0* @date 2023/8/5 9:53*/
@Service
@Slf4j
public class FaceServiceImpl implements FaceService {// 注入BaiduAiUtils@Autowiredprivate BaiduAiUtils baiduAiUtils;/*** 人脸登录** @param imagebast64 图片base64编码* @return userId*/@Overridepublic String loginByFace(StringBuffer imagebast64) {// 处理base64编码内容String image = imagebast64.substring(imagebast64.indexOf(",") + 1, imagebast64.length());return baiduAiUtils.faceSearch(image);}/*** 人脸注册** @param userId      用户Id* @param imagebast64 图片base64编码* @return ”“*/@Overridepublic Boolean registerFace(String userId, StringBuffer imagebast64) {// 处理base64编码内容String image = imagebast64.substring(imagebast64.indexOf(",") + 1, imagebast64.length());log.info("处理后的图片base64编码:{}",image);return baiduAiUtils.faceRegister(userId, image);}
}

3、FaceController

package com.jzj.controller;import com.alibaba.fastjson.JSON;
import com.jzj.common.Result;
import com.jzj.service.FaceService;
import lombok.extern.slf4j.Slf4j;
import org.json.JSONObject;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.util.StringUtils;
import org.springframework.web.bind.annotation.*;import java.util.UUID;/*** controller控制层** @author 黎明* @version 1.0* @date 2023/8/5 10:01*/
@RestController
@RequestMapping("/face")
@Slf4j
public class FaceController {// 注入FaceService@Autowiredprivate FaceService faceService;/*** 人脸登录* @param request 图片base64编码* @return userId*/@RequestMapping("/login")public Result searchface(@RequestBody String request) {StringBuffer image = new StringBuffer(request);String userId = faceService.loginByFace(image);/*判断人脸库中是否有改用户*/if (StringUtils.hasText(userId)){// !null且不为空,返回用户ID,和状态码:0return Result.ok(userId);}return Result.err(userId);}/*** 人脸注册* @param request 图片base64编码* @return res*/@PostMapping("/register")public Result registerFace(@RequestBody String request) {StringBuffer image = new StringBuffer(request);String userId = UUID.randomUUID().toString().substring(0, 4);Boolean registerFace = faceService.registerFace(userId, image);/*判断是否注册成功*/if (registerFace){// 注册成功,返回用户ID、状态码:0return Result.ok(userId);}// 注册失败,返回用户ID、状态码:1return Result.err(userId);}
}

前端代码实现

1、register

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>用户注册</title><script type="application/javascript" src="js/axios_0.18.0_axios.min.js"></script>
</head>
<body>
<h1>Register</h1>
<input type="file" id="fileInput">
<button id="registerBtn">注册</button><script>// 获取注册按钮元素,并为其添加点击事件监听器document.getElementById("registerBtn").addEventListener("click", function () {// 获取文件选择框元素和选择的文件var fileInput = document.getElementById("fileInput");var file = fileInput.files[0];// 验证图片格式if (file) {var allowedFormats = ['image/png', 'image/jpeg', 'image/jpg', 'image/bmp'];if (allowedFormats.includes(file.type)) {// 创建一个 FileReader 对象,用于读取文件的内容var reader = new FileReader();// 文件读取完成后的处理逻辑reader.onloadend = function () {// 从读取的结果中提取图像数据的 Base64 编码部分,使用正则表达式去除前缀部分const imageBase64 = reader.result// 发送POST请求axios.post('/face/register', {imagebast64: imageBase64}).then(function (response) {// 请求成功处理逻辑console.log("响应数据:", response.data);console.log("用户userId:", response.data.userId);console.log("用户注册状态码:", response.data.code);if (response.data.code === 0) {alert("注册成功! UserId: " + response.data.userId);// 跳转到index页面window.location.href = "https://www.baidu.com";} else {alert("注册失败!");}}).catch(function (error) {// 请求失败处理逻辑console.error("错误注册信息: ", error);});};// 读取文件内容,并将其保存在 reader.result 中reader.readAsDataURL(file);} else {// 文件格式不符合要求,显示错误提示alert("只能上传PNG、JPG、JPEG和BMP格式的图片!");}}});
</script>
</body>
</html>

2、login

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>人脸识别登录</title><script type="application/javascript" src="js/axios_0.18.0_axios.min.js"></script>
</head>
<body>
<h1>Login</h1>
<video id="video" width="320" height="240" autoplay></video>
<button id="loginBtn">登录</button><script>// 获取视频流navigator.mediaDevices.getUserMedia({ video: true, audio: false }).then(function(stream) {var video = document.getElementById("video");video.srcObject = stream;}).catch(function(error) {console.error("访问视频流出错: ", error);});// 登录事件监听document.getElementById("loginBtn").addEventListener("click", function() {var video = document.getElementById("video");var canvas = document.createElement('canvas');canvas.width = video.videoWidth;canvas.height = video.videoHeight;var context = canvas.getContext('2d');context.drawImage(video, 0, 0, canvas.width, canvas.height);var imageBase64 = canvas.toDataURL("image/jpeg");axios.post("/face/login", {imagebast64: imageBase64}).then(function(response) {var res = response.data;if (res.code === 0) {alert("登录成功! UserId: " + res.userId);// 跳转到index页面window.location.href = "welcome.html";} else {alert("登录失败!");}}).catch(function(error) {console.error("登录错误: ", error);});});
</script>
</body>
</html>

详细代码已放到gitee仓库需要的源码请自取,链接https://gitee.com/bitliming/baidu_face.git

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/80193.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

SQL 表别名 和 列别名

列表名 列表名之后 order by 可以用别名 也可以用原名&#xff0c; where 中不能用别名的 SQL语句执行顺序&#xff1a; from–>where–>group by -->having — >select --> order 第一步&#xff1a;from语句&#xff0c;选择要操作的表。 第二步&#xff1…

Bug的严重等级和优先级别与分类

一、 Bug的严重等级定义&#xff1a; 1、 Blocker 即系统无法执行、崩溃或严重资源不足、应用模块无法启动或异常退出、无法测试、造成系统不稳定。 严重花屏内存泄漏 用户数据丢失或破坏系统崩溃/死机/冻结模块无法启动或异常退出严重的数值计算错误功能设计与需求严重不符其…

每日一学:什么是 Harbor ?

目录 什么是 Harbor &#xff1f; 一、Harbor 的优势 二、Harbor 架构构成 三、Core services 这是 Harbor 的核心功能 什么是 Harbor &#xff1f; Harbor 是 VMware 公司开源的企业级 Docker Registry 项目&#xff0c;其目标是帮助用户迅速搭建一个企业级的 Docker Reg…

Spring MVCSpring Boot

文章目录 Spring MVC什么是MVC模式Spring MVC优点SpringMVC 运行流程SpringMVC组件SpringMVC常用的注解有哪些SpringMVC的拦截器和过滤器有什么区别&#xff1f;执行顺序是什么 SpringBoot对SpringBoot的理解Spring和SpringBoot的关系&#xff1f;SpringBoot有哪些核心注解Spri…

【PDF密码】PDF文件不能打印,为什么?

正常的PDF文件是可以打印的&#xff0c;如果PDF文件打开之后发现文件不能打印&#xff0c;我们需要先查看一下自己的打印机是否能够正常运行&#xff0c;如果打印机是正常的&#xff0c;我们再查看一下&#xff0c;文件中的打印功能按钮是否是灰色的状态。 如果PDF中的大多数功…

react icon ant简单使用

refer&#xff1a; 文字提示 Tooltip - Ant Design 1.首先保证已经引入了Ant 2.在组件&#xff08;页面&#xff09;引入tooltip import { Form, Tooltip } from antd; 3.在合适的位置使用tooltip&#xff1a; <span>寿命 <Tooltip title"这是寿命的说明&quo…

前端 select 标签如何创建下拉菜单?

聚沙成塔每天进步一点点 ⭐ 专栏简介⭐ 代码示例⭐ 代码讲解⭐ 写在最后 ⭐ 专栏简介 前端入门之旅&#xff1a;探索Web开发的奇妙世界 记得点击上方或者右侧链接订阅本专栏哦 几何带你启航前端之旅 欢迎来到前端入门之旅&#xff01;这个专栏是为那些对Web开发感兴趣、刚刚踏…

【Linux】计算机网络的背景和协议分层

文章目录 网络发展协议何为协议网络协议协议分层OSI七层模型TCP/IP五层模型&#xff08;四层&#xff09; 基本通信流程mac地址和ip地址网络通信本质 网络发展 从一开始计算机作为一台台单机使用&#xff0c;到现在网络飞速发展&#xff0c;从局域网Lan建立起局域网&#xff0…

Vue3 第四节 自定义hook函数以及组合式API

1.自定义hook函数 2.toRef和toRefs 3.shallowRef和shallowReactive 4.readonly和shallowReadonly 5.toRaw和markRaw 6.customref 一.自定义hook函数 ① 本质是一个函数&#xff0c;把setup函数中使用的Composition API 进行了封装,类似于vue2.x中的mixin 自定义hook函数…

TCP和UDP

目录 TCP和UDP是什么&#xff1f; TCP和UDP有什么区别? 三次握手和四次挥手 TCP维护可靠的通信方式 拥塞控制 滑动窗口的原理 什么是粘包以及粘包的原因 粘包的处理方式 TCP和UDP使用场景 TCP和UDP是什么&#xff1f; TCP&#xff1a; 传输控制协议&#xff08;TCP&am…

Maven介绍-下载-安装-使用-基础知识

Maven介绍-下载-安装-使用-基础知识 Maven的进阶高级用法可查看这篇文章&#xff1a; Maven分模块-继承-聚合-私服的高级用法 文章目录 Maven介绍-下载-安装-使用-基础知识01. Maven1.1 初识Maven1.1.1 什么是Maven1.1.2 Maven的作用 02. Maven概述2.1 Maven介绍2.2 Maven模型…

postgresql|数据库|MySQL数据库向postgresql数据库迁移的工具pgloader的部署和初步使用

前言&#xff1a; MySQL数据库和postgresql数据库之间的差异并不多&#xff0c;这里的差异指的是对SQL语言的支持两者并不大&#xff0c;但底层的东西差异是非常多的&#xff0c;例如&#xff0c;MySQL的innodb引擎概念&#xff0c;数据库用户管理&#xff0c;这些和postgresq…

【设计模式】-建造者模式

Java建造者模式&#xff1a;创建复杂对象的灵活构建者 在软件开发中&#xff0c;我们经常遇到需要创建一个复杂对象的情况。如果使用传统的构造函数进行对象创建&#xff0c;可能会导致构造函数参数过多&#xff0c;难以管理和维护。建造者模式&#xff08;Builder Pattern&am…

使用eXosip+ffmpeg、ffplay命令行实现sip客户端

文章目录 前言一、关键实现1、主要流程2、解决端口冲突&#xff08;1&#xff09;、出现原因&#xff08;2&#xff09;、解决方法 3、解析sdp&#xff08;1&#xff09;、定义实体&#xff08;2&#xff09;、解析视频&#xff08;3&#xff09;、解析音频 4、命令行推拉流&am…

Ctfshow web入门 XXE 模板注入篇 web373-web378 详细题解 全

CTFshow XXE web373 学习资料&#xff1a; &#xff08;梭哈~&#xff09; https://www.cnblogs.com/20175211lyz/p/11413335.html https://www.cnblogs.com/zhaijiahui/p/9147595.html https://www.cnblogs.com/r00tuser/p/7255939.html https://mp.weixin.qq.com/s?__bizMz…

stable diffusion(1): webui的本地部署(windows)

一、前言 是的&#xff0c;现在是202308月份了&#xff0c;网上已经有很多打包好的工具&#xff0c;或者直接进一个web就能用SD的功能&#xff0c;但是我们作为程序员&#xff0c;就应该去躺坑&#xff0c;这样做也是为了能够有更多自主操作的空间。 像其他AI一样&#xff0c…

【类和对象】基础知识

目录 一、类的定义 定义方式一&#xff1a;定义与声明都在类中 定义方式二&#xff1a;定义与声明分离 二、类的实例化&&类对象存储方式 类的实例化 类对象存储模式 三、this指针 一、类的定义 定义方式一&#xff1a;定义与声明都在类中 #include<iostream&…

进阶:Docker容器管理工具——Docker-Compose使用

文章目录 前言Compose大杀器编排服务 1、docker-compose安装curl方式安装增加可执行权限查看版本 2、Docker-compose.yaml命令3、 docker-compose实战4、Docker网络路由docker的跨主机网络路由**问题由来**:方案两台机分别配置路由表ip_forward配置 总结 前言 容器的管理工具&…

AI一键生成短视频

AI一键生成推文短视频 阅读时长&#xff1a;10分钟 本文内容&#xff1a; 结合开源AI&#xff0c;一键生成短视频发布到常见的某音&#xff0c;某手平台&#xff0c;狠狠赚一笔 前置知识&#xff1a; 1.基本的 python 编程知识 2.chatGPT 使用过 3.stable diffution 使用过 成果…

开关电源控制--bode图相角裕量的选择

什么是相角裕量 在Bode图中&#xff0c;相角裕量是指系统的相位裕量&#xff0c;用于评估系统的稳定性和频率响应特性。 Bode图是一种常用的频率响应图&#xff0c;将系统的增益和相位随频率变化的情况绘制出来。在Bode图中&#xff0c;相角裕量表示系统的相位与-180度&#…