springboot+mysql简单的登录系统
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.7.14</version>
<relativePath/> <!-- lookup parent from repository -->
</parent>
<groupId>com.example</groupId>
<artifactId>demo3</artifactId>
<version>0.0.1-SNAPSHOT</version>
<name>demo3</name>
<description>Demo project for Spring Boot</description>
<properties>
<java.version>1.8</java.version>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>druid</artifactId>
<version>1.1.10</version>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.mybatis.spring.boot</groupId>
<artifactId>mybatis-spring-boot-starter</artifactId>
<version>2.3.1</version>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-devtools</artifactId>
<scope>runtime</scope>
<optional>true</optional>
</dependency>
<dependency>
<groupId>com.mysql</groupId>
<artifactId>mysql-connector-j</artifactId>
<scope>runtime</scope>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-configuration-processor</artifactId>
<optional>true</optional>
</dependency>
<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<optional>true</optional>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
</dependency>
<dependency>
<groupId>org.mybatis.spring.boot</groupId>
<artifactId>mybatis-spring-boot-starter-test</artifactId>
<version>2.3.1</version>
<scope>test</scope>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
<configuration>
<excludes>
<exclude>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
</exclude>
</excludes>
</configuration>
</plugin>
</plugins>
</build>
</project>
mysql的准备
create table `user`(#建表时user必须加单引号,不然会报错
username VARCHAR(20),
password VARCHAR(20)
)
insert into `user` values('ddd','ddd');
insert into `user` values('admin','admin');
select * from user where 'username=ddd' and'password=ddd'
#必须加单引号,不然报错
select * from user where username=#{name} and password=#{password} #正确操作
select * from user where 'username=#{name}' and 'password=#{password}' #错误操作
#经过实验,有没有单引号,这两个效果不相同。不然会报错如下
#Parameter index out of range (1 > number of parameters, which is 0).
application.yml
spring:
datasource:
driver-class-name: com.mysql.cj.jdbc.Driver
url: jdbc:mysql://localhost:3306/demo?characterEncoding=utf8&useUnicode=true
username: root
password: 12345678
#我选择demo数据库,创建user表,其中两个字段,没有特殊处理。
login.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<input type="text" placeholder="输入用户名" id="username">
<br/>
<input type="password" placeholder="输入密码" id="pwd">
<br>
<button id="btn" onclick="login()">登录</button>
</body>
<script>
function login(){
const name=document.getElementById("username").value
const password=document.getElementById("pwd").value
if(!name || !password){
alert ("请输入账号和密码")
return
}
fetch('/login',{
method:"POST",
headers:{
"Content-Type": "application/json;charset=UTF-8"},
body:JSON.stringify({name:name,password:password})
}).then(res => res.text()).then(res =>{
console.log(res)
if(res){
let json=JSON.parse(res)
alert("登录成功")
location.href='/'
} else{
alert("账号密码错误")
}
})
}
</script>
</html>
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>首页
</body>
</html>
UserMapper.java
package com.example.demo.mapper;
import com.example.demo.User;
import org.apache.ibatis.annotations.Param;
import org.apache.ibatis.annotations.Select;
public interface UserMapper {
@Select("select * from user where username=#{name} and password=#{password}")
User getUserByNameAndPassword(@Param("name") String name, @Param("password") String password);
}
demo3application.java
package com.example.demo;
import org.mybatis.spring.annotation.MapperScan;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
@SpringBootApplication
@MapperScan("com.example.demo.mapper")
public class Demo3Application {
public static void main(String[] args) {
SpringApplication.run(Demo3Application.class, args);
}
}
User.java
package com.example.demo;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import lombok.ToString;
@Data
@NoArgsConstructor
@AllArgsConstructor
@ToString
public class User {
private String name;
private String password;
}
UserControl.java
package com.example.demo;
import com.example.demo.mapper.UserMapper;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RestController;
import javax.annotation.Resource;
@RestController
public class UserController {
@Resource
UserMapper usermapper;
@PostMapping("/login")
public User login(@RequestBody User user){
User userdb=usermapper.getUserByNameAndPassword(user.getName(),user.getPassword());
return userdb;
}
}
效果展示: