首页 > 其他分享 >Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建

时间:2023-02-21 13:00:50浏览次数:59  
标签:wiki 10 process Spring oss Boot com image

前言:

接下来又得被迫开启新的一门课程的学习了,上半年末尾淘汰又即将拉开序幕【已经记不清经历过多少次考试了】,需要去学习其它领域的技术作为考试内容,我选了spring boot相关技术,所以。。总之作为男人,不能轻易言败,尽力而为,抱怨解决不了任何问题,逆境使人进步,我坚信这点,

效果:

在正式学习之前,需要让自己有动力坚持把它学完,所以提前知道一下最终做出来的产品效果会比较好,这块可以点击此链接进行体验:​​http://wiki.courseimooc.com/​​,项目比较“简单”,当然你要将它做出来也不是那么简单的,对于一个纯小白来说,用业务简单一点的项目进行学习反倒更好,因为让你坚持的动力更足,其实springboot这块的入门在之前android架构中接触过:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_02

这也是为啥我选择用它进行考试的原因,压力小点,多少有一点点小基础,不过,一年过去了,基本上又忘得差不多了,因为我平常的工作是移动开发。。所以正好也可以利用这次公司考试的机会再对它进行一个巩固扩展,先简单贴几张效果图:

1、首页:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_03

2、用户管理:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_04

3、电子书管理:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_05

对于纯小白的我来说,要真的前后端都自己搞,有点难~~所以接下来准备攻克它。

新建SpringBoot项目:

接下来就直接开始创建项目了,没有啥好说的,打开IntelliJ IDEA:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_06

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_07

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_08

接下来SpringBoot工程就创建好了,其中为了保证跟课程的版本一致,这里先来将springboot的版本号改一下:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_09

其中它有一个启动类,直接点击运行就可以了:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring boot_10

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_11

接下来在浏览器访问一下:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_12

如果能看到它说明SpringBoot的工程就创建成功了,由于目前还木有写相关的接口,所以报404了。

想当初学习“SSH”来搭建后台项目时是多么的麻烦,现在用Spring Boot来搭建,真是秒秒钟,其中连tomcat服务器都给内嵌好了,真是方便:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_13

项目初始配置:

在正式进行Spring boot开发之前,先有一些项目配置相关的工作需要做一下,下面一一来看一下。

编码配置:

需要将所有的编码都改成utf-8,具体改的地方如下:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_14

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_15

Maven配置:

对于Maven来说,我们可以配置阿里云的镜像,下载jar则会更加快速,就像Android中的gradle通常我们也会引入一些国内的资源镜像,这里需要准备一个settings.xml文件,文件的内容如下:

<?xml versinotallow="1.0" encoding="UTF-8"?>
<settings xmlns="http://maven.apache.org/SETTINGS/1.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocatinotallow="http://maven.apache.org/SETTINGS/1.0.0 http://maven.apache.org/xsd/settings-1.0.0.xsd">
<localRepository>/Users/你自己的用户名/.m2/repository</localRepository>

<pluginGroups>
</pluginGroups>
<proxies>
</proxies>
<servers>
</servers>

<mirrors>
<mirror>
<id>alimaven</id>
<mirrorOf>central</mirrorOf>
<name>aliyun maven</name>
<url>http://maven.aliyun.com/nexus/content/repositories/central</url>
</mirror>

<mirror>
<id>alimaven</id>
<name>aliyun maven</name>
<url>http://maven.aliyun.com/nexus/content/groups/public</url>
<mirrorOf>central</mirrorOf>
</mirror>

<mirror>
<id>central</id>
<name>Maven Repository Switchboard</name>
<url>http://repo1.maven.org/maven2</url>
<mirrorOf>central</mirrorOf>
</mirror>

<mirror>
<id>repo2</id>
<mirrorOf>central</mirrorOf>
<name>Human Readable Name for this Mirror.</name>
<url>http://repo2.maven.org/maven2</url>
</mirror>

<mirror>
<id>ibiblio</id>
<mirrorOf>central</mirrorOf>
<name>Human Readable Name for this Mirror.</name>
<url>http://mirrors.ibiblio.org/pub/mirrors/maven2</url>
</mirror>

