详细SpringBoot教程之Web开发（一）

男娘i 2023-07-07 14:58 132阅读 0赞

## 写在前面 ##

鉴于有人留言说想要学习SpringBoot相关的知识，我这里打算写一个SpringBoot系列的相关博文，目标呢是想让看了这一系列博文的同学呢，能够对SpringBoot略窥门径，这一系列的博文初步都定下来包括SpringBoot介绍、入门、配置、日志相关、web开发、数据访问、结合docker、缓存、消息队列、检索、任务安全、分布式等等一系列的博文，工作量很大，是个漫长的过程，每一步我都尽量详细，配上截图说明，也希望对看的同学真的有用。  
**单纯就是想分享技术博文，还想说一句就是，如果觉得有用，请点个关注、给个赞吧，也算对我来说是个宽慰，毕竟也得掉不少头发，嘿嘿嘿**

## 系列文章传送条 ##

[详细SpringBoot教程之入门（一）][SpringBoot]  
[详细SpringBoot教程之入门（二）][SpringBoot 1]  
[详细SpringBoot教程之配置文件（一）][SpringBoot 2]  
[详细SpringBoot教程之配置文件（二）][SpringBoot 3]  
[详细SpringBoot教程之日志框架][SpringBoot 4]  
[详细SpringBoot教程之Web开发（一）][SpringBoot_Web]  
[详细SpringBoot教程之Web开发（二）][SpringBoot_Web 1]  
[详细SpringBoot教程之Web开发（三）][SpringBoot_Web 2]  
[详细SpringBoot教程之数据访问][SpringBoot 5]  
[详细SpringBoot教程之启动配置原理][SpringBoot 6]  
[详细SpringBoot教程之缓存开发][SpringBoot 7]

## 开发前准备 ##

我们接下来准备使用SpringBoot开发一个restful的应用，首先我们通过Idea创建向导帮我们创建SpringBoot应用，勾选我们需要的模块，这里我们还是只勾选一个web场景，后面需要啥再添加。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center]

前面说过，我们创建的项目中，SpringBoot将会帮我们自动配置好web开发场景中需要的相关配置，只需要在配置文件中指定少量配置就可以运行起来了，我们只需要注意在业务代码中就可以了。

当然，我们如果想要搞清楚某个场景中，SpringBoot帮我们配置了什么依赖，这个时候就需要我们了解相关的自动配置原理了，前面的博文有相关的讲解，我这里就不深入讲解了。

## SpringBoot对静态资源的映射配置规则 ##

创建好了项目之后，我们先来讲解一下SpringBoot对于静态资源的相关配置规则，因为我们现在暂时来开发一个前后端没有分离的很彻底的应用（如果前后端分离的很彻底，我们只用SpringBoot来做后端接口），所以必须要知道怎么使用SpringBoot的静态资源。

### 使用webjars ###

首先SpringBoot的有个叫webjars的东西，所有通过pom.xml引入的静态资源，都在/webjars/\*\*下（这个在静态资源的自动配置类中可以找到），也就是说SpringBoot会自动去classpath:/META-INF/resources/webjars/找资源，webjars以jar包的方式引入静态资源（也就是说，我们都可以通过http://localhost:8080/webjars/xx访问对应的静态资源）

怎么通过pom.xml引入静态资源呢？我们可以去[webjars的资源库][webjars]中找，需要什么静态资源的jar基本都可以在这里找到（指的是框架依赖），里面长这样子。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 1]各种静态资源jar都可以通过pom.xml依赖的方式引入 ，我们引入JQuery看看，引入的JQuery的依赖包下边，可以看到webjars内容长这样  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 2]  
现在我们引入了jQuery的静态资源，我们启动项目，来试一下能不能通过对应的路径访问，我这里使用的路径是http://localhost:8080/webjars/jquery/3.4.1/jquery.js  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 3]  
所以发现了没有，我通过SpringBoot来开发相关的静态资源，非常方便，我们只要引入对应的webjars就可以了，SpringBoot不需要我们进行过多的配置，有自己默认配置的规则。

### 使用resources ###

当然如果我们想要用自己的静态资源，不想使用webjars的东西，怎么做呢？这个时候就需要另外一个映射规则就是/\*\*（也就是说，我们通过http://localhost:8080/xxx.js访问静态资源，如果我们没有配置相关，就会默认去下面这几个文件夹中找）用来配置映射，即可访问当前项目下的任何资源

*  classpath:/META-INF/resources/
 *  classpath:/resources/
 *  classpath:/static/
 *  classpath:/public/  
    即通过“/\*\*”访问的静态资源，SpringBoot会去上面这几个找资源，这些也就是SpringBoot默认的静态资源文件夹  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 4]  
    这里我们可以随便将jquery.js放置在三个文件夹中的一个，然后通过http://localhost:8080/jquery.js可以访问到。  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 5]  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 6]

