《JavaWeb与Tomcat》——3.Servlet&JSP

小灰灰 2023-09-30 10:41 10阅读 0赞

#### 第 4 章 ####

这一章主要介绍Servlet技术

**1. Servlet能干什么？**

（1）动态生成html文档（也可以跳转.jsp）；  
（2）把request转发给其他Servlet；  
（3）读取来自客户端的Cookies，写入Cookies发送给客户端；  
（4）访问服务器资源（如DataBase、服务器本地文件等）；

**2. 与Servlet相关的几个类？**

（1）请求对象ServletRequest或HttpServletRequest，在service方法内处理，可以读取来自客户端的请求信息；  
（2）响应对象ServletResponse或HttpServletResponse，在service方法内处理，可以生成发送给客户端的响应；  
（3）Servlet配置对象ServletConfig，当Servlet初始化一个Servlet时，会向Servlet对象提供一个对应的ServletConfig对象，Servlet对象通过ServletConfig对象获取初始化信息，以及ServletContext对象；  
（4）Servlet上下文对象ServletContext，这个ServletContext的范围比较广，Servlet通过这个对象访问容器为当前应用提供的各种资源；

**3. Servlet接口？方法？相关的类？**

Servlet接口下的方法：

![b6620480acef64dad9e669316c0619b7.png][]

这3个方法由我们实现，由Servlet容器在Servlet不同的生命周期阶段来自动调用；

![89d6f30bf5331359619a5a5725f921c3.png][]

其他的两个接口：GenericServlet接口（需要实现service方法）、HttpServlet接口（实现doGet/doPost方法）；一般HttpServlet用的多；

请求和响应的接口：

（1）**HttpServletRequest接口**；是ServletRequest的子类接口；通过ServletRequest获取请求中的信息，包括HTTP请求报文的信息（长度、编码、请求正文的输入流），服务器信息（主机、端口），http请求的URL信息，以及在请求范围内的存取共享数据；

![14a5d622336dfda6ce5cfd3f0230aab5.png][]

![bde2c424c7c7cc2e048a80f0980b0031.png][]

![9f4e7456dad5a6f33d2f92c3d6681ad5.png][]

HttpServletRequest接口下的方法：

![d70a31b2114937dbd55cd76f09afbbfc.png][]

![1f3a28cc056262f6eee425ac29d45dbe.png][]

eg：

![806462f2083b1edecb82feea97ffa42c.png][]

小结：以上API的作用就是从Servlet请求中获取信息，对于如何解析HTTP报文的任务交给了Servlet容器，请求的所有信息都已经封装在了request对象里面，我们只需要调API方法即可从request中提取出需要的信息；

（2）**HttpServletResponse接口**（与HttpServletRequest接口对应、类似）；包括设置响应的编码、长度、响应正文的MIME类型，设置响应正文的缓冲区，提供Writer/OutputStream来向客户端输出正文的字符（串）流/字节流，清空缓冲区/手动向客户端发送响应；

![1235d0dcf6599b79af308750f13bddd1.png][]

Response是显客户端发送的响应，主要是HTTP响应的正文部分；

![a0dfcd13791bb1721837f7b961f5bbeb.png][]

HttpServletResponse接口下的方法（设置响应头、设置状态码信息，如404,403之类的、写入Cookies）：

![ef5066443a96ca5f8e93aa7f7e71bbf2.png][]

通过从response对象中获取的PrintWriter，可以向客户端写入类似html页面；

Eg：

![ee904cdbaf8b74e328fcb20022215959.png][]

image.png

**4. ServletConfig对象；**

其方法包括：

![8ba7a835d20f2f5125bcd8cc9eb8ecab.png][]

image.png

![86771aa7f48a5ed24f1d94ed2529aba6.png][]

在web.xml中配置一个Servlet的时候，包含了这个Servlet的一些配置信息（我们手动在web.xml）中写入的，这些信息封装在ServletConfig对象中，可以通过ServletConfig对象取出来，包括Servlet的名字、获取ServletContext对象、Servlet内定义的param对象的属性；

Eg：

手动配置xml：

![8a337c8371a90ff1091cb52d86a83a95.png][]

读取配置信息：