<mirror>
<id>jboss-public-repository-group</id>
<mirrorOf>central</mirrorOf>
<name>JBoss Public Repository Group</name>
<url>http://repository.jboss.org/nexus/content/groups/public</url>
</mirror>

<mirror>
<id>google-maven-central</id>
<name>Google Maven Central</name>
<url>https://maven-central.storage.googleapis.com
</url>
<mirrorOf>central</mirrorOf>
</mirror>

<!-- 中央仓库在中国的镜像 -->
<mirror>
<id>maven.net.cn</id>
<name>one of the central mirrors in china</name>
<url>http://maven.net.cn/content/groups/public</url>
<mirrorOf>central</mirrorOf>
</mirror>
</mirrors>

<profiles>
<profile>
<id>jdk-1.8</id>
<activation>
<activeByDefault>true</activeByDefault>
<jdk>1.8</jdk>
</activation>
<properties>
<maven.compiler.source>1.8</maven.compiler.source>
<maven.compiler.target>1.8</maven.compiler.target>
<maven.compiler.compilerVersion>1.8</maven.compiler.compilerVersion>
</properties>
</profile>
<profile>
<id>repository_set</id>
<repositories>
<repository>
<snapshots>
<enabled>false</enabled>
</snapshots>
<id>public</id>
<name>Public Repository</name>
<url>http://maven.aliyun.com/nexus/content/groups/public</url>
</repository>
</repositories>
<pluginRepositories>
<pluginRepository>
<releases>
<updatePolicy>never</updatePolicy>
</releases>
<snapshots>
<enabled>false</enabled>
</snapshots>
<id>public</id>
<name>Public Repository</name>
<url>http://maven.aliyun.com/nexus/content/groups/public</url>
</pluginRepository>
</pluginRepositories>
</profile>

</profiles>

</settings>

其中注意,需要将这个改成你自己的用户名:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_16

接下来则需要到这块进行设置:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_17

这样配置之后,以后下载jar包就可以走国内的阿里云的镜像,会比较快。 

启动日志优化:

对于Spring Boot控制台的日志,可以加一些人性化的修改。

logback日志样式修改:

这里先准备一个“logback-spring.xml”,放到这个位置:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_18

其内容如下:

<?xml versinotallow="1.0" encoding="UTF-8"?>
<configuration>
<!-- 修改一下路径-->
<property name="PATH" value="./log"></property>

<appender name="STDOUT" class="ch.qos.logback.core.ConsoleAppender">
<encoder>
<!-- <Pattern>%d{yyyy-MM-dd HH:mm:ss.SSS} %highlight(%-5level) %blue(%-50logger{50}:%-4line) %thread %green(%-18X{LOG_ID}) %msg%n</Pattern>-->
<Pattern>%d{ss.SSS} %highlight(%-5level) %blue(%-30logger{30}:%-4line) %thread %green(%-18X{LOG_ID}) %msg%n</Pattern>
</encoder>
</appender>

<appender name="TRACE_FILE" class="ch.qos.logback.core.rolling.RollingFileAppender">
<file>${PATH}/trace.log</file>
<rollingPolicy class="ch.qos.logback.core.rolling.TimeBasedRollingPolicy">
<FileNamePattern>${PATH}/trace.%d{yyyy-MM-dd}.%i.log</FileNamePattern>
<timeBasedFileNamingAndTriggeringPolicy class="ch.qos.logback.core.rolling.SizeAndTimeBasedFNATP">
<maxFileSize>10MB</maxFileSize>
</timeBasedFileNamingAndTriggeringPolicy>
</rollingPolicy>
<layout>
<pattern>%d{yyyy-MM-dd HH:mm:ss.SSS} %-5level %-50logger{50}:%-4line %green(%-18X{LOG_ID}) %msg%n</pattern>
</layout>
</appender>

<appender name="ERROR_FILE" class="ch.qos.logback.core.rolling.RollingFileAppender">
<file>${PATH}/error.log</file>
<rollingPolicy class="ch.qos.logback.core.rolling.TimeBasedRollingPolicy">
<FileNamePattern>${PATH}/error.%d{yyyy-MM-dd}.%i.log</FileNamePattern>
<timeBasedFileNamingAndTriggeringPolicy class="ch.qos.logback.core.rolling.SizeAndTimeBasedFNATP">
<maxFileSize>10MB</maxFileSize>
</timeBasedFileNamingAndTriggeringPolicy>
</rollingPolicy>
<layout>
<pattern>%d{yyyy-MM-dd HH:mm:ss.SSS} %-5level %-50logger{50}:%-4line %green(%-18X{LOG_ID}) %msg%n</pattern>
</layout>
<filter class="ch.qos.logback.classic.filter.LevelFilter">
<level>ERROR</level>
<onMatch>ACCEPT</onMatch>
<onMismatch>DENY</onMismatch>
</filter>
</appender>

