搭建spring-boot+vue前后端分离框架并实现登录功能

com.github.pagehelper

pagehelper-spring-boot-starter

1.2.5

com.alibaba

druid-spring-boot-starter

1.1.9

org.springframework.boot

spring-boot-maven-plugin

org.mybatis.generator

mybatis-generator-maven-plugin

1.3.2

${basedir}/src/main/resources/generator/generatorConfig.xml

true

true

6、在resources文件夹下删除application.properties文件并添加新的application.yml文件，信息如下

server:

port: 8880 #端口号

spring:

datasource:

name: zksdb #数据库名称

type: com.alibaba.druid.pool.DruidDataSource

#druid相关配置

druid:

#监控统计拦截的filters

filters: stat

driver-class-name: com.mysql.jdbc.Driver

#基本属性

url: jdbc:mysql://127.0.0.1:3306/zksdb?useUnicode=true&characterEncoding=UTF-8&allowMultiQueries=true

username: root

password: 123456

#配置初始化大小/最小/最大

initial-size: 1

min-idle: 1

max-active: 20

#获取连接等待超时时间

max-wait: 60000

#间隔多久进行一次检测，检测需要关闭的空闲连接

time-between-eviction-runs-millis: 60000

#一个连接在池中最小生存的时间

min-evictable-idle-time-millis: 300000

validation-query: SELECT ‘x’

test-while-idle: true

test-on-borrow: false

test-on-return: false

#打开PSCache，并指定每个连接上PSCache的大小。oracle设为true，mysql设为false。分库分表较多推荐设置为false

pool-prepared-statements: false

max-pool-prepared-statement-per-connection-size: 20

该配置节点为独立的节点，有很多同学容易将这个配置放在spring的节点下，导致配置无法被识别

mybatis:

mapper-locations: classpath:mapper/*.xml #注意：一定要对应mapper映射xml文件的所在路径

type-aliases-package: com.winterchen.model # 注意：对应实体类的路径

#pagehelper

pagehelper:

helperDialect: mysql

reasonable: true

supportMethodsArguments: true

params: count=countSql

returnPageInfo: check

7、更改项目启动类

package com.zks.myspringboot;

import org.mybatis.spring.annotation.MapperScan;

import org.springframework.boot.SpringApplication;

import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication

@MapperScan(“com.zks.dao”)

public class MyspringbootApplication {

public static void main(String[] args) {

SpringApplication.run(MyspringbootApplication.class, args);

}

}

8、创建数据库以及表，详情如下

9、使用mybatis generator自动生成代码

配置pom.xml文件中generator插件所需要的配置文件${basedir}/src/main/resources/generator/generatorConfig.xml

信息如下：

<?xml version="1.0" encoding="UTF-8"?>

关于如何查找本地数据库驱动包

file-Project Stricture

如图便是我们需要的地址；

然后点击run-Edit Configurations

添加配置（maven需手动添加）

然后Apply   OK

运行。（注意：同一张表不要多次运行，因为mapper映射文件会生成多次代码）

如图表示没有报错运行代码生成成功。

因为生成的是UserMapper，这里需要改成UserDao（个人喜欢用UserDao）

生成代码如下

User.java

UserMapper（我已改为UserDao）

10、注意MyspringbootApplication文件的路径位置，需如图所示

11、创建UserController、UserService、UserServiceImpl，MyResult详情如下

MyResult

UserController

controller层传递对象参数时记得前面加@RequestBody注解

UserService

UserServiceImpl

此处可能会报错，但是并不影响，若想清除此处报错如下图所示

错误就没了

启动项目无报错，后台搭建成功

三、搭建前端vue部分（前提安装node环境）

打开VSCode工作目录下，输入vue init webpack-simple 项目名称，回车，等待下载模板

如图下载完毕

项目名称、描述、下依赖、启动项目完毕

浏览器localhost:8080看到vue表示成功

最后

自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。

深知大多数初中级Android工程师，想要提升技能，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。

因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点！不论你是刚入门Android开发的新手，还是希望在技术上不断提升的资深开发者，这些资料都将为你打开新的学习之门！

如果你觉得这些内容对你有帮助，需要这份全套学习资料的朋友可以戳我获取！！

由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！
摸索成长，自己不成体系的自学效果低效漫长且无助。**

因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

[外链图片转存中…(img-f9RkWsNU-1715254678757)]

[外链图片转存中…(img-THvdR7kH-1715254678758)]

[外链图片转存中…(img-BV2imFGL-1715254678758)]

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点！不论你是刚入门Android开发的新手，还是希望在技术上不断提升的资深开发者，这些资料都将为你打开新的学习之门！

如果你觉得这些内容对你有帮助，需要这份全套学习资料的朋友可以戳我获取！！

由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！