请求与响应以及REST风格

谁借莪１个温暖的怀抱￠ 2023-10-15 19:48 61阅读 0赞

#### 目录 ####

*  请求与响应
 *   *  请求参数
     *   *  参数传递
     *  五种类型参数传递
     *   *  普通参数
         *  POJO数据类型
         *  嵌套POJO类型参数
         *  数组类型参数
         *  集合类型参数
     *  JSON数据传输参数
     *   *  JSON普通数组
         *  JSON对象数据
         *  JSON对象数组
         *  知识点1：@EnableWebMvc
         *  知识点2：@RequestBody
         *  @RequestBody与@RequestParam区别
         *  日期类型参数传递
         *  知识点1：@DateTimeFormat
     *  响应
     *   *  返回文本数据\[了解\]
         *  响应JSON数据
 *  REST风格
 *   *  REST简介
     *  RESTful入门案例
     *  RESTful快速开发

## 请求与响应 ##

### 请求参数 ###

#### 参数传递 ####

1.  GET发送单个参数  
    发送请求与参数:  
    ![在这里插入图片描述][38450b7fc60b4687ab6433058e4b76cb.png]  
    接收参数：  
    ![在这里插入图片描述][a18a670112454bd896e391a65d39148b.png]
2.  GET发送多个参数  
    发送请求与参数:  
    ![在这里插入图片描述][7342823c639a4152bda31a61b7876fdd.png]  
    接收参数：  
    ![在这里插入图片描述][e18bb177d9f641cb95f723001f319ffa.png]  
    GET请求中文乱码  
    如果我们传递的参数中有中文，你会发现接收到的参数会出现中文乱码问题。  
    发送请求: http://localhost/commonParam?name=张三&age=18  
    控制台:  
    ![在这里插入图片描述][d409a2471309404483d290a57e42a420.png]  
    出现乱码的原因相信大家都清楚，Tomcat8.5以后的版本已经处理了中文乱码的问题，但是IDEA中的Tomcat插件目前只到Tomcat7，所以需要修改pom.xml来解决GET请求中文乱码问题

<build>
    <plugins>
    <plugin>
    <groupId>org.apache.tomcat.maven</groupId>
    <artifactId>tomcat7-maven-plugin</artifactId>
    <version>2.1</version>
    <configuration>
    <port>80</port>
    <path>/</path> 
    <uriEncoding>UTF-8</uriEncoding>
    </configuration>
    </plugin>
    </plugins>
    </build>

1.  POST发送参数  
    发送请求与参数:  
    ![在这里插入图片描述][6a18556c09b04c3388a553a526b22f96.png]  
    接收参数：  
    和GET一致，不用做任何修改  
    ![在这里插入图片描述][2efbaec317404f4091eade3cd928e112.png]  
    POST请求中文乱码  
    发送请求与参数:  
    ![在这里插入图片描述][c8ca06f4b7284b679dd8c61913a20bb7.png]  
    接收参数:  
    控制台打印，会发现有中文乱码问题。  
    ![在这里插入图片描述][39815902879040bcb53fd53aad881a45.png]  
    解决方案:配置过滤器  
    ![在这里插入图片描述][2a9c6ed91b224f4a81ccca0d444a836e.png]  
    CharacterEncodingFilter是在spring-web包中，所以用之前需要导入对应的jar包。

### 五种类型参数传递 ###

#### 普通参数 ####

普通参数:url地址传参，地址参数名与形参变量名相同，定义形参即可接收参数。  
![在这里插入图片描述][1252637243ac41959be3d053d138c2e2.png]  
如果形参与地址参数名不一致该如何解决?  
发送请求与参数:  
![在这里插入图片描述][96a0b014e1bb4dae8ee1496cbc4b47ec.png]  
后台接收参数:  
![在这里插入图片描述][ca4124b5fe5c4cb7ba4ff5a28faa3c9a.png]  
因为前端给的是name ,后台接收使用的是userName ,两个名称对不上，导致接收数据失败:  
![在这里插入图片描述][4ff8f6198b8141deaf0b6553bf1cca64.png]  
解决方案:使用@RequestParam注解  
![在这里插入图片描述][e45a99cef49e4482b23902dc17edd882.png]  
注意:写上@RequestParam注解框架就不需要自己去解析注入，能提升框架处理性能

#### POJO数据类型 ####

简单数据类型一般处理的是参数个数比较少的请求，如果参数比较多，那么后台接收参数的时候就比较复杂，这个时候我们可以考虑使用POJO数据类型。  
POJO参数：请求参数名与形参对象属性名相同，定义POJO类型形参即可接收参数  
此时需要使用前面准备好的POJO类，先来看下User  
![在这里插入图片描述][5cf5b46ab21e4b2f9071f78d34b66bb2.png]  
发送请求和参数:  
![在这里插入图片描述][8a6788edf04e432b82a31672b0e2b4bf.png]  
后台接收参数:  
![在这里插入图片描述][e1f487bd663e466793402d5d91b903a3.png]  
注意:

*  POJO参数接收，前端GET和POST发送请求数据的方式不变。
 *  请求参数key的名称要和POJO中属性的名称一致，否则无法封装。

#### 嵌套POJO类型参数 ####

如果POJO对象中嵌套了其他的POJO类，如  
![在这里插入图片描述][9b1d02d7b0464eafa4f9c7ce8163bfba.png]  
嵌套POJO参数：请求参数名与形参对象属性名相同，按照对象层次结构关系即可接收嵌套POJO属性参数  
发送请求和参数:  
![在这里插入图片描述][2dba0944ee6e464889f44a9c79120e07.png]  
后台接收参数:  
![在这里插入图片描述][de9cecf16863419fad2cec75c12e3c53.png]  
注意:  
请求参数key的名称要和POJO中属性的名称一致，否则无法封装

#### 数组类型参数 ####

举个简单的例子，如果前端需要获取用户的爱好，爱好绝大多数情况下都是多个，如何发送请求数据和接收数据呢?  
数组参数：请求参数名与形参对象属性名相同且请求参数为多个，定义数组类型即可接收参数  
发送请求和参数:  
![在这里插入图片描述][dd326d1211244d74abc6b003a3589b73.png]  
后台接收参数:  
![在这里插入图片描述][984cfd73f58942d79756190a2a450962.png]

#### 集合类型参数 ####

数组能接收多个值，那么集合是否也可以实现这个功能呢?  
发送请求和参数:  
![在这里插入图片描述][0d6a0e41427245868211453c681646da.png]  
后台接收参数:  
![在这里插入图片描述][dc42e3f9258f47bfbfe667a20f2ff4cd.png]  
运行会报错，  
![在这里插入图片描述][1fe53fda966b4420830fb78405413c52.png]  
错误的原因是:SpringMVC将List看做是一个POJO对象来处理，将其创建一个对象并准备把前端的数据封装到对象中，但是List是一个接口无法创建对象，所以报错。  
解决方案是:使用@RequestParam注解  
![在这里插入图片描述][6a9a73319e0a418aacc3719ffd64b00f.png]

*  集合保存普通参数：请求参数名与形参集合对象名相同且请求参数为多个，@RequestParam绑定参数关系
 *  对于简单数据类型使用数组会比集合更简单些。  
    知识点1：@RequestParam  
    ![在这里插入图片描述][1134c683fab14b64a6c4c2caaedcad70.png]

### JSON数据传输参数 ###

前面我们说过，现在比较流行的开发方式为异步调用。前后台以异步方式进行交换，传输的数据使用的是JSON,所以前端如果发送的是JSON数据，后端该如何接收?  
对于JSON数据类型，我们常见的有三种:

*  json普通数组（\[“value1”,“value2”,“value3”,…\]）
 *  json对象（\{key1:value1,key2:value2,…\}）
 *  json对象数组（\[\{key1:value1,…\},\{key2:value2,…\}\]）  
    对于上述数据，前端如何发送，后端如何接收?

#### JSON普通数组 ####

