springboot+mysql简单的登录系统

发布时间 2023-08-04 14:36:55作者: 俟礼

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).

image-20230804141049502

image-20230804142038725

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;

        }
}

效果展示: