SpringBoot+Vue，轻松实现网页版人脸登录与精准识别_springboot vue 人脸识别

目录

1、技术介绍

2、技术原理

2.1、人脸检测

①参考模板法

②人脸规则法

2.2、人脸跟踪

2.3、人脸比对

①特征向量法

②面纹模板法

识别过程

案例

一、springboot后端项目

1，拉取项目后，导入相关依赖jar包

2，执行sql文件夹下面的mysql脚本

3，执行完成后，配置腾讯云

4，获取secretId和secretKey，并开通人脸服务之后，将secretId和secretKey配置到yml文件中

二、vue前端项目

2，效果图，登录页面

3，首页效果图

4，列表效果图

 4.1，添加人脸效果图

4.2，修改人脸数据效果图

---

1、技术介绍

人脸识别(Face Recognition)是一种依据人的面部特征(如统计或几何特征等)，自动进行身份识别的一种生物识别技术，又称为面像识别、人像识别、相貌识别、面孔识别、面部识别等。通常我们所说的人脸识别是基于光学人脸图像的身份识别与验证的简称。

人脸识别利用摄像机或摄像头采集含有人脸的图像或视频流，并自动在图像中检测和跟踪人脸，进而对检测到的人脸图像进行一系列的相关应用操作。技术上包括图像采集、特征定位、身份的确认和查找等等。简单来说，就是从照片中提取人脸中的特征，比如眉毛高度、嘴角等等，再通过特征的对比输出结果。

2、技术原理

2.1、人脸检测

面貌检测是指在动态的场景与复杂的背景中判断是否存在面像，并分离出这种面像。一般有下列几种方法：

①参考模板法

首先设计一个或数个标准人脸的模板，然后计算测试采集的样品与标准模板之间的匹配程度，并通过阈值来判断是否存在人脸。

②人脸规则法

由于人脸具有一定的结构分布特征，所谓人脸规则的方法即提取这些特征生成相应的规则以判断测试样品是否包含人脸。

2.2、人脸跟踪

面貌跟踪是指对被检测到的面貌进行动态目标跟踪。具体采用基于模型的方法或基于运动与模型相结合的方法。此外，利用肤色模型跟踪也不失为一种简单而有效的手段。

2.3、人脸比对

面貌比对是对被检测到的面貌像进行身份确认或在面像库中进行目标搜索。这实际上就是说，将采样到的面像与库存的面像依次进行比对，并找出最佳的匹配对象。所以，面像的描述决定了面像识别的具体方法与性能。主要采用特征向量与面纹模板两种描述方法：

①特征向量法

该方法是先确定眼虹膜、鼻翼、嘴角等面像五官轮廓的大小、位置、距离等属性，然后再计算出它们的几何特征量，而这些特征量形成一描述该面像的特征向量。

②面纹模板法

该方法是在库中存贮若干标准面像模板或面像器官模板，在进行比对时，将采样面像所有像素与库中所有模板采用归一化相关量度量进行匹配。此外，还有采用模式识别的自相关网络或特征与模板相结合的方法。

人脸识别技术的核心实际为“局部人体特征分析”和“图形/神经识别算法”。这种算法是利用人体面部各器官及特征部位的方法。如对应几何关系多数据形成识别参数与数据库中所有的原始参数进行比较、判断与确认。一般要求判断时间低于1秒。

识别过程

一般分三步：

1. 首先建立人脸的面像档案。即用摄像机采集单位人员的人脸的面像文件或取他们的照片形成面像文件，并将这些面像文件生成面纹（Faceprint）编码贮存起来。
2. 获取当前的人体面像。即用摄像机捕捉的当前出入人员的面像，或取照片输入，并将当前的面像文件生成面纹编码。
3. 用当前的面纹编码与档案库存的比对。即将当前的面像的面纹编码与档案库存中的面纹编码进行检索比对。上述的“面纹编码”方式是根据人脸脸部的本质特征和开头来工作的。这种面纹编码可以抵抗光线、皮肤色调、面部毛发、发型、眼镜、表情和姿态的变化，具有强大的可靠性，从而使它可以从百万人中精确地辨认出某个人。人脸的识别过程，利用普通的图像处理设备就能自动、连续、实时地完成。

案例

FACE-UI 基于前后端分离Web端项目，主要实现了网页版的人脸登录，通过调取前端摄像头拍照，传入后台进行跟数据库人脸库的相似度比对。

　　技术点：Springboot，Mysql，JWT，VUE 2.X 等等技术实现，主要功能点：人脸列表CRUD，日志列表CRUD，基于自建人脸库通过base64编码方式存储人脸图片，通过调用腾讯云人脸对比API场景实现

一、springboot后端项目

1，拉取项目后，导入相关依赖jar包

　　项目结构

　

2，执行sql文件夹下面的mysql脚本

　

3，执行完成后，配置腾讯云

腾讯云如何获取secretId和secretKey，以及开通人脸服务： 跳转查看

4，获取secretId和secretKey，并开通人脸服务之后，将secretId和secretKey配置到yml文件中

　

　　5，运行 FaceEasyApplication

二、vue前端项目

1，拉取项目后，安装依赖

npm install
#如果有淘宝镜像
cnpm install

运行

npm run serve

2，效果图，登录页面

“ 注意：刚刚初始化的时候，表里面是没有人脸的

　　所以登录界面第一次拍照为录入人脸，后续为验证人脸登录

3，首页效果图

4，列表效果图

 4.1，添加人脸效果图

4.2，修改人脸数据效果图

5，日志列表效果图