小白入门之Hello Spring Boot

深藏阁楼爱情的钟 2021-09-11 02:14 349阅读 0赞

### 文章目录 ###

*   *  SpringBoot介绍
     *   *  定义
         *  特点
     *  SpringBoot全新的pom.xml
     *   *  pom.xml
     *  eclipse第一个SpringBoot Project
     *   *  创建maven project
         *  Update Maven
         *  修改pom.xml
         *  创建RunApp.java
         *  创建HelloController.java
         *  启动Tomcat WebServer
         *  测试
     *  IDEA第一个SpringBoot Project
     *   *  创建SpringBoot project
         *  配置maven
         *  创建RunApp.java
         *  创建HelloController.java
         *  测试
     *  扩展
     *   *  执行过程
         *  常见问题：8080端口冲突
     *  Apache Tomcat
     *   *  Web中间件历史
         *  servlet-api.jar
     *  Git忽略特殊目录和文件
     *   *  .gitignore
     *  扩展：请求响应过程
     *   *  HTTP协议
         *  执行过程
         *  谷歌浏览器查看请求响应信息
         *  头信息
         *  响应头
         *  请求头

## SpringBoot介绍 ##

### 定义 ###

Spring Boot是由Pivotal团队提供的全新框架，其设计目的是用来简化新Spring应用的初始搭建以及开发过程。Spring Boot 现在已经成为Java 开发领域的一颗璀璨明珠，它本身是包容万象的，可以跟各种技术集成。成为SpringBoot全家桶。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTI5MzI4NzY_size_16_color_FFFFFF_t_70]

### 特点 ###

*  创建独立的Spring应用程序
 *  嵌入的Tomcat，无需部署WAR文件
 *  简化Maven配置
 *  自动配置Spring
 *  提供生产就绪型功能，如指标，健康检查和外部配置

## SpringBoot全新的pom.xml ##

### pom.xml ###

它产生整个项目目录，其实我们只需pom.xml文件，覆盖本地maven工程的pom.xml文件。

注：可以使用idea直接创建springboot项目，其本质也是去调用上面的网站，只不过在本地访问外网[https://start.spring.io][https_start.spring.io]。

修改pom.xml后，把项目进行maven-update 操作，下载依赖的jar包。

<?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>
    	<groupId>cn.tedu</groupId>
    	<artifactId>jk</artifactId>
    	<version>0.0.1-SNAPSHOT</version>
    	<name>jk</name>
    	<description>Demo project for Spring Boot</description>
    
      	
    	<parent>
    		<groupId>org.springframework.boot</groupId>
    		<artifactId>spring-boot-starter-parent</artifactId>
    		<version>2.4.2</version>
    		<relativePath/> 
    	</parent>
    	<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.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>

## eclipse第一个SpringBoot Project ##

### 创建maven project ###

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ZgF4fWWt-1622611944851)(RackMultipart20210602-4-13yqzr7\_html\_88f4cadbf675bacc.png)\]][img-ZgF4fWWt-1622611944851_RackMultipart20210602-4-13yqzr7_html_88f4cadbf675bacc.png]  
![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-DffVpOg5-1622611944853)(RackMultipart20210602-4-13yqzr7\_html\_f3dbe5180a64a7d2.png)\] \[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Uug3y2Lk-1622611944856)(RackMultipart20210602-4-13yqzr7\_html\_c9324fdf83114f10.png)\]][img-DffVpOg5-1622611944853_RackMultipart20210602-4-13yqzr7_html_f3dbe5180a64a7d2.png_ _img-Uug3y2Lk-1622611944856_RackMultipart20210602-4-13yqzr7_html_c9324fdf83114f10.png]

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-9ZM90rdZ-1622611944859)(RackMultipart20210602-4-13yqzr7\_html\_69c7e96ed9eaee87.png)\]][img-9ZM90rdZ-1622611944859_RackMultipart20210602-4-13yqzr7_html_69c7e96ed9eaee87.png]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTI5MzI4NzY_size_16_color_FFFFFF_t_70 1]

### Update Maven ###

默认jdk1.5，早已经过气，改成jdk1.8

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-dXNey224-1622611944861)(RackMultipart20210602-4-13yqzr7\_html\_4ba30fa51de53570.png)\]][img-dXNey224-1622611944861_RackMultipart20210602-4-13yqzr7_html_4ba30fa51de53570.png]

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-YDahcycS-1622611944862)(RackMultipart20210602-4-13yqzr7\_html\_56330a3490f4e16f.png)\]][img-YDahcycS-1622611944862_RackMultipart20210602-4-13yqzr7_html_56330a3490f4e16f.png]

### 修改pom.xml ###

添加SpringBoot的依赖包

<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>cn.tedu</groupId>
      <artifactId>jkboot</artifactId>
      <version>0.0.1-SNAPSHOT</version>
      
       <parent>
    		<groupId>org.springframework.boot</groupId>
    		<artifactId>spring-boot-starter-parent</artifactId>
    		<version>2.4.2</version>
    		<relativePath/> 
    	</parent>
    	<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.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>

### 创建RunApp.java ###

SpringBoot使用了全新的运行方式，两句话，直接执行main方法，默认启动tomcat中间件，端口为8080。

注意：类必须放在其他类的父级目录，它底层使用了包扫描机制，扫描的要求只扫描本类所在的目录极其子目录。

package cn.tedu.jk;
    
    import org.springframework.boot.SpringApplication;
    import org.springframework.boot.autoconfigure.SpringBootApplication;
    
    @SpringBootApplication  //标识为springboot项目
    public class RunApp { 
    	public static void main(String[] args) { 
    		//全新的启动方式，执行run方法会自动启动集成的tomcat中间件
    		SpringApplication.run(RunApp.class, args);
    	}
    }

### 创建HelloController.java ###

目前市场主流已经采用注解方式进行开发

package cn.tedu.controller;
    
    import org.springframework.web.bind.annotation.RequestMapping;
    import org.springframework.web.bind.annotation.RestController;
    
    @RestController//接受浏览器的请求 并返回json数据
    public class HelloController { 
    // @RequestMapping("hi")//只匹配一个路径
    	@RequestMapping({ "hi","hello/hi"})//匹配两种路径/hi或者/hello/hi
    	public String hi() { 
    		return "hi springboot!";
    	}
    }

### 启动Tomcat WebServer ###

ApacheTomcat是一个非常著名的web中间件，于之前学习的技术的不同在于它提供了web程序的容器环境，专门用于网站服务。

SpringBoot默认集成了tomcat中间件，会自动把项目打包jar发布到tomcat，这样我们就形成了自己的网站。但这个网站只能局域网访问，如果外网（广域网），自己购买一个网站，部署上去即可。

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-EHxq1c8h-1622611944864)(RackMultipart20210602-4-13yqzr7\_html\_b6ffad0fd1bf396a.png)\]][img-EHxq1c8h-1622611944864_RackMultipart20210602-4-13yqzr7_html_b6ffad0fd1bf396a.png]

注意：不用服务时，关闭tomcat服务

![在这里插入图片描述][20210602133557148.png]

### 测试 ###

http://localhost:8080/hello/hi				 # 某个web服务的根请求
    http://localhost:8080/hi							# /hi的某个具体请求

url解析：

*  localhost代表本机，等价于ip：127.0.0.1
 *  8080代表本机的服务，tomcat默认端口8080
 *  /hi等请求地址在一个web服务中请求具有唯一性（多个就没法区分了）

## IDEA第一个SpringBoot Project ##

### 创建SpringBoot project ###

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-WR1TVNk9-1622611944867)(RackMultipart20210602-4-13yqzr7\_html\_1f3c0383b05ee183.png)\] \[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-NXvX74GV-1622611944868)(RackMultipart20210602-4-13yqzr7\_html\_d7d122b951eddced.png)\]][img-WR1TVNk9-1622611944867_RackMultipart20210602-4-13yqzr7_html_1f3c0383b05ee183.png_ _img-NXvX74GV-1622611944868_RackMultipart20210602-4-13yqzr7_html_d7d122b951eddced.png]

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-xKEmqpMV-1622611944870)(RackMultipart20210602-4-13yqzr7\_html\_b398aadf7efff605.png)\]][img-xKEmqpMV-1622611944870_RackMultipart20210602-4-13yqzr7_html_b398aadf7efff605.png]

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-fZhoD53H-1622611944873)(RackMultipart20210602-4-13yqzr7\_html\_8fcdb23f7d430ca1.png)\]][img-fZhoD53H-1622611944873_RackMultipart20210602-4-13yqzr7_html_8fcdb23f7d430ca1.png]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTI5MzI4NzY_size_16_color_FFFFFF_t_70 2]

### 配置maven ###

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-1GCJYPcj-1622611944874)(RackMultipart20210602-4-13yqzr7\_html\_a6fdf2899a929f84.png)\]][img-1GCJYPcj-1622611944874_RackMultipart20210602-4-13yqzr7_html_a6fdf2899a929f84.png]

### 创建RunApp.java ###

package cn.tedu.cotroller;
    
    import org.springframework.boot.SpringApplication;
    import org.springframework.boot.autoconfigure.SpringBootApplication;
    import org.springframework.stereotype.Controller;
    
    @SpringBootApplication
    @Controller
    public class RunApp { 
    
        public static void main(String[] args) { 
            SpringApplication.run(RunApp.class, args);
        }
    
    }

### 创建HelloController.java ###

package cn.tedu.cotroller;
    
    import org.springframework.web.bind.annotation.RequestMapping;
    import org.springframework.web.bind.annotation.RestController;
    
    @RestController//接受浏览器的请求 并返回json数据
    public class HelloController { 
       
        // @RequestMapping({"hi","hello/hi"})//匹配两种路径/hi或者/hello/hi
        @RequestMapping("hi")//只匹配一个路径
        public String hi() { 
            return "hi springboot!";
        }
    
    }

### 测试 ###

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-4rZhgvxa-1622611944876)(RackMultipart20210602-4-13yqzr7\_html\_d22efd4149555a01.png)\]][img-4rZhgvxa-1622611944876_RackMultipart20210602-4-13yqzr7_html_d22efd4149555a01.png]

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-6KdsoB85-1622611944878)(RackMultipart20210602-4-13yqzr7\_html\_321e9fd69c397f66.png)\]][img-6KdsoB85-1622611944878_RackMultipart20210602-4-13yqzr7_html_321e9fd69c397f66.png]

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-D4CPxrkD-1622611944881)(RackMultipart20210602-4-13yqzr7\_html\_812f002efb1212b0.png)\]][img-D4CPxrkD-1622611944881_RackMultipart20210602-4-13yqzr7_html_812f002efb1212b0.png]

## 扩展 ##

### 执行过程 ###

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-nA2MGVwt-1622611944882)(RackMultipart20210602-4-13yqzr7\_html\_bd1136079b713306.png)\]][img-nA2MGVwt-1622611944882_RackMultipart20210602-4-13yqzr7_html_bd1136079b713306.png]

**url**\*\* 的解析执行过程：\*\*

浏览器输入的url，就会被解析后传入web中间件（/hi），web中间件再会进一步的解析，找到对应的Controller的某个注解里对应的url @RequestMapping(\{"/","/hi"\}) ，从而就找到HelloController的hi()方法。最终利用反射执行这个类的方法（将来这个方法中就用来编写实现业务逻辑代码）。因为使用了@RestController，返回的String字符串对象底层会使用jackson工具类转换java对象为json字符串，返回给浏览器，浏览器将字符串回显（展示）在页面上。

### 常见问题：8080端口冲突 ###

Tomcat服务不会自动关闭，需要手动关闭，如不关闭，下次启动就会报下面错误：

port 8080 was already in use. 端口8080已经被占用。关闭服务，重新启动即可。

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-gZ1E9rTG-1622611944884)(RackMultipart20210602-4-13yqzr7\_html\_bf8f36feda26a498.png)\]][img-gZ1E9rTG-1622611944884_RackMultipart20210602-4-13yqzr7_html_bf8f36feda26a498.png]

仍未解决的话,以下三种方式任选一个来测试.

1,需要执行DOS命令处理:

C:\Users\lpx>netstat –ano  --查看所有端口号,找到8080端口对应的PID号
    C:\Users\lpx>taskkill -pid 688 –f --杀死688进程号

2,可能是因为电脑里安装过Oracle数据库:

要找到Oracle的服务OracleXETNSListener,停掉.

3,直接使用yml方式配置修改端口号:

在src/main/resources下添加application.yml文件,内容如下:

server:
      port: 8090

清除项目缓存,再次重启服务,测试即可: http://localhost:8090/hello/hi

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Ez1SAusA-1622611944886)(RackMultipart20210602-4-13yqzr7\_html\_2e15298de6e12e4.png)\]][img-Ez1SAusA-1622611944886_RackMultipart20210602-4-13yqzr7_html_2e15298de6e12e4.png]

## Apache Tomcat ##

### Web中间件历史 ###