<root level="ERROR">
<appender-ref ref="ERROR_FILE" />
</root>

<root level="TRACE">
<appender-ref ref="TRACE_FILE" />
</root>

<root level="INFO">
<appender-ref ref="STDOUT" />
</root>
</configuration>

它主要是干了这么几下事:

1、将日志输出风格做了精简:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_19

很明显就跟默认创建SpringBoot的日志输出不一样了,更加精简。

2、error级别的日志会生成本地log文件:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring boot_20

输出的位置在工程的这个目录:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_21

此时运行就可以看到这工程的这块多了相关的文件了:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_22

 

3、日志的堆栈信息也写入文件:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_23

这个文件其实在上面就已经看到了,就是它:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_24

也就是把控制台上看到的信息原封不动的写到日志文件里了。 

增加启动成功日志:

对于SpringBoot的启动在控制台上没有相关访问地址的提示,看一下:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_25

所以,接下来修改一下启动类,加入如下代码行:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_26

package com.cexo.wiki;

import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.core.env.Environment;

@SpringBootApplication
public class Application {

private static final Logger LOG = LoggerFactory.getLogger(Application.class);

public static void main(String[] args) {
SpringApplication app = new SpringApplication(Application.class);
Environment env = app.run(args).getEnvironment();
LOG.info("启动成功!!");
LOG.info("地址: \thttp://127.0.0.1:{}", env.getProperty("server.port"));
}

}

然后在这块配置一下服务器的端口号:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_27

此时再启动,就变得人性一些了:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_28

修改启动图案:

最后,修改一下图案,经常看到后端的开发人员在IDE启动时看到默认启动的提示文案不是目前看到的这个:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring boot_29

而是那个阿弥陀佛,永远bug那个,其实这块是可以改的,接下来就是改一个比较人性化一点的图案,做法也比较简单,就是在这个位置新建一个文件:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_30

其中这个图案的内容如下:

___ _____  ___  _    _  ___
|_ |_ _|/ _ \| | | |/ _ \
| | | | / /_\ \ | | / /_\ \
| | | | | _ | |/\| | _ |
/\__/ /_| |_| | | \ /\ / | | |
\____/ \___/\_| |_/\/ \/\_| |_/


