springboot+html实现简单注册登录
前端：
register.html
<!DOCTYPE html> <html lang="en" > <head><meta charset="UTF-8"><title>register</title><link rel="stylesheet" type="text/css" href="/css/style.css" /> </head> <body> <div class="control"><div class="item"><div class="active">注册</div></div><div class="content"><div style="display: block;"><form action="/user/register" method="post"><p>用户名</p><input type="text" placeholder="请输入用户名" name="username" /><p>密码</p><input type="password" placeholder="请输入密码" name ="password"/><br/><input type="submit" value="注册"/></form><p>已注册，<a href="/user/login" target="top">去登录</a></p></div></div> </div> </body> </html>
login.html
<!DOCTYPE html> <html lang="en" > <head><meta charset="UTF-8"><title>login</title><link href="/css/style.css" type="text/css" rel="stylesheet"><script src="/static/js/change.js"></script> </head> <body> <div class="control"><div class="item"><div class="active">登录</div></div><div class="content"><div style="display: block;"><form action="/user/login" method="post"><p>账号</p><input type="text" placeholder="请输入用户名" name="username"/><p>密码</p><input type="password" placeholder="请输入密码" name="password"/><br/><input type="submit" value="登录"/></form><p>没有账号，<a href="/user/register" target="top">去注册</a></p></div></div> </div> </body> </html>
success.html
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title> </head> <body> 登录成功 </body> </html>
style.css
*{margin: 0;padding: 0;
}
body{background: #f3f3f3;
}
.control{width: 340px;background: white;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);border-radius: 5px;
}
.item{width: 340px;height: 60px;background: #eeeeee;
}
.item div{width: 340px;height: 60px;display: inline-block;color: black;font-size: 18px;text-align: center;line-height: 60px;cursor: pointer;
}
.content{width: 100%;
}
.content div{margin: 20px 30px;display: none;text-align: left;
}
p{color: #4a4a4a;margin-top: 30px;margin-bottom: 6px;font-size: 15px;
}
.content input[type="text"], .content input[type="password"]{width: 100%;height: 40px;border-radius: 3px;border: 1px solid #adadad;padding: 0 10px;box-sizing: border-box;
}
.content input[type="submit"]{margin-top: 40px;width: 100%;height: 40px;border-radius: 5px;color: white;border: 1px solid #adadad;background: cyan;cursor: pointer;letter-spacing: 4px;margin-bottom: 40px;
}
.active{background: white;
}
.item div:hover{background: #f6f6f6;
}
后端：
com.example.entity.User
@Data
@Accessors(chain = true)
@EqualsAndHashCode(callSuper = false)
@Table( "user")public class User {private String username;private String password;}
数据库建表（user)
com.example.mapper.UserMapper
@Mapper
public interface UserMapper extends BaseMapper<User> {@Select(value = "select u.username,u.password from user u where u.username=#{username}")User findUserByName(@Param("username") String username);}
com.example.controller.UserController
@Controller
@RequestMapping("user")
public class UserController {@Autowiredprivate UserMapper userMapper;@RequestMapping("/register")public String register(User user, Model m) {if (user.getUsername()!=null&&userMapper.findUserByName(user.getUsername()) == null) {//判断用户是否已经存在if (!user.getUsername().isEmpty()) {//注册的时候，用户名不能为空if (!user.getPassword().isEmpty()) {//注册 的时候,密码不能为空*/userMapper.insert(user);return "html/login";} else {m.addAttribute("msg", "用户名已经存在！");return "html/register";}} else {m.addAttribute("msg", "用户名不能为空！");return "html/register";}} else {m.addAttribute("msg", "密码不能为空！");return "html/register";}}@RequestMapping("/login" )public String login( User user, Model m){User exitUser=userMapper.findUserByName(user.getUsername());if(user.getUsername()==null||user.getUsername().isEmpty()){m.addAttribute("msg","用户名不能为空");return "html/login";}if(user.getPassword()==null||user.getPassword().isEmpty()){m.addAttribute("msg","密码不能为空");return "html/login";}if(exitUser==null){m.addAttribute("msg","该用户未注册");return "html/login";}if(!user.getPassword().equals(exitUser.getPassword())){m.addAttribute("msg","用户输入的密码有误");return "html/login";}else{m.addAttribute("msg","登录成功");return "html/success";}}}
注册逻辑：
1.判断要创建的用户在数据库是否存在，如果不存在就注册
2.注册的时候用户名不能为空
3.注册的时候密码不能为空
登录逻辑：
1.判断要登录的用户在数据库是否存在，如果存在就登录
2.登录的时候，输入的密码要与数据库里对应的用户的密码保持一致
3.登录的时候，输入用户名与密码不能为空
application.properities
spring.datasource.url=jdbc:mysql://localhost:3306/springboot?serverTimezone=GMT spring.datasource.username=root spring.datasource.password=1234
pom.xml
<?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd"><modelVersion>4.0.0</modelVersion><parent><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-parent</artifactId><version>2.5.0</version><relativePath/> <!-- lookup parent from repository --></parent><groupId>com.example</groupId><artifactId>register-login</artifactId><version>0.0.1-SNAPSHOT</version><name>register-login</name><description>register-login</description><properties><java.version>1.8</java.version></properties><dependencies><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-web</artifactId></dependency><dependency><groupId>com.mysql</groupId><artifactId>mysql-connector-j</artifactId><version>8.0.33</version><scope>runtime</scope></dependency><dependency><groupId>org.projectlombok</groupId><artifactId>lombok</artifactId><optional>true</optional></dependency><dependency><groupId>com.mybatis-flex</groupId><artifactId>mybatis-flex-spring-boot-starter</artifactId><version>1.6.4</version></dependency><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-test</artifactId><scope>test</scope></dependency><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-thymeleaf</artifactId></dependency><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-devtools</artifactId><optional>true</optional></dependency><dependency><groupId>com.mybatis-flex</groupId><artifactId>mybatis-flex-spring-boot-starter</artifactId><version>1.6.4</version></dependency><dependency><groupId>com.mybatis-flex</groupId><artifactId>mybatis-flex-spring-boot-starter</artifactId><version>1.6.4</version></dependency><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-data-jpa</artifactId></dependency></dependencies><build><plugins><plugin><groupId>org.springframework.boot</groupId><artifactId>spring-boot-maven-plugin</artifactId><configuration><fork>true</fork><excludes><exclude><groupId>org.projectlombok</groupId><artifactId>lombok</artifactId></exclude></excludes></configuration></plugin></plugins></build></project>
调试：
注册：
如果注册的用户在数据库中不存在，且注册的时候，用户名与密码都不为空，则跳转到
登录界面，反之，任意一个条件都不满足的话就不会跳转到登录界面
登录：
如果登录的用户在数据库中存在，且登录的时候，用户名不为空，密码不为，则跳转到
成功界面（success.html),反之，任意一个条件都不满足的话就不会跳转到成功界面。
相关文章：
springboot+html实现简单注册登录
前端： register.html <!DOCTYPE html> <html lang"en" > <head><meta charset"UTF-8"><title>register</title><link rel"stylesheet" type"text/css" href"/css/style.css&…...
ESP32网络开发实例-Web控制8路继电器
Web控制8路继电器 文章目录 Web控制8路继电器1、继器器介绍2、软件准备3、硬件准备4、代码实现4.1 单路继电器控制灯泡4.2 Web控制8路继电器将继电器与 ESP32 一起使用是远程控制交流家用电器的好方法。 本文介绍如何使用 ESP32 控制继电器模块。 我们将了解继电器模块的工作原…...
Flutter ☞ 变量
在Flutter中，变量分为两种类型 弱类型强类型 弱类型 var 如果没有初始值，可以变成任何类型 var a; // var a ; // 一旦赋值，就确定类型，不能随意改动 a abc; a 123; a true; a {key: 123}; a [abc];print(a)Object 动…...
冲刺十五届蓝桥杯P0006平面切分
文章目录 题目思路代码总结 题目 平面切分 思路 这道题是一个思维题把，之前没有接触过平面几何的知识，做起来感觉还是比较难的，用到的set集合和自己创建一个类 首先我们知道，一根直线A是可以将平面切分成两块的，如…...
mac电脑文献管理 EndNote 21最新 for Mac
EndNote 21 Mac版不仅能够快速有效的的帮助用户管理自己的文献，而且还可以用来创建个人参考文献库，添加各种文本，图像，连接，表格等等内容！ - 搜索数百个在线资源以获取参考和PDF - 只需点击一下即可查找参…...
vue使用pdf-dist实现pdf预览以及水印
vue使用pdf-dist实现pdf预览以及水印 一.使用pdf-dist插件将PDF文件转换为一张张canvas图片 npm install pdf-dist二.页面引入插件 const pdfJS require("pdfjs-dist"); pdfJS.GlobalWorkerOptions.workerSrc require("pdfjs-dist/build/pdf.worker.entry&…...
[Python进阶] 操纵键盘：Pynput
6.7 操纵键盘：Pynput 6.7.1 press、release 按下或释放某个按键。 from pynput.keyboard import Controller, Keykeyboard Controller() # 按下并释放f keyboard.press(f) keyboard.release(f) # 按下组合按键：alt tab keyboard.press(Key.alt) key…...
购药不烦恼：线上购药小程序的快捷方式
在这个数字化时代，线上购药小程序的快捷方式正在改变着我们购药的方式。本文将介绍如何通过使用Python和Flask框架创建一个简单的线上购药小程序的原型，为用户提供购药的便利和快捷体验。 安装和设置 首先，确保你已经安装了Python和Flask。…...
10.17课上（七段显示器，递归异或与电路）
异或的递归与数电实现 用二选一选择器实现异或函数 在异或当中，如果有一项为0，就可以把那一项消掉；如果有一项为1，就是把剩下的所有项运算完的结果取反 （由此在算法当中可以采用递归解决） 当w1为0时&…...
maven-plugin-shade 详解
一、介绍 [1] This plugin provides the capability to package the artifact in an uber-jar, including its dependencies and to shade - i.e. rename - the packages of some of the dependencies. maven-plugin-shade 插件提供了两个能力： 把整个项目…...
cocosCreator 之 3.x使用NodePool对象池和封装
版本： cocosCreator 3.4.0 语言： TypeScript 环境： Mac NodePool 在项目中频繁的使用instantiate和node.destory对性能有很大的耗费，比如飞机射击中的子弹使用和销毁。 因此官方提供了NodePool，它被作为管理节点对象…...
三、RestClient操作索引库与文档
文章目录 三、RestClient操作索引库与文档3.1 操作索引库3.2 操作文档结束语 三、RestClient操作索引库与文档 ES官方提供了各种不同语言的客户端，用来操作ES。这些客户端的本质就是组装DSL语句，通过http请求发送给ES。 官方文档地址: https://www.ela…...
Hadoop3教程（五）：NameNode和SecondaryNameNode
文章目录 （59）NN和2NN的工作机制（60）FsImage镜像文件（61）Edits编辑日志（62）Checkpoint时间设置参考文献 （59）NN和2NN的工作机制 NameNode的数据是存储在磁盘…...
腾讯云我的世界mc服务器多少钱一年？
腾讯云我的世界mc服务器多少钱？95元一年2核2G3M轻量应用服务器、2核4G5M带宽优惠价218元一年、4核8G12M带宽轻量服务器446元一年，云服务器CVM标准型S5实例2核2G优惠价280元一年、2核4G配置服务器748元一年，腾讯云百科txybk.com分享腾讯云我的…...
modelsim实现二选一以及D触发器并仿真
#实验一 二选一 module two_1(in1,in2,cho,out); input[3:0] in1,in2; output[3:0] out; reg[3:0] out; input cho; always* begin if(cho0) outin1; else outin2; end endmodule module two1_test(); …...
直线导轨在喷涂行业中的应用场景
直线导轨因其具有精度高、速度快、刚性强、使用寿命长等特点被广泛应用在各行各种中，其中，在喷涂行业中的应用最为广泛，以下是直线导轨在喷涂行业中的应用场景： 1、平面喷涂：直线导轨可以应用在各种机械加工的平面&…...
纯css+js自制下拉框
前提 因为html的select标签，下拉框自定义程度非常的低，为了贴合而项目ui显示，所以打算自制下拉框 代码 html <div class"pos-rel"><div id"select" class"select get-select"><span class&…...
uniapp在App端如何动态修改原生导航栏？
uniapp在App端如何动态修改原生导航栏？ 文章目录 uniapp在App端如何动态修改原生导航栏？page.json配置修改 buttons 文字修改按钮上的角标设置 searchInput的 focus设置 searchInput的 text 在App端可以通过得到 webview 对象，通过当前 webvi…...
Linux：CPUPower管理器 --- cpufreq解析
一、cpufreq是什么？ cpufreq是Linux内核下的一种功率管理框架，它负责改变CPU的频率，以降低功耗并延长电池寿命。该框架的主要机制是动态调整CPU频率，该频率受限于CPU的负载和功耗。cpufreq能够动态地将频率降低到最低值或最高值&a…...
【嵌入式开发问答】不是普通的嵌入式八股
1. 进程、线程、堆栈、溢出 【问：】 进程的堆栈的物理内存是什么时候分配的？ 堆栈的大小限制是多大？这个限制可以调整吗？ 当堆栈发生溢出后应用程序会发生什么？ 【答：】...
测试微信模版消息推送
进入“开发接口管理”--“公众平台测试账号”，无需申请公众账号、可在测试账号中体验并测试微信公众平台所有高级接口。 获取access_token: 自定义模版消息： 关注测试号：扫二维码关注测试号。 发送模版消息： import requests da…...
在HarmonyOS ArkTS ArkUI-X 5.0及以上版本中，手势开发全攻略：
在 HarmonyOS 应用开发中，手势交互是连接用户与设备的核心纽带。ArkTS 框架提供了丰富的手势处理能力，既支持点击、长按、拖拽等基础单一手势的精细控制，也能通过多种绑定策略解决父子组件的手势竞争问题。本文将结合官方开发文档，…...
Unity | AmplifyShaderEditor插件基础（第七集：平面波动shader）
目录 一、👋🏻前言 二、😈sinx波动的基本原理 三、😈波动起来 1.sinx节点介绍 2.vertexPosition 3.集成Vector3 a.节点Append b.连起来 4.波动起来 a.波动的原理 b.时间节点 c.sinx的处理 四、🌊波动优化…...
Spring是如何解决Bean的循环依赖：三级缓存机制
1、什么是 Bean 的循环依赖 在 Spring框架中，Bean 的循环依赖是指多个 Bean 之间互相持有对方引用，形成闭环依赖关系的现象。 多个 Bean 的依赖关系构成环形链路，例如： 双向依赖：Bean A 依赖 Bean B，同时 Bean B 也依赖 Bean A（A↔B）。链条循环： Bean A → Bean…...
在Ubuntu24上采用Wine打开SourceInsight
1. 安装wine sudo apt install wine 2. 安装32位库支持，SourceInsight是32位程序 sudo dpkg --add-architecture i386 sudo apt update sudo apt install wine32:i386 3. 验证安装 wine --version 4. 安装必要的字体和库（解决显示问题） sudo apt install fonts-wqy…...
20个超级好用的 CSS 动画库
分享 20 个最佳 CSS 动画库。 它们中的大多数将生成纯 CSS 代码，而不需要任何外部库。 1.Animate.css 一个开箱即用型的跨浏览器动画库，可供你在项目中使用。 2.Magic Animations CSS3 一组简单的动画，可以包含在你的网页或应用项目中。 3.An…...
: 一刀斩断视频片头广告)
快刀集(1): 一刀斩断视频片头广告
一刀流：用一个简单脚本，秒杀视频片头广告，还你清爽观影体验。 1. 引子 作为一个爱生活、爱学习、爱收藏高清资源的老码农，平时写代码之余看看电影、补补片，是再正常不过的事。 电影嘛，要沉浸，…...
Qemu arm操作系统开发环境
使用qemu虚拟arm硬件比较合适。 步骤如下： 安装qemu apt install qemu-system安装aarch64-none-elf-gcc 需要手动下载，下载地址：https://developer.arm.com/-/media/Files/downloads/gnu/13.2.rel1/binrel/arm-gnu-toolchain-13.2.rel1-x…...
深度学习之模型压缩三驾马车：模型剪枝、模型量化、知识蒸馏
一、引言 在深度学习中，我们训练出的神经网络往往非常庞大（比如像 ResNet、YOLOv8、Vision Transformer），虽然精度很高，但“太重”了，运行起来很慢，占用内存大，不适合部署到手机、摄…...
一些实用的chrome扩展0x01
简介 浏览器扩展程序有助于自动化任务、查找隐藏的漏洞、隐藏自身痕迹。以下列出了一些必备扩展程序，无论是测试应用程序、搜寻漏洞还是收集情报，它们都能提升工作流程。 FoxyProxy 代理管理工具，此扩展简化了使用代理（如 Burp…...