Eureka+springboot + vue前后端分离框架并实现登录功能

1.首先是创建springboot后台项目

Next然后选择web依赖就可以了，然后在创建好的项目文件中的pom文件中添加一下依赖

<?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.0.6.RELEASE</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>
    <groupId>com.sly</groupId>
    <artifactId>springboot</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <name>springboot</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-web</artifactId>
        </dependency>
        <dependency>
            <groupId>org.mybatis.spring.boot</groupId>
            <artifactId>mybatis-spring-boot-starter</artifactId>
            <version>1.3.2</version>
        </dependency>
        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <scope>runtime</scope>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>
    </dependencies>

    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
            </plugin>
        </plugins>
    </build>

</project>

 将application.properties文件后缀改为yml。（我喜欢用，不改的话自行改为properties格式）

server:
  port: 8762              #指定服务端口号
spring:
  datasource:
    username: root
    password: 123456
    url: jdbc:mysql://localhost:3306/learnmysql?serverTimezone=UTC&characterEncoding=utf8

数据库建表还是要有的。 表结构用工具生成一下就ok了。或者自己建。

SET NAMES utf8mb4;
SET FOREIGN_KEY_CHECKS = 0;
DROP TABLE IF EXISTS `myuser`;
CREATE TABLE `myuser`  (
  `uid` int(10) NOT NULL AUTO_INCREMENT,
  `name` varchar(20) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
  `password` varchar(10) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
  `age` int(11) NULL DEFAULT NULL,
  PRIMARY KEY (`uid`) USING BTREE
) ENGINE = InnoDB AUTO_INCREMENT = 62 CHARACTER SET = utf8 COLLATE = utf8_general_ci ROW_FORMAT = Dynamic;

INSERT INTO `myuser` VALUES (1, '孙悟空', '123456', NULL);
INSERT INTO `myuser` VALUES (2, '沙悟净', '123456', NULL);
INSERT INTO `myuser` VALUES (42, '唐僧', '23213', NULL);
INSERT INTO `myuser` VALUES (43, '猪八戒', '123456', NULL);

SET FOREIGN_KEY_CHECKS = 1;

可以使用mybatis-generate自动生成mapper.xml，实体类，对应的mapper接口。或者手动创建。

 

 测试一下成果插入一条数据。

直接去看源码吧！这个springboot搭建有点老生常谈了！

链接：https://pan.baidu.com/s/1QGgPOmVfgU4xl3CYeo-37w 
提取码：3nr0 
 

然后就是vue前端的创建：自行百度。

项目源码https://pan.baidu.com/s/1z2ol4fFTzxHSVV6NPOdrVw  。我发现我太懒了哈哈。懒得截图了。

 

最后给展示一下前端调用后端数据

上面测试类中添加的账号 ：小白龙 密码：789

密码改为123登陆失败。或者改为其他数据库找不到的账户和密码都是无法登陆的。

 

 此文仅仅为本人学习记录，不作为指导他人。请勿喷！如有问题请评论指正。