![92629cf7f4eea5c618513ea113f2a773.png][]

**5. ServletContext对象**

这是一个非常强大的对象，在一个Servlet容器中，所有的Servlet对象都共享一个ServletContext对象，它的作用域非常广泛，涵盖了整个Servlet容器，可以访问Servlet容器的信息（与ServletConfig的功能类似，也能读写共享属性（xml文件中手动配置的）；）、访问Servlet容器下的所有Web应用的资源、访问当前Web应用的资源、在当前Web应用范围内存取多个当前Web应用之间的共享信息、其他的包括输出日志、访问服务器端的文件系统；可以说非常强大的一个对象；

Eg：

![d629bed85a2ee4daf378c2f07c30062c.png][]

读取/输出信息：

![0b502ffd482348663d95a3ec822fe7fa.png][]

**6. JavaWeb的生命周期**

启动阶段-运行时阶段-终止；

（1）启动阶段

![1c2f1ba5a1bd1d98e513118366c23d90.png][]

关于第（4）点，通过在web.xml文件中配置，让Servlet在Tomcat启动阶段就被初始化（一般来说是初次向Servlet发起请求的时候才初始化这个Servlet，包括编译生成.class、读取.class）；

配置方法：

![614d61f8003c58b8143367b6710345ee.png][]

（2）运行时阶段

![2152a897d634e95d31c049a789dc81e7.png][]

image.png

（3）终止

![a46fb2835bef65c1f5f46b47bcdde131.png][]

image.png

可以通过Tomcat的后台管理（localhost：8080/manager）在当前Tomcat容器下所有Web应用的开始/终止/卸载；

**7. Servlet的生命周期**

初始化init-提供服务service-销毁destroy；

（1）Servlet初始化

![051617c9234cee272f7f9c0793b23b75.png][]

也可以配置xml让Servlet预初始化；

![2536bbb5698922b13122ae8cf87cbb7f.png][]

（2）运行时状态

![460ec689602b7f98e360dc19ef7b72ec.png][]

（3）销毁阶段

Web应用终止的时候会销毁所有的Servlet对象，包括在初始化阶段与其关联的ServletConfig对象；

**8. 再谈ServletContext的生命周期**

当启动一个Web应用，会生成一个唯一的ServletContext对象，他的生命周期与这个Web应用相同；  
**作用**：访问Web应用范围内的所有资源——即在一定范围内共享数据，如具有某个特定功能的JavaBean（只要这个Web应用还存活）；

Eg：

![520a4408e70526810d65508c606eaed1.png][]

**应用**：如 统计网站的访问次数（通过ServletContextListener监听Web的生命周期）；

**9. Servlet的service方法的异常处理？**

这个方法本身是在定义的时候是可以抛异常的，如下：

![a1a8268f98240e7277ba581930616004.png][]

*  可以抛出IOException和ServletException两种；
 *  通过在service方法内部手动抛出，使用throw XXException语句；
 *  异常的捕获/处理者：Servlet容器，他捕获异常，先客户端反馈异常的处理结果；

**10. 关于Cache？**

指的是浏览器页面的缓存，如自动填充的用户名或者密码，尽管尽管刷新了页面，还是存在；

**浏览器为什么使用Cache？**

——为了快速的展示用户请求的页面（可以通过浏览器设置），把来自服务器响应的页面（或者某些页面的信息）存在缓存里，当多次请求相同的网页，浏览器从缓存中取而不是再次向服务器发请求；

因为涉及到用户请求的信息的安全性问题，一般应用于保存服务器的静态网页和不敏感的信息；这个信息是浏览器从服务器的response中提取的，因此可以设置response来关闭cache；

Eg：（“Pragma”选项适用于HTTP1.0的浏览器）

![9c84edc78fc1a5851bd421a7360ecde9.png][]

### 第 5 章 ###

这一章主要讲Servlet的一些应用场景（高级用法、功能）

Servlet的高级用法包括：

![544ee05726d1feec35e39937a02a31c6.png][]

这些操作都是在service方法内部操作request/response；

**1.提供给用户下载（发送文件到客户端）**

