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. 进程、线程、堆栈、溢出 【问：】 进程的堆栈的物理内存是什么时候分配的？ 堆栈的大小限制是多大？这个限制可以调整吗？ 当堆栈发生溢出后应用程序会发生什么？ 【答：】...
超短脉冲激光自聚焦效应
前言与目录 强激光引起自聚焦效应机理 超短脉冲激光在脆性材料内部加工时引起的自聚焦效应，这是一种非线性光学现象，主要涉及光学克尔效应和材料的非线性光学特性。 自聚焦效应可以产生局部的强光场，对材料产生非线性响应，可能…...
黑马Mybatis
Mybatis 表现层：页面展示 业务层：逻辑处理 持久层：持久数据化保存 在这里插入图片描述 Mybatis快速入门 
【JVM】- 内存结构
引言 JVM：Java Virtual Machine 定义：Java虚拟机，Java二进制字节码的运行环境好处： 一次编写，到处运行自动内存管理，垃圾回收的功能数组下标越界检查（会抛异常，不会覆盖到其他代码…...
Auto-Coder使用GPT-4o完成：在用TabPFN这个模型构建一个预测未来3天涨跌的分类任务
通过akshare库，获取股票数据，并生成TabPFN这个模型 可以识别、处理的格式，写一个完整的预处理示例，并构建一个预测未来 3 天股价涨跌的分类任务 用TabPFN这个模型构建一个预测未来 3 天股价涨跌的分类任务，进行预测并输…...
ESP32 I2S音频总线学习笔记（四）： INMP441采集音频并实时播放
简介 前面两期文章我们介绍了I2S的读取和写入，一个是通过INMP441麦克风模块采集音频，一个是通过PCM5102A模块播放音频，那如果我们将两者结合起来，将麦克风采集到的音频通过PCM5102A播放，是不是就可以做一个扩音器了呢…...
CocosCreator 之 JavaScript/TypeScript和Java的相互交互
引擎版本： 3.8.1 语言： JavaScript/TypeScript、C、Java 环境：Window 参考：Java原生反射机制 您好，我是鹤九日！ 回顾 在上篇文章中：CocosCreator Android项目接入UnityAds 广告SDK。 我们简单讲…...
C++ Visual Studio 2017厂商给的源码没有.sln文件 易兆微芯片下载工具加开机动画下载。
1.先用Visual Studio 2017打开Yichip YC31xx loader.vcxproj，再用Visual Studio 2022打开。再保侟就有.sln文件了。 易兆微芯片下载工具加开机动画下载 ExtraDownloadFile1Info.\logo.bin|0|0|10D2000|0 MFC应用兼容CMD 在BOOL CYichipYC31xxloaderDlg::OnIni…...
Maven 概述、安装、配置、仓库、私服详解
目录 1、Maven 概述 1.1 Maven 的定义 1.2 Maven 解决的问题 1.3 Maven 的核心特性与优势 2、Maven 安装 2.1 下载 Maven 2.2 安装配置 Maven 2.3 测试安装 2.4 修改 Maven 本地仓库的默认路径 3、Maven 配置 3.1 配置本地仓库 3.2 配置 JDK 3.3 IDEA 配置本地 Ma…...
初学 pytest 记录
安装 pip install pytest用例可以是函数也可以是类中的方法 def test_func():print()class TestAdd: # def __init__(self): 在 pytest 中不可以使用__init__方法 # self.cc 12345 pytest.mark.api def test_str(self):res add(1, 2)assert res 12def test_int(self):r…...
技术栈RabbitMq的介绍和使用
目录 1. 什么是消息队列？2. 消息队列的优点3. RabbitMQ 消息队列概述4. RabbitMQ 安装5. Exchange 四种类型5.1 direct 精准匹配5.2 fanout 广播5.3 topic 正则匹配 6. RabbitMQ 队列模式6.1 简单队列模式6.2 工作队列模式6.3 发布/订阅模式6.4 路由模式6.5 主题模式…...