最早的网站技术是Apache，但它只支持html。当微软推出asp技术后，第一代动态网站技术诞生，微软同时推出了ISS以支持asp技术。随着sun公司的j2ee架构横空出世，提出第二代动态网站技术规范servlet、jsp后，servlet容器就如雨后春笋。Tomcat、Jetty、GlassFish、JBoss、WebSpare、WebLogic，后三者非常厉害，性能超群，但由于昂贵的费用及微服务新架构的兴起，而开始没落，Jetty一直号称性能远胜Tomcat，但Tomcat的霸主地位已经难以撼动（就像编程语言中的java）。目前市场主流都采用Tomcat，特别国内一线互联网企业，而国企采用WebSpare和WebLogic居多。

### servlet-api.jar ###

我们按sun公司的java规范写的servlet（HttpServlet）就专门支持网站的请求request（HttpServletRequest）和响应response（HttpServletResponse）的处理。

各大web中间件厂商按照servlet规范做自己的实现如tomcat的servlet-api.jar。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTI5MzI4NzY_size_16_color_FFFFFF_t_70 3]

注：我们的关注点在于实现项目，这里会使用tomcat，初步了解底层结构，不必过渡深入研究。

## Git忽略特殊目录和文件 ##

### .gitignore ###

在git工作空间的根目录下创建文本文件 .gitignore git忽略，配置如下：

