1、项目需求
项目结构参考
controller:控制层
entity:实体层
repository:数据层
前端页面参考
2、实现效果参考
注册页面：http://localhost:8080/register
默认管理员账号：你的名字 / 111
3、步骤提示
新建模块
引入5个依赖
项目引入依赖的作用
4、详细代码
4.1 UserController（账户名待补充）
package com.itheima.controller;
import com.itheima.entity.User;
import com.itheima.repository.UserRepository;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
@Controller
public class UserController {
@Autowired
private UserRepository userRepository;
// 默认管理员
private final String adminUser = " "; // ********************输入你自己的账户信息
private final String adminPass = "111";
// 登录页面
@GetMapping("/")
public String showLoginPage() {
return "login";
}
// 登录逻辑
@PostMapping("/login")
public String login(@RequestParam String username,
@RequestParam String password,
Model model) {
// 管理员登录
if ("xy".equals(username) && "111".equals(password)) {
model.addAttribute("username", username); // ✅ 添加用户名到模型
return "success";
}
// 普通用户登录
User user = userRepository.findByUsername(username);
if (user != null && user.getPassword().equals(password)) {
model.addAttribute("username", user.getUsername()); // ✅ 添加用户名
return "success";
}
model.addAttribute("error", "用户名或密码错误！");
return "login";
}
// 注册页面
@GetMapping("/register")
public String showRegisterPage() {
return "register";
}
// 注册逻辑
@PostMapping("/register")
public String register(@RequestParam String username,
@RequestParam String password,
Model model) {
if (username.equals(adminUser)) {
model.addAttribute("error", "管理员账号不可注册！");
return "register";
}
if (userRepository.findByUsername(username) != null) {
model.addAttribute("error", "该用户名已存在！");
return "register";
}
User newUser = new User();
newUser.setUsername(username);
newUser.setPassword(password);
userRepository.save(newUser);
model.addAttribute("msg", "注册成功，请返回登录！");
return "register";
}
}4.2 User
package com.itheima.entity;
import jakarta.persistence.*; // JPA 注解，用于定义实体类和数据库映射
import lombok.Data; // Lombok 注解，自动生成 getter/setter/toString 等方法
/**
* 用户实体类，对应数据库中的 users 表
*/
@Data // 自动生成 getter、setter、toString、equals、hashCode 等方法
@Entity // 标记这是一个 JPA 实体类，Spring Boot 会将其映射到数据库表
@Table(name = "users") // 指定对应的数据库表名为 "users"
public class User {
@Id // 主键
@GeneratedValue(strategy = GenerationType.IDENTITY) // 自增策略，数据库自动生成主键
private Long id; // 用户ID，唯一标识
@Column(nullable = false, unique = true) // 映射到数据库列，不能为空且唯一
private String username; // 用户名
@Column(nullable = false) // 映射到数据库列，不能为空
private String password; // 用户密码
}4.3 UserRepository
package com.itheima.repository;
import com.itheima.entity.User; // 导入User实体类
import org.springframework.data.jpa.repository.JpaRepository; // 导入Spring Data JPA的Repository接口
/**
* 用户仓库接口，用于操作数据库中的 users 表
* JpaRepository 提供了常用的增删改查方法
* 泛型 <User, Long> 表示操作的实体类是 User，主键类型是 Long
*/
public interface UserRepository extends JpaRepository<User, Long> {
/**
* 根据用户名查找用户
* Spring Data JPA 会根据方法名自动生成对应的查询语句
*
* @param username 用户名
* @return User 对象，如果找不到返回 null
*/
User findByUsername(String username);
}4.4 login.html（前端界面-供参考）
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>用户登录</title>
<style>
body {
font-family: Arial, sans-serif;
background: linear-gradient(135deg, #6a11cb, #2575fc); /* 渐变背景 */
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
margin: 0;
}
.login-box {
background-color: rgba(255, 255, 255, 0.95);
padding: 40px;
border-radius: 12px;
box-shadow: 0 8px 20px rgba(0,0,0,0.2);
text-align: center;
width: 320px;
}
h2 {
margin-bottom: 30px;
color: #333;
font-size: 28px;
}
input {
width: 90%;
padding: 10px;
margin: 10px 0;
border: 1px solid #ccc;
border-radius: 6px;
font-size: 16px;
}
button {
width: 95%;
padding: 10px;
margin: 10px 0;
border: none;
border-radius: 6px;
background-color: #2575fc;
color: white;
font-size: 16px;
cursor: pointer;
transition: 0.3s;
}
button:hover {
background-color: #6a11cb;
}
.register-btn {
background-color: #fff;
color: #2575fc;
border: 1px solid #2575fc;
}
.register-btn:hover {
background-color: #2575fc;
color: white;
}
.error {
color: red;
font-size: 14px;
}
</style>
</head>
<body>
<div class="login-box">
<h2>用户登录</h2>
<form th:action="@{/login}" method="post">
<input type="text" name="username" placeholder="用户名" required/><br/>
<input type="password" name="password" placeholder="密码" required/><br/>
<button type="submit">登录</button>
</form>
<form th:action="@{/register}" method="get">
<button type="submit" class="register-btn">注册</button>
</form>
<p th:text="${error}" class="error"></p>
</div>
</body>
</html>4.5 register.html（前端界面-供参考）
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>用户注册</title>
<style>
body {
font-family: Arial, sans-serif;
background: linear-gradient(135deg, #ff9a9e, #fad0c4);
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
margin: 0;
}
.register-box {
background-color: rgba(255, 255, 255, 0.95);
padding: 40px;
border-radius: 12px;
box-shadow: 0 8px 20px rgba(0,0,0,0.2);
text-align: center;
width: 320px;
}
h2 {
margin-bottom: 30px;
color: #333;
font-size: 28px;
}
input {
width: 90%;
padding: 10px;
margin: 10px 0;
border: 1px solid #ccc;
border-radius: 6px;
font-size: 16px;
}
button {
width: 95%;
padding: 10px;
margin: 10px 0;
border: none;
border-radius: 6px;
background-color: #ff6a88;
color: white;
font-size: 16px;
cursor: pointer;
transition: 0.3s;
}
button:hover {
background-color: #ff99ac;
}
.back-btn {
background-color: #fff;
color: #ff6a88;
border: 1px solid #ff6a88;
}
.back-btn:hover {
background-color: #ff6a88;
color: white;
}
.error {
color: red;
font-size: 14px;
}
.msg {
color: green;
font-size: 14px;
}
</style>
</head>
<body>
<div class="register-box">
<h2>用户注册</h2>
<form th:action="@{/register}" method="post">
<input type="text" name="username" placeholder="用户名" required/><br/>
<input type="password" name="password" placeholder="密码" required/><br/>
<button type="submit">注册</button>
</form>
<form th:action="@{ / }" method="get">
<button type="submit" class="back-btn">返回登录</button>
</form>
<p th:text="${error}" class="error"></p>
<p th:text="${msg}" class="msg"></p>
</div>
</body>
</html>4.6 success.html（前端界面-供参考）
<!--<!DOCTYPE html>-->
<!--<html>-->
<!--<head>-->
<!-- <title>登录成功</title>-->
<!-- <style>-->
<!-- body { text-align: center; font-family: Arial, sans-serif; margin-top: 100px; }-->
<!-- h1 { font-size: 32px; color: green; }-->
<!-- </style>-->
<!--</head>-->
<!--<body>-->
<!--<h1>🎉 恭喜你！登录成功 🎉</h1>-->
<!--</body>-->
<!--</html>4.7 application.properties
# H2 ???
spring.datasource.url=jdbc:h2:mem:testdb
spring.datasource.driverClassName=org.h2.Driver
spring.datasource.username=sa
spring.datasource.password=
# JPA ??
spring.jpa.hibernate.ddl-auto=update
spring.jpa.show-sql=true
spring.jpa.properties.hibernate.format_sql=true
# Thymeleaf ??
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.cache=false4.8 pom文件仅供参考
<?xml version="1.0" encoding="UTF-8"?>
<!-- Maven 项目对象模型(POM)文件，用于定义项目的依赖、构建方式和插件等 -->
<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">
<!-- POM模型版本 -->
<modelVersion>4.0.0</modelVersion>
<!-- 父项目，Spring Boot 提供的 starter-parent，管理版本依赖和插件配置 -->
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>3.5.6</version>
<relativePath/> <!-- 从仓库中查找父POM -->
</parent>
<!-- 项目基本信息 -->
<groupId>com.itheima</groupId> <!-- 项目组ID，类似命名空间 -->
<artifactId>springboot-login-demo</artifactId> <!-- 项目ID -->
<version>0.0.1-SNAPSHOT</version> <!-- 项目版本，SNAPSHOT 表示开发中版本 -->
<name>springboot-login-demo</name> <!-- 项目名称 -->
<description>springboot-login-demo</description> <!-- 项目描述 -->
<url/> <!-- 项目主页URL，可选 -->
<!-- 许可证信息，可选 -->
<licenses>
<license/>
</licenses>
<!-- 开发者信息，可选 -->
<developers>
<developer/>
</developers>
<!-- SCM（源代码管理）信息，可选 -->
<scm>
<connection/>
<developerConnection/>
<tag/>
<url/>
</scm>
<!-- 项目属性 -->
<properties>
<java.version>21</java.version> <!-- 指定使用的Java版本 -->
</properties>
<!-- 项目依赖 -->
<dependencies>
<!-- Spring Data JPA，用于数据库操作 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-data-jpa</artifactId>
</dependency>
<!-- Thymeleaf 模板引擎，用于渲染HTML页面 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<!-- Spring Web，用于开发Web应用和REST接口 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<!-- H2 内存数据库，仅用于开发和测试 -->
<dependency>
<groupId>com.h2database</groupId>
<artifactId>h2</artifactId>
<scope>runtime</scope> <!-- 仅在运行时使用 -->
</dependency>
<!-- Spring Boot 测试依赖 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope> <!-- 仅在测试时使用 -->
</dependency>
<!-- Lombok 简化Java代码，例如自动生成Getter/Setter -->
<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<optional>true</optional> <!-- 可选依赖，不影响构建 -->
</dependency>
</dependencies>
<!-- 构建配置 -->
<build>
<plugins>
<!-- Spring Boot Maven 插件，用于打包和运行Spring Boot应用 -->
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
</plugins>
</build>
</project>
扫一扫
1302
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
