Spring Boot +Vue 项目实战笔记(三):数据库的引入
这一篇的主要内容是引入数据库并实现通过数据库验证用户名与密码。
一、引入数据库
之前说过数据库的采用是 MySQL,算是比较主流的选择,从性能和体量等方面都比较优秀,当然也有一些弊端,但数据库不是我们这里讨论的重点,暂时能用就行。
1.安装数据库
我的 MySQL 版本是 5.7,官方下载页面是
https://dev.mysql.com/downloads/mysql/5.7.html#downloads
安装教程我随便搜了一篇,可以参考
https://blog.csdn.net/ma524654165/article/details/77855431
目前最新的版本是 8.0,也可以下载最新版本,使用最新版本需要做三处修改:
一、修改后端项目 pom.xml 的 mysql 依赖配置
二、为数据库设置一个长密码,而不能用简单的 admin 等
三、修改 mysql 的时区为 +8:00
操作 MySQL 有很多种方式,可以用官方的 Command Line Client、Workbench,也可以用其它的一些界面化软件,比如 Navicat 等。如果之前没有接触过数据库,可以先用 Navicat,比较直观。安装方法参照这个博文:
https://blog.csdn.net/wypersist/article/details/79834490
我真是个好人啊,到处推荐别人的文章。。。
2.使用 Navicat 创建数据库与表
下面的内容主要针对初次使用数据库的读者,有经验的读者可以直接执行下面的 sql 语句,记得先新建一个数据库,名称最好叫 white_jotter,方便以后的配置。
-- ----------------------------
-- Table structure for user
-- ----------------------------
DROP TABLE IF EXISTS `user`;
CREATE TABLE `user` (
`id` int(11) unsigned NOT NULL AUTO_INCREMENT,
`username` varchar(255) DEFAULT NULL,
`password` varchar(255) DEFAULT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=2 DEFAULT CHARSET=utf8;
-- ----------------------------
-- Records of user
-- ----------------------------
INSERT INTO `user` VALUES ('1', 'admin', '123');
按照上面贴出来的教程安装完 MySQL 和 Navicat 后,打开 Navicat,点击连接 -> MySQL,新建数据库连接
在弹出的界面中配置相关信息,如果之前安装数据库是按照上面的教程来的话,连接名随便起一个,主机名、端口、用户名都不用修改,密码是 root,其实我习惯设置成 admin,但看上面的教程是 root,这个项目无所谓,但记住实际的项目千万不要设置这么简单的密码,有不少企业的数据库密码还真就是 admin,被脱裤了才反应过来。。。
输入之后可以点击测试连接按钮测试一下,然后确定。
双击在左侧出现的连接 WJ,就打开了这个连接。安装完 MySQL 会有几个默认的数据库,这些不要动,我们在连接(即 WJ)上右键新建一个数据库,命名为 white_jotter,字符集选择 UTF-8,排序规则选择 utf8_general_ci 即可。
创建之后左侧就会出现一个名为 white_jotter 的数据库,双击它,点击“表”,然后点击“新建表”按钮,就进入了表设计界面。
为了完成登录验证,我们需要一个用户表,一般命名为 user,表里面暂定设计 3 个字段,分别是 id、username、password。
表设计界面默认有一个“栏位”,我们可以在这个栏位中加入第一个需要的字段,即用户的 id,其设置如下
箭头指向的地方不要漏了。最后那把小钥匙的意思是主键,可以点击上面的主键按钮或者直接点击这个空白的栏位设置。
然后再添加第二、三个栏位,配置如下:

最后点击保存,把表命名为 user,这样我们就有了第一张表。之后也可以在对象界面中选中表并点击“设计表”按钮重新设计。
接下来,我们双击 user 表,进入表中,添加一行用户信息,id 为 1,账号是 admin,密码是 123,也可以随便按照自己喜好添加。
可以看到下面自动执行了一条 SQL 语句。这里多说一句,真实的项目中,用户信息可不能这么存,直接把账号密码写上去太危险了,一般的做法是存储密码等信息的 hash 值。
OK,到现在为止,数据库的操作就完成了。
二、使用数据库验证登录
上一篇中我们直接在后端的控制器中用如下语句判断了用户名和密码的正确性:
if (!Objects.equals("admin", username) || !Objects.equals("123456", requestUser.getPassword())) {
String message = "账号密码错误";
System.out.println("test");
return new Result(400);
} else {
return new Result(200);
}
使用数据库验证的逻辑其实也类似,大概是如下过程:
第一步,获得前端发送过来的用户名和密码信息
第二步,查询数据库中是否存在相同的一对用户名和密码
第三步,如果存在,返回成功代码(200),如果不存在,返回失败代码(400)
这里的语句很简单,但在修改之前还需要一些准备工作。
1.项目相关配置
打开我们的后端项目 wj,首先修改 pom.xml,配置我们需要的依赖。为了方便以后的开发,我直接把我的配置粘贴上来,大家可以把原来的所有配置删除掉,再粘贴我的。
<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 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>com.evan</groupId>
<artifactId>wj</artifactId>
<version>0.0.1-SNAPSHOT</version>
<name>wj</name>
<description>White Jotter - Your Mind Palace</description>
<packaging>war</packaging>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.1.1.RELEASE</version>
<relativePath/> <!-- lookup parent from repository -->
</parent>
<dependencies>
<!-- springboot web -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<!-- springboot tomcat 支持 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-tomcat</artifactId>
<scope>provided</scope>
</dependency>
<!-- 热部署 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-devtools</artifactId>
<optional>true</optional>
</dependency>
<!-- jpa-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-data-jpa</artifactId>
</dependency>
<!-- redis -->
<dependency>
<groupId>org.springframework.boot