springboot整合百度云ai人脸识别（保姆级教程）_springboot 百度云

作者：你好赵伟 | 2024-03-15 19:42:02

踩

springboot 百度云

这段时间项目上提到了这个人脸识别这个东西，下来自己打了个springboot项目整合了下，话不多说上步骤：

1.先到百度云ai上申请并创建应用

信息啥的随便填填即可
在这里插入图片描述

应用创建完后可以看看sdk文档，里面有关于接口的各种说明

2.引入依赖

在这里插入图片描述
依赖的版本也可以自己去maven的官网上找

配置：在第一步骤创建应用时，给的参数配置到配置文件里

编写前端文件：
注册文件

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/css">
	*{margin: 0;padding: 0;}
	html,body{width: 100%;height: 100%;}/**/
	h1{color: #fff;text-align: center;line-height: 80px;}
	.media{width: 450px;height: 300px;line-height: 300px;margin: 40px auto;}
	.btn{width: 250px;height:50px; line-height:50px; margin: 20px auto; text-align: center;}
	#register{width: 200px;height:50px;background-color: skyblue;text-align: center;line-height: 50px;color: #fff;}
	#canvas{display: none;}
	#shuru{width: 250px;height:50px; line-height:50px;background-color: skyblue; margin: 20px auto; text-align: center;}
</style>
</head>
<body>
	<h1>人脸注册</h1>
	<div id="shuru">用户名：<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>
	<div class="btn"><button id="register" >确定注册</button></div>
	<script type="text/javascript" src="js/jquery-3.3.1.js"></script>

	<script type="text/javascript">
	/**调用摄像头，获取媒体视频流**/
	var video = document.getElementById('video');
	//返回画布二维画图环境
	var userContext = canvas.getContext("2d");
	var getUserMedia = 
		//浏览器兼容,表示在火狐、Google、IE等浏览器都可正常支持
		(navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia)
		//getUserMedia.call(要调用的对象，约束条件，调用成功的函数，调用失败的函数)
		getUserMedia.call(navigator,{video: true,audio: false},function(localMediaStream){
			//获取摄像头捕捉的视频流
			video.srcObject=localMediaStream;
		},function(e){
			console.log("获取摄像头失败！！")
		});
	//点击按钮注册事件
	 var btn = document.getElementById("register");
	
	btn.onclick = function () {
		var username = $("#username").val();</
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/你好赵伟/article/detail/244048