## 配置欢迎页映射 ##

静态资源文件夹下的所有index.html页面，会被/**映射；  
也就是说我们直接访问http://localhost:8080/就直接访问静态资源文件夹中的index.html，相当于我们以前SpringMVC下面的index.jsp，比如我们现在随机选public的静态资源文件夹下创建index.html  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 7]  
同样的所有的**/favicon.ico默认都是在静态资源下找，当然，如果我们不想要使用SpringBoot默认的静态资源文件夹，我们还可以定义静态资源的映射，如下  
![在这里插入图片描述][20200224120932331.png_pic_center]  
要注意了，如果自己定义了静态资源映射之后，默认的文件夹就都不生效了，相当于原来的那些访问方式都不生效了。

## 模板引擎 ##

JSP、Velocity、Freemarker、Thymeleaf等等，模板引擎的本质思想是一样的，只是语法不大一致而已。比如说以freemarker为例，如下图。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 8]  
SpringBoot推荐的Thymeleaf，不用JSP，因为Thymeleaf语法更加简单，功能更加强大，如何导入呢，其实对于SpringBoot不就是一个引入依赖的事情嘛，很简单，依赖包如下

<dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-thymeleaf</artifactId>
    </dependency>

这里引入的是SpringBoot默认的Thymeleaf依赖版本，如果我们要切换版本怎么切换，如下，加上对应版本号就可以了

## 使用Thymeleaf ##

在使用Thymeleaf语法之前，我们先来实验一下，我们只要把HTML页面放在templates目录下就可以了，Thymeleaf就会自动渲染  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 9]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 10]

### 正式使用 ###

我们先编写一个控制器，用来跳转渲染，控制器中，加入我们待会儿要在HTML通过Thymeleaf获取的一个变量值，如下  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 11]  
在HTML编写代码之前，现在HTML的头标签中导入thymeleaf的名称空间，这样我们在使用Thymeleaf语法的时候，Idea就会提示相关代码。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 12]  
编写好之后启动项目，我们通过访问http://localhost:8080/success来访问success.html页面，访问之后结果如下  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 13]

## SpringBoot自动配置MVC ##

SpringBoot集成了SpringMVC，所以里面自然自动配置了SpringMVC运行的相关基本依赖，那么SpringBoot引入了SpringMVC那些依赖呢？这里我大致进行一下介绍。Spring Boot为Spring MVC提供了自动配置，可与大多数应用程序完美配合。其中自动配置在Spring的默认值之上添加了以下功能：

*  包含ContentNegotiatingViewResolver和BeanNameViewResolver
 *  支持服务静态资源，包括对WebJars的支持
 *  自动注册Converter，GenericConverter和Formatter的beans。
 *  支持HttpMessageConverters。
 *  自动注册MessageCodesResolver
 *  静态index.html支持
 *  定制Favicon支持
 *  自动使用ConfigurableWebBindingInitializerbean

如果要保留这些Spring Boot MVC定制并进行更多的MVC定制（拦截器，格式化程序，视图控制器和其他功能），则可以添加自己@Configuration的type类，WebMvcConfigurer但不添加 @EnableWebMvc（因为@EnableWebMvc会关闭Spring Boot MVC的默认配置，而转向需要读取我们自己添加的配置，稍后会讲）。

如果你想提供的定制情况RequestMappingHandlerMapping，RequestMappingHandlerAdapter或者ExceptionHandlerExceptionResolver，仍然保持弹簧引导MVC自定义，你可以声明类型的beans WebMvcRegistrations，并用它来提供这些组件的定制实例。

如果你想对Spring MVC中的完全控制，你可以添加自己的@Configuration注解为@EnableWebMvc，或者添加自己的@Configuration-annotated DelegatingWebMvcConfiguration中的Javadoc中所述@EnableWebMvc。

后面我们会讨论怎么对SpringMVC进行完全控制。

## 拓展SpringMVC ##

看到如下配置是不是很熟悉，我们以前在SpringMVC中是这样编写视图控制器和拦截器的，那么我们怎么在SpringBoot中使用呢？  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 14]  
在前面见过，为了方便编写项目的统一配置，和前面见过配置的的地方一样，我们统一把项目的配置放在config包中管理，然后我们在config包下创建一个MyMvcConfig的类，实现WebMvcConfigurer接口，就可以对SpringBoot中关于SpringMVC相关配置进行扩展了。

WebMvcConfigurer可以用来扩展SpringMVC的功能，需要什么在里面实现什么方法就可以了，比如我们扩展一下视图转换器，如下  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 15]  
这样实现了既保留了使用原有的配置，又能使用我们自己的方式扩展配置

## @EnableWebMvc ##

上面我们可以自己编写类扩展SpringMVC的相关配置，如果我们再在配置类上加上@EnableWebMvc注解，是啥意思呢，也就是说我们将全面接管SpringMVC在SpringBoot中的配置，在SpringBoot中有关SpringMVC所有的默认配置都会失效，需要我们自行配置，比如上面我们默认webjars进行访问静态资源等等，都会失效  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 16]  
也就是说原本我们不使用@EnableWebMvc，SpringBoot会自动配置SpringMVC的默认依赖，如果我们使用@EnableWebMvc，则@EnableWebMvc就会将WebMVCConfigurationSupport组件导入进来，而导入的WebMVCConfigurationSupport组件里面只有SpringMVC一些最基本的功能。

## 如何修改SpringBoot的默认配置 ##

SpringBoot在自动配置很多组件的时候，先看容器中有没有哦用户自己配置的（@Bean、@Component）如果有就用用户配置的，如果没有就自动配置，如果有些组件可以有多个（如ViewResolver）将用户配置和自己默认的组合起来

在SpringBoot中会有非常多的xxxConfigurer帮助我们进行SpringMVC的拓展配置。

## 写一篇 ##

这篇博文我们在进行正式开发前的一些准备，下一篇我们来引入静态资源文件编写相关代码。

[SpringBoot]: https://blog.csdn.net/DBC_121/article/details/104383089
[SpringBoot 1]: https://blog.csdn.net/DBC_121/article/details/104429074
[SpringBoot 2]: https://blog.csdn.net/DBC_121/article/details/104446690
[SpringBoot 3]: https://blog.csdn.net/DBC_121/article/details/104448353
[SpringBoot 4]: https://dengbocong.blog.csdn.net/article/details/104456941
[SpringBoot_Web]: https://dengbocong.blog.csdn.net/article/details/104473765
[SpringBoot_Web 1]: https://blog.csdn.net/DBC_121/article/details/104503158
[SpringBoot_Web 2]: https://blog.csdn.net/DBC_121/article/details/104503231
[SpringBoot 5]: https://blog.csdn.net/DBC_121/article/details/104527730
[SpringBoot 6]: https://blog.csdn.net/DBC_121/article/details/104541113
[SpringBoot 7]: https://blog.csdn.net/DBC_121/article/details/104559440
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center]: https://img-blog.csdnimg.cn/2020022411091976.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE=,size_16,color_FFFFFF,t_70#pic_center
[webjars]: https://www.webjars.org/
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 1]: https://img-blog.csdnimg.cn/20200224112633172.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE=,size_16,color_FFFFFF,t_70#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 2]: https://img-blog.csdnimg.cn/20200224113123313.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE=,size_16,color_FFFFFF,t_70#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 3]: https://img-blog.csdnimg.cn/20200224113521694.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE=,size_16,color_FFFFFF,t_70#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 4]: https://img-blog.csdnimg.cn/20200224114201805.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE=,size_16,color_FFFFFF,t_70#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 5]: https://img-blog.csdnimg.cn/20200224114436634.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE=,size_16,color_FFFFFF,t_70#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 6]: https://img-blog.csdnimg.cn/2020022411463312.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE=,size_16,color_FFFFFF,t_70#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 7]: https://img-blog.csdnimg.cn/20200224115146775.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE=,size_16,color_FFFFFF,t_70#pic_center
[20200224120932331.png_pic_center]: https://img-blog.csdnimg.cn/20200224120932331.png#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 8]: https://img-blog.csdnimg.cn/20200224121211766.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE=,size_16,color_FFFFFF,t_70#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 9]: https://img-blog.csdnimg.cn/20200224123258894.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE=,size_16,color_FFFFFF,t_70#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 10]: https://img-blog.csdnimg.cn/20200224123648165.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE=,size_16,color_FFFFFF,t_70#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 11]: https://img-blog.csdnimg.cn/20200224152855460.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE=,size_16,color_FFFFFF,t_70#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 12]: https://img-blog.csdnimg.cn/20200224152946227.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE=,size_16,color_FFFFFF,t_70#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 13]: https://img-blog.csdnimg.cn/20200224220715198.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE=,size_16,color_FFFFFF,t_70#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 14]: https://img-blog.csdnimg.cn/20200224160148641.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE=,size_16,color_FFFFFF,t_70#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 15]: https://img-blog.csdnimg.cn/20200224160934488.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE=,size_16,color_FFFFFF,t_70#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70_pic_center 16]: https://img-blog.csdnimg.cn/2020022416164636.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE=,size_16,color_FFFFFF,t_70#pic_center