_ooOoo_
o8888888o
88" . "88
(| -_- |)
O\ = /O
____/`---'\____
.' \\| |// `.
/ \\||| : |||// \
/ _||||| -:- |||||- \
| | \\\ - /// | |
| \_| ''\---/'' | |
\ .-\__ `-` ___/-. /
___`. .' /--.--\ `. . __
."" '< `.___\_<|>_/___.' >'"".
| | : `- \`.;`\ _ /`;.`/ - ` : | |
\ \ `-. \_ __\ /__ _/ .-` / /
======`-.____`-.___\_____/___.-`____.-'======
`=---='
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
Buddha Bless, No Bug !

而这个图案可以上​​https://patorjk.com/software/taag/#p=display&f=Graffiti&t=Type%20Something%20​​网站动态生成,比如:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring boot_31

关于这个图案网上可以找,下面运行看一下效果:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_32

注意:如果发现没有生效,记得重新编译一下工程既可。

开发Hello World接口:

前面完成了一些项目的基本配置之后,接下来就可以开发了,由于是纯小白,所以从写一个Hello World接口开始。

1、Application更换一个名称:

也就是它准备改一个名称:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_33

改成带项目前缀的见名之义一点:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_34

2、新建Controller:

对于Spring Boot中接口的实现都是放到Controller中对吧,所以:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring boot_35

里面定义一个简单的测试方法:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring boot_36

而要想让此方法变成一个接口,则需要加注解@RequestMapping,如下:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_37

有了这个注解还不够,还需要在类上加个注解@RestController声明它是一个Controller:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_38

其中还有另一个类似的注解:@Controller:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_39

它其实是返回一个页面,而不是一个字符串,由于现在的前后端都是分离的,所以这个注解通常用不到,基本都是用@RestController来返回接口请求的结果字符串,这里做个了解。

3、运行:

接下来运行看一下:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring boot_40

4、底层探究:

在这个controller编写中用到了两个注解,下面来进一步了解它们。

@RestController:

点开查看一下,发现可以发现它跟@Controller注解是有关系的:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_41

也就是其实我们也可以用标红的这俩注解来代替它,而其中@RequestBody它表示的是用来返回字符串或者JSON对象,所以这也是为啥@RestController它返回的是字符串类型了。

@RequestMapping:

对于一个请求通常来说是分为这四种:GET、POST、PUT、DELETE对吧,那这个注解表示的是所有方式都支持,如果说只想支持GET请求,则需要这样来写:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_42

而其它的方式改下method既可,另外还有一种写法,就是不同的注解对应不同的方式,如下:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_43

这里如果我们改成post请求,在浏览器访问就会报405错了,如下:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_44

这里还是将其还原成GET方式。

@ComponentScan:

有木有想过这么一个问题,就是我们自己写的Controller是如何被Spring给扫描到的呢?其实是这个注解内部有相关的扫码注解:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_45

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_46

接下来做一个实验,来体会一下该注解的用处,就是将Appliation的这个类放到一个新的包名中,如下:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring boot_47

也就是controller不是在WikiApplication所在层级的子包中了,运行再来访问咱们的这个接口,报错了。。

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_48

原因就是由于默认只会扫码Application同一级的类及子包的类,而要想解决此问题,就需要用到这个注解了,如下:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring boot_49

而如果有多个包名需要加入扫描,可以这样写:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_50

这里还是将其还原一下,其中还有一个细节,就是这块报警告了:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_51

这是因为IDE识别不了这个“cexo”的单词,为了不报警告,咱们可以将其加到字典库中,如下:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_52

这样警告就消除了。

使用HTTP Client测试接口:

概述:

目前我们在测试接口时是需要切到浏览器进行访问,另外也可能使用PostMan进行模拟请求,而且浏览器测试只支持get方式,对于post就无法用浏览器来访问了,那有木有一种直接在IDEA中进行接口测试而不用切到其它工具呢?有的,那就是使用它:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_53

如果你熟悉Android,一看到这个HttpClient,就非常的面熟对吧,因为对于Android的网络如果不使用三方框架来写的话也是用的HttpClient。

测试Get请求:

接下来咱们来使用它来测试一下咱们写的Get请求,这里其实可以不用上述的菜单来打开Http Client,其实直接可以这样:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_54

也就是在工程中创建一个http结尾的文件IDE就可以自动识别它是一个http client测试文件,咱们来在里面发起一个GET请求,如下:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring boot_55

测试Post请求:

好,接下来再来模拟一下post请求,先来改一下测试接口:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_56

然后此时重启一下服务器,再来编写测试代码:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_57

输出日志及断言:

其实还有一种用法,就是可以进行日志输出及断言,具体测试代码是如下编写的:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_58

运行貌似报错了:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_59

其实原因是:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_60

所以,这里将Accept给去掉再执行一下:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_61

整个测试成功,是不是非常之方便。

Live Template效率加快利器:

对于这样的测试用例编写,是不是你不一定记得住,而且比较麻烦,其实有一种高效输入测试用例的办法,就是使用IDE的Live Template,也就是将常见的测试代码给弄成一个快捷键:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_62

 

这里新建一个:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_63

试试效果:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_64

是不是非常方便,下面再来把POST请求也弄成一个快捷方式:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring boot_65

POST http://$HOST$/$PATH$
Content-Type:$HEADER_VALUE$

$BODY$

###

效果:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_66

另外对于post请求还有个传参的,这个用得会比较多,所以也将其加入:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_67

POST http://$HOST$/$PATH$
Content-Type:application/x-www-form-urlencoded

$PARAM1$=$VALUE1$&$PARAM2$=$VALUE2$

###

效果:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring boot_68

也就是如果未来对于经常要用的代码,就可以利用这功能将其定义成快捷键,可以大大增加开发效率,这个就看个人的爱好了。

SpringBoot配置文件【自定义配置项】:

默认支持的配置文件:

对于咱们新建的SpringBoot工程中有这么一个配置文件:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_69

接下来就来对这种配置文件进行一个全面的了解,其实不止这么一种配置。

SpringBoot:

application.properties/yml:

除了application.preperties这个配置文件之外,其实还支持yml格式的,也就是:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_70

而它里面的配置内容格式就不是之前preperties的那种了,需要改成它:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_71

为了测试效果,我们将application.perperties中的配置内容给注掉,然后启动看一下这个yml配置文件配置的内容有木有生效:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_72

生效了,那问题来了,对于properties目前只有一个简单的端口配置改成yml格式的比较简单,那如果配置非常复杂,转成yml的工作量就很大了,有木有一种能相互转换的工具呢?有的:​​https://toyaml.com/index.html​​,

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_73

这样,对于两种风格的配置那就写起来无压力的~~

config/application.properties/yml:

此外,还支持另外两种路径下的配置,也就是将其放到config下:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_74

其优先级,自己可以尝试,这里就做个了解。

SpringCloud:

另外对于SpringCloud架构下的SpringBoot应用,还可以读以下四种配置:

bootstrap.properties/yml:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_75

 

config/bootstrap.properties/yml:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring boot_76

由于SpringCloud目前还没学,所以这里就做一个扩展,bootstrap一般用于动态配置,线上可以实时修改实时生效的配置,一般可配合上nanos使用。这里还是将这些不相关的配置项给删除掉,仅作为一个了解。

自定义配置项:

对于目前的配置项只配了一个服务器的端口属性对吧:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring boot_77

它是SpringBoot内置的配置项,那我如果定义一个自定义的配置项呢,比如:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_78

那在程序中如何能读到该配置内容呢?其实可以这样用:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_79

下面咱们来测试一下看是否真的能读到?启动一下服务器,发现我本机8880端口已经被其它程序占用了:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_80

所以,咱们将端口号改一下,改为8881,再重启貌似就好了,咱们来访问一下:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_81

另外,对于配置项如果没有读到,在启动时则会报错,比如我们将刚才咱们定义的自定义项给注释掉:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring boot_82

启动服务器时就会报:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_83

所以,为了解决自定义配置木有读到时报错的问题,这里其实可以加个默认值,如下:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring boot_84

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring boot_85

 

集成热部署:

目前有一个问题,就是我们只要改动一点小代码,都需要重启服务器才能够生效对吧,很明显这种方式很影响效果,有木有一种方式能不用重启代码也能生效呢?答案就是集成热部署,下面来看一下如何集成。

引入依赖包:

先添加依赖,在这:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_86

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_87

同步一下,此时你会发现这里的依赖库木有指定版本对吧?其实它是依赖于parent的版本的,也就是:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_88

点击它跟进去看一下:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_89

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_90

又有一个parent,再跟进去:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_91

开启静态自动编译:

接下来需要到这进行开启:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_92

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_93

开启动态自动编译:

这个开启是通过双击Shift键,打开下面这个窗口找它

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_94

注意是找Registry,而不是Register哟,然后点击就会到这个界面:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_95

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_96

由于我是使用的IntelliJ IDEA是2021版的,而如果比它要老的版本关于这块设置可能是在这块:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_97

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_maven_98

这块可以根据自己IDE的情况来选择。

测试效果:

至此,热部署就已经配置好了,接下来咱们重启一下程序,然后看一下效果:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring boot_99

可以看到在启动服务器之后,再修改代码时,只需要重启点击它就可以触发重新编译而不用重启服务器:

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_spring_100

或者按保存也可以触发热部署,具体喜欢哪个可以根据自己的喜爱,这样就可以大大的加快开发测试的效率了。 

总结:

这次Springboot的入门篇主要是在搞环境配置了,具体接口的编写就放到下次继续了。 







关注个人公众号,获得实时推送

Spring Boot&Vue3 前后端分离实战wiki 知识库系统<一>---Spring Boot项目搭建_sed_101



标签:wiki,10,process,Spring,oss,Boot,com,image
From: https://blog.51cto.com/u_15456329/6076518

相关文章