阿里云实现人脸登录(人脸库 OSS)

article/2025/10/9 19:46:36

我自认为不想做curd程序员，但是免不了的会对数据基本原子操作进行处理，项目开发过程中的增删改查少不了的，但是又不甘心于curd下去，所以想要在掌握现有知识的基础上，甚至逼迫自己去学习一些东西，去接触新的技术，足够的深度做不到，最起码广度要有所保证，每天进步一点点。
开篇写的算是自己的程序员生涯的一丢丢想法，言归正传，本篇介绍通过阿里云实现人脸登录功能（百度云原理类似，不过百度云的人脸不是免费的了，so果断阿里云了）。
说实话本篇的说明思路我自己感觉有点乱，只好边写边梳理。。
前提：系统中已经开户成功，user表内有相关用户信息及用户ID（唯一标识）
整体思路：

  • 阿里云开通人脸人体服务，现阶段是免费的，以后说不准哈哈。
    https://homenew.console.aliyun.com在这里插入图片描述
  • 选择人脸数据库管理模块，进行人脸管理，可以新增样本，其实就是将人脸图片与系统内user表ID进行关联与维护。
    在这里插入图片描述
  • 系统PC或移动端摄像头人脸识别，获取人脸base64，调用后端接口，后端接口进行阿里云OSS上传并获得存储路径（后续人脸搜索api方法会要求前端识别人脸图片格式为OSS存储格式，这点有些麻烦），而后调用人脸搜索api从阿里云人脸数据库中搜索是否能匹配到，搜索结果会返回matchList。（人脸搜索可以限制返回最高匹配的几个结果，而不是所有结果）
  • 搜索结果getScore按照匹配分数进行排序，获取分数最高的也就是匹配度最高的，判断分数是否高于0.8（匹配分数按实际情况自己定义）。
  • 根据最高匹配结果获取系统user表内的ID（人脸识别管理库的样本ID已经维护），后续调用系统login接口即可，获取token等操作。
	@ApiOperation(value = "人脸检测接口")@PostMapping(value = "/check")public Result faceCheck(@RequestBody JSONObject faceJson) {String base64Str = faceJson.getString("img");String url = aliyunOss.uploadFiles(base64Str);if (StringUtils.isBlank(url)) {return Result.fail("人脸检测图片失败");}SearchFaceResponse response = aliFaceRecognize.searchFace(groupId, url);if (response==null) {return Result.fail("人脸检测失败");}if (response.getData()==null){return Result.fail("未匹配到人脸");}if (CollectionUtils.isEmpty(response.getData().getMatchList())) {return Result.fail("未匹配到人脸");}List<SearchFaceResponse.Data.MatchListItem.FaceItemsItem> finals = new ArrayList<>();List<SearchFaceResponse.Data.MatchListItem> matchList = response.getData().getMatchList();for (SearchFaceResponse.Data.MatchListItem matchListItem : matchList) {List<SearchFaceResponse.Data.MatchListItem.FaceItemsItem> items = matchListItem.getFaceItems();for (SearchFaceResponse.Data.MatchListItem.FaceItemsItem item : items) {finals.add(item);}}SearchFaceResponse.Data.MatchListItem.FaceItemsItem maxMaterial = finals.stream().max(Comparator.comparingDouble(SearchFaceResponse.Data.MatchListItem.FaceItemsItem::getScore)).get();if(maxMaterial.getScore()<0.8) {return Result.fail("人脸匹配精度不准确,请重新识别");}User user = userService.findById(maxMaterial.getEntityId());if (user == null) {return Result.fail("未匹配到用户，请开户");}return Result.success("登录成功！", maxMaterial.getEntityId());}

前端使用antdVue实现的，附代码：