（1）在服务器本地打开文件输入流（读取本地文件）；开启response的输出流；  
（2）设置response的响应头（文件信息），正文类型；  
（3）将文件流读到byte\[ \] buffer缓冲区里面；  
（4）读出缓冲区内容，通过response的输出流out.write写入数据；

Eg：

![e38080879f6d85afa89674cf72a9a49f.png][]

2.供用户上传文件到服务器（上传功能）

（略）

3.动态生成图像

（略）

**4.\*读写Cookies**

**什么是Cookies？**

——Cookies是放在客户端的，它是服务器在客户端（浏览器）存放的信息；举个例子，服务器像是一个健身馆，他给每个来访问它的客户（这里指的就是使用浏览器访问Web服务器的用户）发了一张”会员卡”，这个卡就是Cookies，目的是保存用户的信息，用户以后每次来访问，服务器都可以根据这个”会员卡”识别用户的身份（用户信息），而用户每次在发送请求的时候，request里面就放着这个”会员卡Cookies”；

**Cookies的原理如下：**

（P139 图5-9）

![b4e796b64b681f701b6b79b5700a24c3.png][]

Cookies的原理

既然Cookies在浏览器和Web服务器之间（具体的讲，指的是某个Web的应用，如一个Servlet对象）作为传递用户信息的载体，他要求浏览器和Web服务器分别有对应的功能：

![1e7399079065ec19f7ced5cf27f43fda.png][]

image.png

**怎么使用？**（给个例子，只关系怎么在Servlet里面操作Cookies，不用关心浏览器的如何读取本地Cookies并将其添加到请求中、如何解析服务器的response中的Cookies）

（1）读取request中的Cookies

![8d4ba2836c9be34a77c832a27edb8a49.png][]

（2）写入response中的Cookies

![bc411c5b0791b048835a7a25b57452fe.png][]

通过cookies.setMaxAge(int secs)设置Cookies在本地（浏览器）硬盘上的保存时间；

Cookie既然是Web应用的某个插件X与浏览器之间的产物，那么对于Web服务器中其他的应用，是否有访问其他应用存在浏览器的本地Cookies？

![daadbf2690386a1376b665f73250b725.png][]

可以控制**Cookies的作用域**：仅适用于指定的一个Web应用的指定路径下的插件、仅适用于指定的一个Web应用、在Web服务器中各个应用间共享Cookies；

\***Cookie与Session的区别？**

会话（Session）跟踪是Web程序中常用的技术。常用的会话跟踪技术包括Cookie和Session。二者最主要的区别是：Cookie作用于客户端（本地浏览器），而Seesion作用于服务器端（Web项目），通过记录信息来确定用户身份。

*  Cookie原理：当浏览器（客户端）访问服务器时，如果服务器要记录用户状态，则会生成一个用户标识，也就是Cookie；随后通过响应response将Cookie发送给浏览器，而浏览器会把Cookie存在本地。当下次浏览器访问该Web服务器时，浏览器会将请求的url网址连同

对应的Cookie一同发送给服务器。服务器可以在Request中获取Cookie及其内容，并且可以修改Cookie，然后再发送给浏览器。不同浏览器具有不同形式的Cookie，而且Cookie不跨域名。

*  Cookie的应用：如账号密码免登陆；但一般直接将账号密码放在Cookie里面是不安全的，可以使用一定的加密算法，将账号密码加密后再存于Cookie；服务器端将受到的账号密码存于数据库中，下次该浏览器访问服务器时，会查询数据库，若匹配则直接认证用户信息，不需要在浏览器重新输入账号密码。

（还有一种改进方法：**只将账号按照某种加密规则加密，然后将原始账号连同加密后的账号一起存于Cookie发送给服务器端，服务器只需要验证加密方式是否能匹配即可，即能将加密后的账号解密还原成原始账号，这样就不需要查询数据库**。）

*  Session原理：与Cookie相比，Session作用于服务器端。当浏览器（客户端）访问服务器时，服务器将客户端信息以Session的方式记录，并存放于服务器的内存中（为了存取速度），当客户端再次访问时，只需要和服务器的Session查询匹配即可确认身份。
 *  Session工作原理：客户端（浏览器）在初次访问服务器时，服务器为该客户端生成一个唯一的Session ID，并将这个Session ID写入Cookie，然后发送给客户端；当浏览器再次访问服务器并请求Session时，服务器会读取浏览器传来的Cookie中的Session ID，通过这个Session ID读出相应Session中的值，然后发送给浏览器；