.gitignore
    
    *.class
    
    #maven ignore
    target/* #eclipse ignore .settings/ .project .classpath

注意：target临时目录配置了不生效

git rm -r --cached . #把本地缓存删除（改变成未track状态），然后再提交

通过变通方式暂时解决：配置 \*.class，禁止上传class文件

## 扩展：请求响应过程 ##

### HTTP协议 ###

HTTP协议是Hyper Text Transfer Protocol（超文本传输协议）的缩写，是用于从万维网（WWW：World Wide Web）服务器传输超文本到本地浏览器的传送协议。HTTP是一个基于TCP/IP通信协议来传递数据（HTML文件、图片文件、查询结果等）。

### 执行过程 ###

怎么浏览器输入url就可以找到我们写的controller进行执行并且返回呢？

其实这底层是有一套标准的，这个标准称为HTTP协议。我们浏览器成输入的http://这就代表执行http协议。

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-jjGHoR5L-1622611944891)(RackMultipart20210602-4-13yqzr7\_html\_107e300ec5e6502a.png)\]][img-jjGHoR5L-1622611944891_RackMultipart20210602-4-13yqzr7_html_107e300ec5e6502a.png]

### 谷歌浏览器查看请求响应信息 ###

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-r7q2VHhY-1622611944895)(RackMultipart20210602-4-13yqzr7\_html\_eb79132159e90a76.png)\]][img-r7q2VHhY-1622611944895_RackMultipart20210602-4-13yqzr7_html_eb79132159e90a76.png]

### 头信息 ###

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-F9h7KiK6-1622611944897)(RackMultipart20210602-4-13yqzr7\_html\_b943390ab815c2b9.png)\]][img-F9h7KiK6-1622611944897_RackMultipart20210602-4-13yqzr7_html_b943390ab815c2b9.png]

### 响应头 ###

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ZOPFOXBo-1622611944899)(RackMultipart20210602-4-13yqzr7\_html\_85328de643a97b43.png)\]][img-ZOPFOXBo-1622611944899_RackMultipart20210602-4-13yqzr7_html_85328de643a97b43.png]

### 请求头 ###

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-AZvB6DzV-1622611944900)(RackMultipart20210602-4-13yqzr7\_html\_c6c1127d713f9606.png)\]][img-AZvB6DzV-1622611944900_RackMultipart20210602-4-13yqzr7_html_c6c1127d713f9606.png]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTI5MzI4NzY_size_16_color_FFFFFF_t_70]: /images/20210911/e6ed34f7205048148750ec2dcd1104fd.png
[https_start.spring.io]: https://start.spring.io/
[img-ZgF4fWWt-1622611944851_RackMultipart20210602-4-13yqzr7_html_88f4cadbf675bacc.png]: /images/20210911/584126e994164b60afe95946fc685e15.png
[img-DffVpOg5-1622611944853_RackMultipart20210602-4-13yqzr7_html_f3dbe5180a64a7d2.png_ _img-Uug3y2Lk-1622611944856_RackMultipart20210602-4-13yqzr7_html_c9324fdf83114f10.png]: /images/20210911/1947076963fe49ffb1f3fa75dcfef44d.png
[img-9ZM90rdZ-1622611944859_RackMultipart20210602-4-13yqzr7_html_69c7e96ed9eaee87.png]: /images/20210911/b2edb851bf24456b8cef38654b7a98bf.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTI5MzI4NzY_size_16_color_FFFFFF_t_70 1]: /images/20210911/97b9ab9835a34dd2a9201f37c999f8cd.png
[img-dXNey224-1622611944861_RackMultipart20210602-4-13yqzr7_html_4ba30fa51de53570.png]: /images/20210911/a73ce63000f64fa39a9ae7957b14ef19.png
[img-YDahcycS-1622611944862_RackMultipart20210602-4-13yqzr7_html_56330a3490f4e16f.png]: /images/20210911/7fa11297937e4e4e95e66c1d0c038189.png
[img-EHxq1c8h-1622611944864_RackMultipart20210602-4-13yqzr7_html_b6ffad0fd1bf396a.png]: /images/20210911/4999dfca91c0481e9ebea6dd2ae55e93.png
[20210602133557148.png]: /images/20210911/f1b213afd88c4ac8890e47042900ea27.png
[img-WR1TVNk9-1622611944867_RackMultipart20210602-4-13yqzr7_html_1f3c0383b05ee183.png_ _img-NXvX74GV-1622611944868_RackMultipart20210602-4-13yqzr7_html_d7d122b951eddced.png]: /images/20210911/712f459d485d4ceabc4eb648effbb976.png
[img-xKEmqpMV-1622611944870_RackMultipart20210602-4-13yqzr7_html_b398aadf7efff605.png]: /images/20210911/80dac692c7064efaa7b875a9c0af506d.png
[img-fZhoD53H-1622611944873_RackMultipart20210602-4-13yqzr7_html_8fcdb23f7d430ca1.png]: /images/20210911/d744b15aad124dc2a81a35e26ecae9dd.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTI5MzI4NzY_size_16_color_FFFFFF_t_70 2]: /images/20210911/1044e8d0c98a4846969c8a42ceb3f855.png
[img-1GCJYPcj-1622611944874_RackMultipart20210602-4-13yqzr7_html_a6fdf2899a929f84.png]: /images/20210911/70879e1034d949b4aee9f592853e00a0.png
[img-4rZhgvxa-1622611944876_RackMultipart20210602-4-13yqzr7_html_d22efd4149555a01.png]: /images/20210911/a670d1ddacf54c4e80f8b476f31e6d26.png
[img-6KdsoB85-1622611944878_RackMultipart20210602-4-13yqzr7_html_321e9fd69c397f66.png]: /images/20210911/dfdcbc3e02c84abbbfac323f3a3abf12.png
[img-D4CPxrkD-1622611944881_RackMultipart20210602-4-13yqzr7_html_812f002efb1212b0.png]: /images/20210911/223de83a850c4c96a6892723978ba01a.png
[img-nA2MGVwt-1622611944882_RackMultipart20210602-4-13yqzr7_html_bd1136079b713306.png]: /images/20210911/702e8b2917164945aaee188536ce5050.png
[img-gZ1E9rTG-1622611944884_RackMultipart20210602-4-13yqzr7_html_bf8f36feda26a498.png]: /images/20210911/4fbb4a86033548e197b5c8b28c6b477d.png
[img-Ez1SAusA-1622611944886_RackMultipart20210602-4-13yqzr7_html_2e15298de6e12e4.png]: /images/20210911/59674398c52e4e53ab7817070323e7dd.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTI5MzI4NzY_size_16_color_FFFFFF_t_70 3]: /images/20210911/de8bc52b911a4ef191d24df0c8cb5587.png
[img-jjGHoR5L-1622611944891_RackMultipart20210602-4-13yqzr7_html_107e300ec5e6502a.png]: /images/20210911/11b8f2e58d6440b3a0437f8664a71bdd.png
[img-r7q2VHhY-1622611944895_RackMultipart20210602-4-13yqzr7_html_eb79132159e90a76.png]: /images/20210911/73c694305dd642918ef5096b42a55ea1.png
[img-F9h7KiK6-1622611944897_RackMultipart20210602-4-13yqzr7_html_b943390ab815c2b9.png]: /images/20210911/befd1b07cafd44fa8023aa0b711fac19.png
[img-ZOPFOXBo-1622611944899_RackMultipart20210602-4-13yqzr7_html_85328de643a97b43.png]: /images/20210911/1eede42253af4f79a08f2e32558bdccd.png
[img-AZvB6DzV-1622611944900_RackMultipart20210602-4-13yqzr7_html_c6c1127d713f9606.png]: /images/20210911/4ac90c2bafca4ed880abadb85820b21f.png