步骤1:pom.xml添加依赖  
SpringMVC默认使用的是jackson来处理json的转换，所以需要在pom.xml添加jackson依赖  
![在这里插入图片描述][b3a999829ac744ba983db56f41f562a6.png]  
步骤2:PostMan发送JSON数据  
![在这里插入图片描述][e232b876cb8647de915b80e09a76e844.png]  
注意：@RequestMapping不限制请求方式，这里我们用的get发送json数据。本质上get和post没有区别，get也可以发送json数据，post也可以发送url参数，只是约定俗称使用get发送url参数，post发送json数据。另外如果使用@GetMapping就只能使用get请求。有关get和post请参考[博文][Link 1]。  
步骤3:开启SpringMVC注解支持  
在SpringMVC的配置类中开启SpringMVC的注解支持，这里面就包含了将JSON转换成对象的功能。  
![在这里插入图片描述][b041108400a240d59009f98f647035f3.png]  
步骤4:参数前添加@RequestBody  
![在这里插入图片描述][dd9f4b2a0d60483292a6b45eae69f6af.png]  
步骤5:启动运行程序  
![在这里插入图片描述][11785225137f4c6086a33bcd86f8a312.png]  
JSON普通数组的数据就已经传递完成，下面针对JSON对象数据和JSON对象数组的数据该如何传递呢?

#### JSON对象数据 ####

我们会发现，只需要关注请求和数据如何发送?后端数据如何接收?  
请求和数据的发送:  
![在这里插入图片描述][fe05ca43505742db96e3bc0ab297e388.png]  
![在这里插入图片描述][51c86fb168b04a69b744c49e7f20a28a.png]  
后端接收数据：  
![在这里插入图片描述][3468072a3ebb475684fa743d80112bc3.png]  
启动程序访问测试  
![在这里插入图片描述][532c04f1a1ce44dd9701be021dea48d2.png]  
说明:  
address为null的原因是前端没有传递数据给后端。  
如果想要address也有数据，我们需求修改前端传递的数据内容:  
![在这里插入图片描述][ab6ebdf035034ba68dcbd746ababaea0.png]  
再次发送请求，就能看到address中的数据  
![在这里插入图片描述][c6bd61e658fe4d22b28d2ab2faba3815.png]

#### JSON对象数组 ####

集合中保存多个POJO该如何实现?  
请求和数据的发送:  
![在这里插入图片描述][feea75078c534240a8cf0fe5c9200e4f.png]  
![在这里插入图片描述][b65adf40436f4e8796b19a9e94fa4dec.png]  
后端接收数据:  
![在这里插入图片描述][154267db5bee472db50835cc689772fa.png]  
启动程序访问测试  
![在这里插入图片描述][83f31139d6764243aaffc01843ee4b60.png]  
小结  
SpringMVC接收JSON数据的实现步骤为:  
(1)导入jackson包  
(2)使用PostMan发送JSON数据  
(3)开启SpringMVC注解驱动，在配置类上添加@EnableWebMvc注解  
(4)Controller方法的参数前添加@RequestBody注解

#### 知识点1：@EnableWebMvc ####

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

#### 知识点2：@RequestBody ####

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

#### @RequestBody与@RequestParam区别 ####

*  区别
    
     *  @RequestParam用于接收url地址传参，表单传参【application/x-www-form-urlencoded】
     *  @RequestBody用于接收json数据【application/json】
 *  应用
    
     *  后期开发中，发送json格式数据为主，@RequestBody应用较广
     *  如果发送非json格式数据，选用@RequestParam接收请求参数

#### 日期类型参数传递 ####

日期类型比较特殊，因为对于日期的格式有N多中输入方式，比如:

*  2088-08-18
 *  2088/08/18
 *  08/18/2088
 *  …  
    针对这么多日期格式，SpringMVC该如何接收，它能很好的处理日期类型数据么?  
    步骤1:编写方法接收日期数据  
    在UserController类中添加方法，把参数设置为日期类型  
    ![在这里插入图片描述][bc437ad1b637478ca13e95624e5dc2b6.png]  
    步骤2:启动Tomcat服务器  
    查看控制台是否报错，如果有错误，先解决错误。  
    步骤3:使用PostMan发送请求  
    使用PostMan发送GET请求，并设置date参数  
    ![在这里插入图片描述][3f1f6af2efc8497cb9da1cf96b270a34.png]  
    步骤4:查看控制台  
    ![在这里插入图片描述][65db9ddeea9a44c7a02436367157c97f.png]  
    通过打印，我们发现SpringMVC可以接收日期数据类型，并将其打印在控制台。  
    这个时候，我们就想如果把日期参数的格式改成其他的，SpringMVC还能处理么?  
    步骤5:更换日期格式  
    为了能更好的看到程序运行的结果，我们在方法中多添加一个日期参数  
    ![在这里插入图片描述][721aad35c88b443194abc40c4d61cb2a.png]  
    使用PostMan发送请求，携带两个不同的日期格式，  
    ![在这里插入图片描述][1c5b37d0d70b41fb9571448b8db35d93.png]  
    发送请求和数据后，页面会报400，控制台会报出一个错误  
    `Resolved [org.springframework.web.method.annotation.MethodArgumentTypeMismatchException: Failed to convert value of type 'java.lang.String' to required type 'java.util.Date'; nested exception is org.springframework.core.convert.ConversionFailedException: Failed to convert from type [java.lang.String] to type [java.util.Date] for value '2088-08-08'; nested exception is java.lang.IllegalArgumentException]`  
    从错误信息可以看出，错误的原因是在将2088-08-08 转换成日期类型的时候失败了，原因是  
    SpringMVC默认支持的字符串转日期的格式为yyyy/MM/dd ,而我们现在传递的不符合其默认格式，  
    SpringMVC就无法进行格式转换，所以报错。  
    解决方案也比较简单，需要使用@DateTimeFormat  
    ![在这里插入图片描述][77256fdbeaf8411bb335d8118e787efa.png]  
    重新启动服务器，重新发送请求测试，SpringMVC就可以正确的进行日期转换了  
    ![在这里插入图片描述][8dbbe61abd684460a05aa3a18f56eb6f.png]  
    步骤6:携带时间的日期  
    接下来我们再来发送一个携带时间的日期，看下SpringMVC该如何处理?  
    先修改UserController类，添加第三个参数  
    ![在这里插入图片描述][da63b6b6f456454bb44a5502d76b9c8a.png]  
    使用PostMan发送请求，携带两个不同的日期格式，  
    ![在这里插入图片描述][099323772d3f4dc7800233c9cfaf19ee.png]  
    重新启动服务器，重新发送请求测试，SpringMVC就可以将日期时间的数据进行转换  
    ![在这里插入图片描述][e33299a5defc45169ff1e836266f2779.png]

#### 知识点1：@DateTimeFormat ####

![在这里插入图片描述][7b7f21bda4ff4a89be5e6aee3e97644c.png]  
内部实现原理  
讲解内部原理之前，我们需要先思考个问题:

*  前端传递字符串，后端使用日期Date接收
 *  前端传递JSON数据，后端使用对象接收
 *  前端传递字符串，后端使用Integer接收
 *  后台需要的数据类型有很多中
 *  在数据的传递过程中存在很多类型的转换  
    问:谁来做这个类型转换?  
    答:SpringMVC  
    问:SpringMVC是如何实现类型转换的?  
    答:SpringMVC中提供了很多类型转换接口和实现类  
    在框架中，有一些类型转换接口，其中有:  
    (1) Converter接口  
    ![在这里插入图片描述][8fae8ab78a9b4cbf8777b0e9d555b4fc.png]  
    注意:Converter所属的包为org.springframework.core.convert.converter  
    Converter接口的实现类  
    ![在这里插入图片描述][d9d2f4571ed84bd59d63121134585976.png]  
    框架中有提供很多对应Converter接口的实现类，用来实现不同数据类型之间的转换,如:  
    请求参数年龄数据（String→Integer）  
    日期格式转换（String → Date）  
    (2) HttpMessageConverter接口  
    该接口是实现对象与JSON之间的转换工作  
    注意:SpringMVC的配置类把@EnableWebMvc当做标配配置上去，不要省略

### 响应 ###

#### 返回文本数据\[了解\] ####

![在这里插入图片描述][5d4a651c1516480f930731bdf62d454c.png]  
还不能称作返回json数据，这只是返回字符串。

#### 响应JSON数据 ####

响应POJO对象  
![在这里插入图片描述][8697c29a29c245a3bc30d34ca6d118c9.png]  
返回值为实体类对象，设置返回值为实体类类型，即可实现返回对应对象的json数据，需要依赖  
@ResponseBody注解和@EnableWebMvc注解  
知识点1：@ResponseBody  
![在这里插入图片描述][f5784160ac8a4b74aa4d7392b82878f6.png]  
说明:

*  该注解可以写在类上或者方法上
 *  写在类上就是该类下的所有方法都有@ReponseBody功能
 *  当方法上有@ReponseBody注解后
    
     *  方法的返回值为字符串，会将其作为文本内容直接响应给前端
     *  方法的返回值为对象，会将对象转换成JSON响应给前端  
        此处又使用到了类型转换，内部还是通过Converter接口的实现类完成的，所以Converter除了前面所说的功能外，它还可以实现:
 *  对象转Json数据(POJO -> json)
 *  集合转Json数据(Collection -> json)

## REST风格 ##

### REST简介 ###

REST（Representational State Transfer），表现形式状态转换,它是一种软件架构风格。  
当我们想表示一个网络资源的时候，可以使用两种方式：

*  传统风格资源描述形式
    
     *  http://localhost/user/getById?id=1查询id为1的用户信息
     *  http://localhost/user/saveUser保存用户信息
 *  REST风格描述形式  
    http://localhost/user/1  
    http://localhost/user  
    传统方式一般是一个请求url对应一种操作，这样做不仅麻烦，也不安全，因为会程序的人读取了你的请求url地址，就大概知道该url实现的是一个什么样的操作。  
    查看REST风格的描述，你会发现请求地址变的简单了，并且光看请求URL并不是很能猜出来该URL的具体功能  
    所以REST的优点有:
 *  隐藏资源的访问行为，无法通过地址得知对资源是何种操作
 *  书写简化  
    但是我们的问题也随之而来了，一个相同的url地址即可以是新增也可以是修改或者查询，那么到底我们该如何区分该请求到底是什么操作呢?
 *  按照REST风格访问资源时使用行为动作区分对资源进行了何种操作  
    ![在这里插入图片描述][8d2061fdd2ad4c8fac02bb9d401fbc73.png]  
    请求的方式比较多，但是比较常用的就4种，分别是GET , POST , PUT , DELETE。  
    按照不同的请求方式代表不同的操作类型。
 *  发送GET请求是用来做查询
 *  发送POST请求是用来做新增
 *  发送PUT请求是用来做修改
 *  发送DELETE请求是用来做删除  
    但是注意:
 *  上述行为是约定方式，约定不是规范，可以打破，所以称REST风格，而不是REST规范
    
     *  REST提供了对应的架构方式，按照这种架构设计项目可以降低开发的复杂性，提高系统的可伸缩性
     *  REST中规定GET/POST/PUT/DELETE针对的是查询/新增/修改/删除，但是我们如果非要用GET请求做删除，这点在程序上运行是可以实现的
     *  但是如果绝大多数人都遵循这种风格，你写的代码让别人读起来就有点莫名其妙了。
 *  描述模块的名称通常使用复数，也就是加s的格式描述，表示此类资源，而非单个资源，例如:users、books、accounts…  
    清楚了什么是REST风格后，我们后期会经常提到一个概念叫RESTful，那什么又是RESTful呢?
 *  根据REST风格对资源进行访问称为RESTful。  
    后期我们在进行开发的过程中，大多是都是遵从REST风格来访问我们的后台服务，所以可以说咱们以后都是基于RESTful来进行开发的。

### RESTful入门案例 ###

![在这里插入图片描述][ff37157eb2bb436fa3ea4c443e87f38c.png]  
![在这里插入图片描述][771480767e484cd49eaac1f6fff5eeae.png]  
![在这里插入图片描述][46f76d34f4104c9690c29c0235e2bb9e.png]  
![在这里插入图片描述][fee94688c96d4ef387325200487ec811.png]  
![在这里插入图片描述][a3873071dcdb44b0aa9016f04d390b2c.png]  
![在这里插入图片描述][81d64c95457f42f391341695dd198a6e.png]

@GetMapping(path = "/public/ratio/page")
        public HttpResponseBean<PageBean<RatioResponse>> ratioPage(RatioRequest ratioRequest) {
        
            PageBean<RatioResponse> pageInfo = ratioService.getRatioPage(ratioRequest);
            return HttpResponseBean.ok(pageInfo);
        }

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

@PostMapping(path = "/public/proportionalResolution")
        public HttpResponseBean<List<ProportionalResolution>> proportionalResolution(@RequestBody RatioRequest ratioRequest) {
        
            List<ProportionalResolution> proportionalResolutionResponse = proportionalResolutionService.findProportionalResolutionByRatio(ratioRequest);
            return HttpResponseBean.ok(proportionalResolutionResponse);
        }

### RESTful快速开发 ###

*  @Controller + @ResponseBody合并为@RestController放在类上
 *  @RequestMapping(value=“/books”,method=RequestMethod.POST)，每个方法上都有value=“/books”，抽取@RequestMapping(“/books”）放在类上，这时每个方法上变为@RequestMapping(value = “/books”,method=RequestMethod.POST)，等价为@PostMapping(“/books”)  
    ![在这里插入图片描述][9bbccbec52594c2e97467d41ffe9eb4d.png]  
    ![在这里插入图片描述][affe6cd8d624438481211b5995a1ab79.png]  
    ![在这里插入图片描述][f00e8b6917734b4c9dab7c1dfd54e003.png]

[38450b7fc60b4687ab6433058e4b76cb.png]: https://img-blog.csdnimg.cn/38450b7fc60b4687ab6433058e4b76cb.png
[a18a670112454bd896e391a65d39148b.png]: https://img-blog.csdnimg.cn/a18a670112454bd896e391a65d39148b.png
[7342823c639a4152bda31a61b7876fdd.png]: https://img-blog.csdnimg.cn/7342823c639a4152bda31a61b7876fdd.png
[e18bb177d9f641cb95f723001f319ffa.png]: https://img-blog.csdnimg.cn/e18bb177d9f641cb95f723001f319ffa.png
[d409a2471309404483d290a57e42a420.png]: https://img-blog.csdnimg.cn/d409a2471309404483d290a57e42a420.png
[6a18556c09b04c3388a553a526b22f96.png]: https://img-blog.csdnimg.cn/6a18556c09b04c3388a553a526b22f96.png
[2efbaec317404f4091eade3cd928e112.png]: https://img-blog.csdnimg.cn/2efbaec317404f4091eade3cd928e112.png
[c8ca06f4b7284b679dd8c61913a20bb7.png]: https://img-blog.csdnimg.cn/c8ca06f4b7284b679dd8c61913a20bb7.png
[39815902879040bcb53fd53aad881a45.png]: https://img-blog.csdnimg.cn/39815902879040bcb53fd53aad881a45.png
[2a9c6ed91b224f4a81ccca0d444a836e.png]: https://img-blog.csdnimg.cn/2a9c6ed91b224f4a81ccca0d444a836e.png
[1252637243ac41959be3d053d138c2e2.png]: https://img-blog.csdnimg.cn/1252637243ac41959be3d053d138c2e2.png
[96a0b014e1bb4dae8ee1496cbc4b47ec.png]: https://img-blog.csdnimg.cn/96a0b014e1bb4dae8ee1496cbc4b47ec.png
[ca4124b5fe5c4cb7ba4ff5a28faa3c9a.png]: https://img-blog.csdnimg.cn/ca4124b5fe5c4cb7ba4ff5a28faa3c9a.png
[4ff8f6198b8141deaf0b6553bf1cca64.png]: https://img-blog.csdnimg.cn/4ff8f6198b8141deaf0b6553bf1cca64.png
[e45a99cef49e4482b23902dc17edd882.png]: https://img-blog.csdnimg.cn/e45a99cef49e4482b23902dc17edd882.png
[5cf5b46ab21e4b2f9071f78d34b66bb2.png]: https://img-blog.csdnimg.cn/5cf5b46ab21e4b2f9071f78d34b66bb2.png
[8a6788edf04e432b82a31672b0e2b4bf.png]: https://img-blog.csdnimg.cn/8a6788edf04e432b82a31672b0e2b4bf.png
[e1f487bd663e466793402d5d91b903a3.png]: https://img-blog.csdnimg.cn/e1f487bd663e466793402d5d91b903a3.png
[9b1d02d7b0464eafa4f9c7ce8163bfba.png]: https://img-blog.csdnimg.cn/9b1d02d7b0464eafa4f9c7ce8163bfba.png
[2dba0944ee6e464889f44a9c79120e07.png]: https://img-blog.csdnimg.cn/2dba0944ee6e464889f44a9c79120e07.png
[de9cecf16863419fad2cec75c12e3c53.png]: https://img-blog.csdnimg.cn/de9cecf16863419fad2cec75c12e3c53.png
[dd326d1211244d74abc6b003a3589b73.png]: https://img-blog.csdnimg.cn/dd326d1211244d74abc6b003a3589b73.png
[984cfd73f58942d79756190a2a450962.png]: https://img-blog.csdnimg.cn/984cfd73f58942d79756190a2a450962.png
[0d6a0e41427245868211453c681646da.png]: https://img-blog.csdnimg.cn/0d6a0e41427245868211453c681646da.png
[dc42e3f9258f47bfbfe667a20f2ff4cd.png]: https://img-blog.csdnimg.cn/dc42e3f9258f47bfbfe667a20f2ff4cd.png
[1fe53fda966b4420830fb78405413c52.png]: https://img-blog.csdnimg.cn/1fe53fda966b4420830fb78405413c52.png
[6a9a73319e0a418aacc3719ffd64b00f.png]: https://img-blog.csdnimg.cn/6a9a73319e0a418aacc3719ffd64b00f.png
[1134c683fab14b64a6c4c2caaedcad70.png]: https://img-blog.csdnimg.cn/1134c683fab14b64a6c4c2caaedcad70.png
[b3a999829ac744ba983db56f41f562a6.png]: https://img-blog.csdnimg.cn/b3a999829ac744ba983db56f41f562a6.png
[e232b876cb8647de915b80e09a76e844.png]: https://img-blog.csdnimg.cn/e232b876cb8647de915b80e09a76e844.png
[Link 1]: https://blog.csdn.net/qq_41428418/article/details/132801776
[b041108400a240d59009f98f647035f3.png]: https://img-blog.csdnimg.cn/b041108400a240d59009f98f647035f3.png
[dd9f4b2a0d60483292a6b45eae69f6af.png]: https://img-blog.csdnimg.cn/dd9f4b2a0d60483292a6b45eae69f6af.png
[11785225137f4c6086a33bcd86f8a312.png]: https://img-blog.csdnimg.cn/11785225137f4c6086a33bcd86f8a312.png
[fe05ca43505742db96e3bc0ab297e388.png]: https://img-blog.csdnimg.cn/fe05ca43505742db96e3bc0ab297e388.png
[51c86fb168b04a69b744c49e7f20a28a.png]: https://img-blog.csdnimg.cn/51c86fb168b04a69b744c49e7f20a28a.png
[3468072a3ebb475684fa743d80112bc3.png]: https://img-blog.csdnimg.cn/3468072a3ebb475684fa743d80112bc3.png
[532c04f1a1ce44dd9701be021dea48d2.png]: https://img-blog.csdnimg.cn/532c04f1a1ce44dd9701be021dea48d2.png
[ab6ebdf035034ba68dcbd746ababaea0.png]: https://img-blog.csdnimg.cn/ab6ebdf035034ba68dcbd746ababaea0.png
[c6bd61e658fe4d22b28d2ab2faba3815.png]: https://img-blog.csdnimg.cn/c6bd61e658fe4d22b28d2ab2faba3815.png
[feea75078c534240a8cf0fe5c9200e4f.png]: https://img-blog.csdnimg.cn/feea75078c534240a8cf0fe5c9200e4f.png
[b65adf40436f4e8796b19a9e94fa4dec.png]: https://img-blog.csdnimg.cn/b65adf40436f4e8796b19a9e94fa4dec.png
[154267db5bee472db50835cc689772fa.png]: https://img-blog.csdnimg.cn/154267db5bee472db50835cc689772fa.png
[83f31139d6764243aaffc01843ee4b60.png]: https://img-blog.csdnimg.cn/83f31139d6764243aaffc01843ee4b60.png
[d23d1f883d9a4fa9b6a8aa4cae80ce7f.png]: https://img-blog.csdnimg.cn/d23d1f883d9a4fa9b6a8aa4cae80ce7f.png
[0d70ebb2ea32435ebdfb6fb7c1ccccbb.png]: https://img-blog.csdnimg.cn/0d70ebb2ea32435ebdfb6fb7c1ccccbb.png
[bc437ad1b637478ca13e95624e5dc2b6.png]: https://img-blog.csdnimg.cn/bc437ad1b637478ca13e95624e5dc2b6.png
[3f1f6af2efc8497cb9da1cf96b270a34.png]: https://img-blog.csdnimg.cn/3f1f6af2efc8497cb9da1cf96b270a34.png
[65db9ddeea9a44c7a02436367157c97f.png]: https://img-blog.csdnimg.cn/65db9ddeea9a44c7a02436367157c97f.png
[721aad35c88b443194abc40c4d61cb2a.png]: https://img-blog.csdnimg.cn/721aad35c88b443194abc40c4d61cb2a.png
[1c5b37d0d70b41fb9571448b8db35d93.png]: https://img-blog.csdnimg.cn/1c5b37d0d70b41fb9571448b8db35d93.png
[77256fdbeaf8411bb335d8118e787efa.png]: https://img-blog.csdnimg.cn/77256fdbeaf8411bb335d8118e787efa.png
[8dbbe61abd684460a05aa3a18f56eb6f.png]: https://img-blog.csdnimg.cn/8dbbe61abd684460a05aa3a18f56eb6f.png
[da63b6b6f456454bb44a5502d76b9c8a.png]: https://img-blog.csdnimg.cn/da63b6b6f456454bb44a5502d76b9c8a.png
[099323772d3f4dc7800233c9cfaf19ee.png]: https://img-blog.csdnimg.cn/099323772d3f4dc7800233c9cfaf19ee.png
[e33299a5defc45169ff1e836266f2779.png]: https://img-blog.csdnimg.cn/e33299a5defc45169ff1e836266f2779.png
[7b7f21bda4ff4a89be5e6aee3e97644c.png]: https://img-blog.csdnimg.cn/7b7f21bda4ff4a89be5e6aee3e97644c.png
[8fae8ab78a9b4cbf8777b0e9d555b4fc.png]: https://img-blog.csdnimg.cn/8fae8ab78a9b4cbf8777b0e9d555b4fc.png
[d9d2f4571ed84bd59d63121134585976.png]: https://img-blog.csdnimg.cn/d9d2f4571ed84bd59d63121134585976.png
[5d4a651c1516480f930731bdf62d454c.png]: https://img-blog.csdnimg.cn/5d4a651c1516480f930731bdf62d454c.png
[8697c29a29c245a3bc30d34ca6d118c9.png]: https://img-blog.csdnimg.cn/8697c29a29c245a3bc30d34ca6d118c9.png
[f5784160ac8a4b74aa4d7392b82878f6.png]: https://img-blog.csdnimg.cn/f5784160ac8a4b74aa4d7392b82878f6.png
[8d2061fdd2ad4c8fac02bb9d401fbc73.png]: https://img-blog.csdnimg.cn/8d2061fdd2ad4c8fac02bb9d401fbc73.png
[ff37157eb2bb436fa3ea4c443e87f38c.png]: https://img-blog.csdnimg.cn/ff37157eb2bb436fa3ea4c443e87f38c.png
[771480767e484cd49eaac1f6fff5eeae.png]: https://img-blog.csdnimg.cn/771480767e484cd49eaac1f6fff5eeae.png
[46f76d34f4104c9690c29c0235e2bb9e.png]: https://img-blog.csdnimg.cn/46f76d34f4104c9690c29c0235e2bb9e.png
[fee94688c96d4ef387325200487ec811.png]: https://img-blog.csdnimg.cn/fee94688c96d4ef387325200487ec811.png
[a3873071dcdb44b0aa9016f04d390b2c.png]: https://img-blog.csdnimg.cn/a3873071dcdb44b0aa9016f04d390b2c.png
[81d64c95457f42f391341695dd198a6e.png]: https://img-blog.csdnimg.cn/81d64c95457f42f391341695dd198a6e.png
[28b3c29e808b4883aa5896134f862558.png]: https://img-blog.csdnimg.cn/28b3c29e808b4883aa5896134f862558.png
[9bbccbec52594c2e97467d41ffe9eb4d.png]: https://img-blog.csdnimg.cn/9bbccbec52594c2e97467d41ffe9eb4d.png
[affe6cd8d624438481211b5995a1ab79.png]: https://img-blog.csdnimg.cn/affe6cd8d624438481211b5995a1ab79.png
[f00e8b6917734b4c9dab7c1dfd54e003.png]: https://img-blog.csdnimg.cn/f00e8b6917734b4c9dab7c1dfd54e003.png