Session是有生命周期的，默认30分钟，可以通过：主页面、Web项目的xml、Tomcat的XML设置。

**5.Servlet调用另一个Servlet——转发和包含**

Servlet能否直接调用另一个Servlet的service方法，即将传入自己的service方法内的request和response参数传过去，让另一个Servlet去处理请求/响应呢？

不可以直接调用，因为拿不到其他Servlet对象的引用；通过前面说的一个Servlet强大的对象——serviceContext，他与整个Web应用绑定，因此”有权限”调用其他的Servlet；

将传入一个Servlet的service方法的request和response参数传给另一个Servlet去处理请求/响应，包括两种方式：（1）请求转发；（2）包含；

区别：

![46d53760a54ba331fa7d18fd17d02ff4.png][]

意思就是，”请求转发”在转发给其他Servlet操作时，自己对用户的响应是无效的，只能由第二个Servlet来响应；而”包含”与其相反，就可以实现分别响应；

二者相同点：

![297009745f1b0ffe502071e53bd9a467.png][]

可知：

1.  当前Servlet和目标的request和response是同一组对象；
2.  转发的对象不仅仅是Servlet，也可以是其他Web组件（Servlet、JSP、html文档）；
3.  需要一个中间类实现，即RequestDispather对象；

**具体实现的方法？**

通过一个RequestDispather接口，这个接口对象和目的Web组件的path绑定，调用forward或者include方法；RequestDispather对象通过ServletContext对象来得到；

Eg：

**（1）请求转发**

![eacb8f06c6c892025b3fc379fe1388e3.png][]

看到对request对象加了个属性，并且在response里面发出了响应；然后将request/response对象传给了下一个/output（映射OutServlet.java） 来处理；

forward() 方法的流程：

![b47808850055b68891547a9741db6494.png][]

（P150 图5-14）

注意：

![0547d1f149822d9585b5b11341722ec4.png][]

因此无论是在forward() 方法前或者后调用第一个Servlet的response对象向客户端响应，最终都只有第二个Servlet的response响应；如果在调用forward() 方法之前就关闭（也可以说是响应了）了结果，如close()/flushBuffer()方法，则会抛出异常；对于forward方法，为request添加属性（setAttribute）可以在多个Web应用插件间”共享属性”；

**（2）包含**

最终的response结果由所有的转发者按照顺序共同生成；

Eg：

![81321fefc6b4828e6511cf22e606baa6.png][]

第一个Servlet打印了部分html，中间include几个其他Web应用插件（htm文档、其他Servlet），最终response结果由以上4个Web应用插共同构成；

**与forward方法相比，include方法也有一些特点**：

![90a725062966c6b00f6b95e85c3934c4.png][]

也就是说，二者的特性相反；forward方法的结果只由最后一个response响应（前面的对response的响应无效），而include方法的request相当于是”同时并行的”发送给其他的Web应用插件，彼此对request的修改被”忽略”（无效），最终的response是一个”求和”的关系；

Eg：结果如下，4个response的结果（按顺序）共同生成了一个页面

![57f890d20e051cd424c596697540e0d0.png][]

**6.重定向**

这个response.sendDir()操作与forward有点类似，也是让response结果由另一个Servlet来处理，特点如下：

![89aa5c6ebc7e9632bb73598713bb4a5c.png][]

**总结就是**：

（1）无论在response.sendDir()前后，源response都不会生效；  
（2）request不共享，无法传递属性；  
（3）范围上，不局限于当前Web应用的插件，可以是Internet上任意资源；

**7.访问同一个Servlet容器下的其他Web应用**

通过当前web应用的ServletContext去获得同一个Servlet容器下的其他Web应用的ServletContext，eg：

![4992168e7f23da69245302c352b4f810.png][]

实现了当前Web应用的Servlet往同一个Servlet容器下的另一个Servlet跳转；

**8.Servlet涉及的线程安全问题**

![708c18ae67cb2aa8d5bfcd276d177f7d.png][]