<template><div><div class="user-icon"><video width="500" height="400" ref="videoDom" id="video" preload autoplay loop muted></video><canvas width="500" height="400" ref="canvasDOM"></canvas></div><div align="center">{{loding}}</div><!--<div @click="initTracker">人脸识别</div>--></div>
</template><script>require('tracking/build/tracking-min.js')require('tracking/build/data/face-min.js')export default {name: 'FaceLoginAli',data() {return {// 记录拍照到了几次count: 0,isdetected: '请您保持脸部在画面中央',loding: ''}},methods: {// 初始化rackerinitTracker(){// 启用摄像头,这一个是原生调用摄像头的功能,不写的话有时候谷歌浏览器调用摄像头会失败navigator.mediaDevices.getUserMedia({video: true,audio: true}).then(this.getMediaStreamSuccess).catch(this.getMediaStreamError)this.context  = this.canvas.getContext('2d')// 初始化tracking参数this.tracker = new tracking.ObjectTracker("face");this.tracker.setInitialScale(4);this.tracker.setStepSize(2);this.tracker.setEdgesDensity(0.1);this.tracker.on("track", event => {this.onTracked(event);});// tracking启用摄像头,这里我选择调用原生的摄像头// tracking.track(this.video, this.tracker, { camera: true });// 如果是读取视频，可以用trackerTask.stop trackerTask.run来暂停、开始视频this.trackerTask = tracking.track(this.video, this.tracker);},// 监听中onTracked(event){// 判断终止条件, stop是异步的，不返回的话，还会一直截图if (this.count >= 21) {this.onStopTracking();return;}// 画框框this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);event.data.forEach(rect => {this.context.lineWidth = 1;this.context.strokeStyle = "#a64ceb";//'#a64ceb';this.context.strokeRect(rect.x, rect.y, rect.width, rect.height);this.context.font = "11px Helvetica";this.context.fillStyle = "#fff";// 截图if (event.data.length > 0 && this.count <= 20) {if (this.count < 0) {this.count = 0}this.count += 1if (this.count > 20) {this.isdetected = '已检测到人脸，正在识别'this.getPhoto()}} else {this.count -= 1if (this.count < 0){this.isdetected = '请您保持脸部在画面中央'}}});// 视频中心展示文字this.context.fillText(this.isdetected, 200,50);},// 停止监听onStopTracking() {this.trackerTask.stop();this.video.pause();// 关闭摄像头this.video.srcObject = nullwindow.stream.getTracks().forEach(track => track.stop())},// 获取人脸照片getPhoto(){this.isdetected = ''this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);let video = document.getElementById('video')this.context.drawImage(video, 0,0, this.canvas.width, this.canvas.height)let dataUrl = this.canvas.toDataURL('image/jpeg', 1);this.imgbase64 = dataUrl.replace(/^data:image\/\w+;base64,/, "");// 开始人脸识别this.postFace()},// 人脸验证postFace(){this.loding = '正在识别中,请稍后................'this.$http.post('admin/face/check',{img: this.imgbase64}).then((res)=>{console.log(res)this.loding = ''if(res.success){this.faceLogin(res.data);this.$message.success(res.msg);}else {this.$message.error(res.msg);}})},// 视频流启动getMediaStreamSuccess(stream) {window.stream = streamthis.video.srcObject = stream},// 视频媒体流失败getMediaStreamError(error) {this.$message.error('视频媒体流获取错误' + error)},faceLogin(userId) {const that = thisreturn this.$http.post('/admin/face/login/'+ userId).then(function (res) {if (res.success) {//这儿写自己登录成功的逻辑}});}},mounted() {this.video = this.$refs.videoDomthis.canvas = this.$refs.canvasDOM//初始化获取tonkenthis.initTracker();},destroyed() {}}
</script><style scoped>.user-icon {position: relative;margin: 0 auto;margin-top: 50px;width: 560px;height: 560px;}.button {width: 90vw;height: 50px;line-height: 50px;margin: 0 auto;background-color: skyblue;color: white;text-align: center;border-radius: 5px;font-size: 16px;}video, canvas {position: absolute;}
</style>

写到这儿感觉也就这些东西，我自己是明白整个流程，看这篇文章的不知道是否清楚，如果有疑问可以留言回复。


http://chatgpt.dhexx.cn/article/Sy6DxnvO.shtml

相关文章

毕业设计 - 基于JAVA人脸识别管理系统（人脸搜索与人脸库管理）

毕业设计 - 基于JAVA人脸识别管理系统（人脸搜索与人脸库管理）

文章目录 【背景/简介】【技术框架】【核心开发】【功能展示】一、人脸库管理二、人脸识别记录管理 【核心代码】【总结】 基于JAVA的人脸识别管理系统作品分享一下&#xff0c;希望能帮助到有需要的同学们。 【背景/简介】 人脸搜索与人脸库管理主要用在人脸通用场景&#xf…
阅读更多...
定位基本方法 3

定位基本方法 3

节点定位方法 3. 基于移动 BS 的定位 在基于静态信标节点的定位方法中&#xff0c;定位系统的定位精度与静态信标节点的部署密度和质量直接相关。为了获得好的定位精度&#xff0c;就需要在部署区域中放置大量的静态信标节点&#xff0c;这势必会导致定位成本的大幅上升。为此…
阅读更多...
定位基本方法 1

定位基本方法 1

节点定位方法 1. 节点定位的计算 在 WSNs 的定位中&#xff0c;未知节点通过一定的技术和方法能够获得定位自身所需的坐标、角度或距离信息&#xff0c;从而利用节点位置的计算方法计算自身位置。下面我们将介绍几种较为典型的位置计算方法&#xff1a;三边测量法、三角测量法…
阅读更多...
浅谈自适应滤波器---（快速RLS算法）

浅谈自适应滤波器---（快速RLS算法）

在上一篇博客中&#xff08;浅谈自适应滤波器&#xff09;我给大家介绍了关于自适应滤波器的一些入门级的知识&#xff0c;并分析了常规RLS算法单次迭代的计算量级为O[N2]&#xff0c;当阶数N增大时相应的计算量显著增大&#xff0c;为了将计算量级降低到O[N]&#xff0c;人们提…
阅读更多...
图像处理自适应滤波

图像处理自适应滤波

图像处理基础(2)&#xff1a;自适应中值滤波器(基于OpenCV实现) 标签&#xff1a; opencv滤波器 2017-02-08 19:44 986人阅读 评论(0) 收藏 举报 分类&#xff1a; DIP&#xff08;8&#xff09; 版权声明&#xff1a;本文为博主原创文章&#xff0c;未经博主允许不得转载…
阅读更多...
自适应滤波器及其应用 - 自适应噪声抵消器

自适应滤波器及其应用 - 自适应噪声抵消器

传统IIR和FIR滤波器在处理输入信号的过程中滤波器参数固定&#xff0c;当环境发生变化时&#xff0c;滤波器无法实现原先设定的目标。自适应滤波器根据当前自身的状态和环境调整滤波器权系数。 1 自适应滤波器理论 其中&#xff0c;x(n)是输入信号&#xff0c;y(n)是输出信号&…
阅读更多...
自适应数字滤波器

自适应数字滤波器

文章目录 前言一、自适应滤波器的特点和构成二、最陡下降法三、最小均方算法(LMS)总结 前言 本文的主要内容是自适应数字滤波器的介绍&#xff0c;包含其特点与构成、最陡下降法、最小均方算法以及最小二乘算法等内容。 一、自适应滤波器的特点和构成 自适应滤波器的特点&…
阅读更多...
浅谈自适应滤波器---（自适应陷波器）

浅谈自适应滤波器---（自适应陷波器）

陷波器顾名思义就是对特定频率的信号有着很强的衰减的滤波器&#xff0c;也即阻带带宽极窄的带阻滤波器。在传统的数字陷波器设计中&#xff0c;为了能使某一频率信号得到足够大的衰减&#xff0c;通常的做法就是把阶数选的足够高来达到很大的衰减&#xff1b;但同时计算量也变…
阅读更多...
自适应滤波器及LMS自适应算法的理解

自适应滤波器及LMS自适应算法的理解

分享一篇以前写现代信号处理的课程论文。 ————————————————————
阅读更多...
自适应中值滤波器和自适应局部（均值）滤波器的设计 python+matlab各实现

自适应中值滤波器和自适应局部（均值）滤波器的设计 python+matlab各实现

要求是&#xff1a;自适应中值滤波器和自适应均值滤波器的设计&#xff0c;分别使用python和matlab去实现 一.原理 1.自适应中值滤波器 2.自适应局部滤波器&#xff0c;也叫自适应均值滤波器 二.设计流程 1.自适应中值滤波器 ①生成椒盐噪声 利用rand()函数生成[0,1]的随…
阅读更多...
自适应滤波去噪

自适应滤波去噪

自适应滤波器具有在未知环境下良好的运作并跟踪输入统计量随时间变化的能力。尽管对于不同的应用有不同的实现结构&#xff0c;但是他们都有一个基本的特征&#xff1a;输入向量X(n)和期望响应d(n)被用来计算估计误差e(n)&#xff0c;即e(n)d(n)-X(n)&#xff0c;并利用此误差信…
阅读更多...
自适应滤波（LMS，RLS）

自适应滤波（LMS，RLS）

1.背景及相关知识介绍 自适应滤波存在于信号处理、控制、图像处理等许多不同领域&#xff0c;它是一种智能更有针对性的滤波方法&#xff0c;通常用于去噪。 图中x&#xff08;j&#xff09;表示 j 时刻的输入信号值&#xff0c;y&#xff08;j&#xff09;表示 j 时刻的输出信…
阅读更多...
自适应滤波

自适应滤波

自适应阵列处理是一种空间滤波技术&#xff0c;它包含空间阵列和自通应处理两个部分。根据空时等效性原理&#xff0c;从理论上来讲&#xff0c;时域的各种统计自适应信号处理技术均可应用于空域的自适应阵列处理 自适应滤波已在时域处理中广为应用&#xff0c;其实现可以来用…
阅读更多...
matlab编程实现自适应均值滤波和自适应中值滤波

matlab编程实现自适应均值滤波和自适应中值滤波

matlab编程实现自适应滤波器 一、自适应均值滤波器1. 原理部分&#xff1a;2. 程序代码3. 结果对比 二、自适应中值滤波1. 原理部分2.程序代码3. 结果对比 一、自适应均值滤波器 1. 原理部分&#xff1a; 加入噪声&#xff1a; 原理&#xff1a; 将图片灰度化&#xff0c;然后…
阅读更多...
自适应滤波器之横向滤波器

自适应滤波器之横向滤波器

本文对横向滤波器作以介绍&#xff0c;如有表述不当之处欢迎批评指正。欢迎任何形式的转载&#xff0c;但请务必注明出处。 目录 1. 横向滤波器1.1. 概念1.2. 举例 2. 参考文献 1. 横向滤波器 1.1. 概念 横向滤波器&#xff08;transversal filter&#xff09;&#xff0c;也…
阅读更多...
自适应中值滤波及实现

自适应中值滤波及实现

前言 无意中看到了一篇比较老的论文&#xff0c;Adaptive median filters: new algorithms and results。感兴趣的可以下载下来看看。主要就是提出了一种自适应中值滤波算法&#xff0c;这个算法是很经典的中值滤波算法的改进版本&#xff0c;自动选择滤波器的大小&#xff0c…
阅读更多...
浅谈自适应滤波器

浅谈自适应滤波器

在通常的滤波场合中&#xff0c;从频域的角度进行滤波&#xff0c;其相关的理论已经相当的成熟&#xff0c;只要给出相应的设计指标就可以很方便的设计出满足要求的滤波器。然而在更一般的情况下&#xff0c;人们所需要的滤波器工作的环境是时变的&#xff0c;这就导致事先已经…
阅读更多...
自适应滤波原理

自适应滤波原理

在网上&#xff0c;看到一篇不错的自适应滤波原理讲解的文章&#xff0c;原文网址为&#xff1a;自适应滤波原理简介 全文包括&#xff1a; 1. 自适应滤波器简介 2. 自适应干扰抵消原理 3. 自适应滤波原理 4. 最小均方&#xff08;LMS&#xff09;算法 5. Matlab实现 一、自适…
阅读更多...
自适应滤波算法综述

自适应滤波算法综述

我要讲的几种方法 绪论自适应滤波的基本原理自适应滤波算法自适应滤波算法种类最小均方误差算法&#xff08;LMS&#xff09;递推最小二乘算法&#xff08;RLS&#xff09;变换域自适应滤波算法仿射投影算法其他 自适应滤波算法性能评价 自适应滤波的Matlab仿真正弦信号加噪的L…
阅读更多...
Java反射机制你还不会？那你怎么看Spring源码

Java反射机制你还不会？那你怎么看Spring源码

文章目录 1.Java代码在计算机中经历的阶段&#xff1a;三个阶段2.Java识别类和对象信息的两种方式3.什么是反射4.获取Class对象的方式5.Class对象的功能6.通过反射操作类中的成员变量、构造函数、方法7.案例8.反射的优缺点 1.Java代码在计算机中经历的阶段&#xff1a;三个阶段…
阅读更多...
推荐文章

Copyright @ 2022~2023