因此，对于会被访问和修改的Servlet类的属性（如在xml里面<servlet定义的param），尽量放在service()方法内定义，因为局部变量作用域到当前方法结束，若定义在Servlet类的成员变量，则可能发生并发问题；

### 第 6 章 ###

这一章主要讲JSP技术；

**1.HTML、Servlet和JSP都能向用户返回页面，区别：**

（1）HTML静态页面

![353c2ac9a5ba34a8a67e07164cb33584.png][]

即访问的静态页面就是一个固定的资源（文件），”不会动”——无法动态展示一些信息，如数据、图像等；

（2）动态的Servlet

![ee48185516c8e4a5216739f4bdcfaa9e.png][]

即Servlet可以通过service方法从request取出请求中的信息，并且通过response”动态的”返回用户请求的结果；

**缺点**：

![2f3f89a565b9b206f0ff3a16d629c007.png][]

Servlet与html刚好相反，它的主要结构是个.java文件，但又通过print来打印生成html构成的页面；

（3）更加灵活的JSP

JSP可以做到显示的html代码和负责逻辑的java代码（或者其他插件脚本，如JS）分离；

!\[JSP可以看成特殊的Servlet（它是个.jsp文件，首次被访问会生成对应的.java文件，这一步相当于是”把JSP翻译成.java的Servlet类”（这个类会write...html页面，但这一过程不需要我们实现，而是由Servlet容器实现），并且被编译成.class文件），不用再以out.print的方式输出html页面，它的主体是html，但通过一些java代码片段动态生成数据，相当于是”把动态的数据嵌入到静态的HTML页面”；

这个所谓的插在html中的标签，可以是：

![94dd5727a39f7bb0f3ac78a88cb81b78.png][]

![abc899ca6d185c0d4f243d1689f392bc.png][]

将处理业务逻辑的java代码放到JavaBean中；在JSP里面通过简洁的JSP标签来访问JavaBean，调用业务代码，可以简化JSP，实现显示界面与业务逻辑的分离；

1.JavaBean长什么样？

就是一个普通的Java类；属性+getter/setter；其他方法；

2.怎么在JSP中用JavaBean对象（获取对象，调用方法/属性）？

导入；类似导包；

![b1d5fce03905134a3e8da13039bcc4c7.png][]

声明；类似A a = new ();

![b60fe66b4afcb1000ecbbf7978ec4e30.png][]

调用；

![a6514cab394b3a62bd837fc631c3fb61.png][]

3.JavaBean的作用域？

![343922c40dcf824ceb01da4d8d0564d3.png][]

（1）page：页面范围，默认值；

（2）request：请求范围，如作为request的Attribute属性；

（3）session：会话范围，同上，随会话销毁；

（4）application：Web应用范围；

[b6620480acef64dad9e669316c0619b7.png]: https://img-blog.csdnimg.cn/img_convert/b6620480acef64dad9e669316c0619b7.png
[89d6f30bf5331359619a5a5725f921c3.png]: https://img-blog.csdnimg.cn/img_convert/89d6f30bf5331359619a5a5725f921c3.png
[14a5d622336dfda6ce5cfd3f0230aab5.png]: https://img-blog.csdnimg.cn/img_convert/14a5d622336dfda6ce5cfd3f0230aab5.png
[bde2c424c7c7cc2e048a80f0980b0031.png]: https://img-blog.csdnimg.cn/img_convert/bde2c424c7c7cc2e048a80f0980b0031.png
[9f4e7456dad5a6f33d2f92c3d6681ad5.png]: https://img-blog.csdnimg.cn/img_convert/9f4e7456dad5a6f33d2f92c3d6681ad5.png
[d70a31b2114937dbd55cd76f09afbbfc.png]: https://img-blog.csdnimg.cn/img_convert/d70a31b2114937dbd55cd76f09afbbfc.png
[1f3a28cc056262f6eee425ac29d45dbe.png]: https://img-blog.csdnimg.cn/img_convert/1f3a28cc056262f6eee425ac29d45dbe.png
[806462f2083b1edecb82feea97ffa42c.png]: https://img-blog.csdnimg.cn/img_convert/806462f2083b1edecb82feea97ffa42c.png
[1235d0dcf6599b79af308750f13bddd1.png]: https://img-blog.csdnimg.cn/img_convert/1235d0dcf6599b79af308750f13bddd1.png
[a0dfcd13791bb1721837f7b961f5bbeb.png]: https://img-blog.csdnimg.cn/img_convert/a0dfcd13791bb1721837f7b961f5bbeb.png
[ef5066443a96ca5f8e93aa7f7e71bbf2.png]: https://img-blog.csdnimg.cn/img_convert/ef5066443a96ca5f8e93aa7f7e71bbf2.png
[ee904cdbaf8b74e328fcb20022215959.png]: https://img-blog.csdnimg.cn/img_convert/ee904cdbaf8b74e328fcb20022215959.png
[8ba7a835d20f2f5125bcd8cc9eb8ecab.png]: https://img-blog.csdnimg.cn/img_convert/8ba7a835d20f2f5125bcd8cc9eb8ecab.png
[86771aa7f48a5ed24f1d94ed2529aba6.png]: https://img-blog.csdnimg.cn/img_convert/86771aa7f48a5ed24f1d94ed2529aba6.png
[8a337c8371a90ff1091cb52d86a83a95.png]: https://img-blog.csdnimg.cn/img_convert/8a337c8371a90ff1091cb52d86a83a95.png
[92629cf7f4eea5c618513ea113f2a773.png]: https://img-blog.csdnimg.cn/img_convert/92629cf7f4eea5c618513ea113f2a773.png
[d629bed85a2ee4daf378c2f07c30062c.png]: https://img-blog.csdnimg.cn/img_convert/d629bed85a2ee4daf378c2f07c30062c.png
[0b502ffd482348663d95a3ec822fe7fa.png]: https://img-blog.csdnimg.cn/img_convert/0b502ffd482348663d95a3ec822fe7fa.png
[1c2f1ba5a1bd1d98e513118366c23d90.png]: https://img-blog.csdnimg.cn/img_convert/1c2f1ba5a1bd1d98e513118366c23d90.png
[614d61f8003c58b8143367b6710345ee.png]: https://img-blog.csdnimg.cn/img_convert/614d61f8003c58b8143367b6710345ee.png
[2152a897d634e95d31c049a789dc81e7.png]: https://img-blog.csdnimg.cn/img_convert/2152a897d634e95d31c049a789dc81e7.png
[a46fb2835bef65c1f5f46b47bcdde131.png]: https://img-blog.csdnimg.cn/img_convert/a46fb2835bef65c1f5f46b47bcdde131.png
[051617c9234cee272f7f9c0793b23b75.png]: https://img-blog.csdnimg.cn/img_convert/051617c9234cee272f7f9c0793b23b75.png
[2536bbb5698922b13122ae8cf87cbb7f.png]: https://img-blog.csdnimg.cn/img_convert/2536bbb5698922b13122ae8cf87cbb7f.png
[460ec689602b7f98e360dc19ef7b72ec.png]: https://img-blog.csdnimg.cn/img_convert/460ec689602b7f98e360dc19ef7b72ec.png
[520a4408e70526810d65508c606eaed1.png]: https://img-blog.csdnimg.cn/img_convert/520a4408e70526810d65508c606eaed1.png
[a1a8268f98240e7277ba581930616004.png]: https://img-blog.csdnimg.cn/img_convert/a1a8268f98240e7277ba581930616004.png
[9c84edc78fc1a5851bd421a7360ecde9.png]: https://img-blog.csdnimg.cn/img_convert/9c84edc78fc1a5851bd421a7360ecde9.png
[544ee05726d1feec35e39937a02a31c6.png]: https://img-blog.csdnimg.cn/img_convert/544ee05726d1feec35e39937a02a31c6.png
[e38080879f6d85afa89674cf72a9a49f.png]: https://img-blog.csdnimg.cn/img_convert/e38080879f6d85afa89674cf72a9a49f.png
[b4e796b64b681f701b6b79b5700a24c3.png]: https://img-blog.csdnimg.cn/img_convert/b4e796b64b681f701b6b79b5700a24c3.png
[1e7399079065ec19f7ced5cf27f43fda.png]: https://img-blog.csdnimg.cn/img_convert/1e7399079065ec19f7ced5cf27f43fda.png
[8d4ba2836c9be34a77c832a27edb8a49.png]: https://img-blog.csdnimg.cn/img_convert/8d4ba2836c9be34a77c832a27edb8a49.png
[bc411c5b0791b048835a7a25b57452fe.png]: https://img-blog.csdnimg.cn/img_convert/bc411c5b0791b048835a7a25b57452fe.png
[daadbf2690386a1376b665f73250b725.png]: https://img-blog.csdnimg.cn/img_convert/daadbf2690386a1376b665f73250b725.png
[46d53760a54ba331fa7d18fd17d02ff4.png]: https://img-blog.csdnimg.cn/img_convert/46d53760a54ba331fa7d18fd17d02ff4.png
[297009745f1b0ffe502071e53bd9a467.png]: https://img-blog.csdnimg.cn/img_convert/297009745f1b0ffe502071e53bd9a467.png
[eacb8f06c6c892025b3fc379fe1388e3.png]: https://img-blog.csdnimg.cn/img_convert/eacb8f06c6c892025b3fc379fe1388e3.png
[b47808850055b68891547a9741db6494.png]: https://img-blog.csdnimg.cn/img_convert/b47808850055b68891547a9741db6494.png
[0547d1f149822d9585b5b11341722ec4.png]: https://img-blog.csdnimg.cn/img_convert/0547d1f149822d9585b5b11341722ec4.png
[81321fefc6b4828e6511cf22e606baa6.png]: https://img-blog.csdnimg.cn/img_convert/81321fefc6b4828e6511cf22e606baa6.png
[90a725062966c6b00f6b95e85c3934c4.png]: https://img-blog.csdnimg.cn/img_convert/90a725062966c6b00f6b95e85c3934c4.png
[57f890d20e051cd424c596697540e0d0.png]: https://img-blog.csdnimg.cn/img_convert/57f890d20e051cd424c596697540e0d0.png
[89aa5c6ebc7e9632bb73598713bb4a5c.png]: https://img-blog.csdnimg.cn/img_convert/89aa5c6ebc7e9632bb73598713bb4a5c.png
[4992168e7f23da69245302c352b4f810.png]: https://img-blog.csdnimg.cn/img_convert/4992168e7f23da69245302c352b4f810.png
[708c18ae67cb2aa8d5bfcd276d177f7d.png]: https://img-blog.csdnimg.cn/img_convert/708c18ae67cb2aa8d5bfcd276d177f7d.png
[353c2ac9a5ba34a8a67e07164cb33584.png]: https://img-blog.csdnimg.cn/img_convert/353c2ac9a5ba34a8a67e07164cb33584.png
[ee48185516c8e4a5216739f4bdcfaa9e.png]: https://img-blog.csdnimg.cn/img_convert/ee48185516c8e4a5216739f4bdcfaa9e.png
[2f3f89a565b9b206f0ff3a16d629c007.png]: https://img-blog.csdnimg.cn/img_convert/2f3f89a565b9b206f0ff3a16d629c007.png
[94dd5727a39f7bb0f3ac78a88cb81b78.png]: https://img-blog.csdnimg.cn/img_convert/94dd5727a39f7bb0f3ac78a88cb81b78.png
[abc899ca6d185c0d4f243d1689f392bc.png]: https://img-blog.csdnimg.cn/img_convert/abc899ca6d185c0d4f243d1689f392bc.png
[b1d5fce03905134a3e8da13039bcc4c7.png]: https://img-blog.csdnimg.cn/img_convert/b1d5fce03905134a3e8da13039bcc4c7.png
[b60fe66b4afcb1000ecbbf7978ec4e30.png]: https://img-blog.csdnimg.cn/img_convert/b60fe66b4afcb1000ecbbf7978ec4e30.png
[a6514cab394b3a62bd837fc631c3fb61.png]: https://img-blog.csdnimg.cn/img_convert/a6514cab394b3a62bd837fc631c3fb61.png
[343922c40dcf824ceb01da4d8d0564d3.png]: https://img-blog.csdnimg.cn/img_convert/343922c40dcf824ceb01da4d8d0564d3.png