Cookie和HttpSession

àì夳堔傛蜴生んèń 2023-10-02 19:20 11阅读 0赞

## Cookie ##

### 会话技术 ###

#### 什么是会话 ####

生活中的会话&BS结构的会话  
![在这里插入图片描述][9d9f4472e8224c2da79b1e608cfcb879.png]

#### 为什么会有会话技术 ####

![9b1120a3bc134746b7fbf4dd146a4669.png][]

#### 什么是Cookie ####

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

### Cookie的执行原理 ###

#### Cookie的运行原理 ####

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

### 创建和发送 ###

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

#### 案例:在Servlet中创建一个Cookie(“user”,“孙悟空”),并且写到浏览器端去 ####

![在这里插入图片描述][bffa88d858e8438a9bc9e85c14419537.png]  
在Tomcat7里面有汉字直接报500异常错误

### 设置过期的时间![在这里插入图片描述][02bb0e4ff6c44ac8bee41e08be76a133.png] ###

### 案例:读取Cookie信息 ###

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

### 设置访问路径 ###

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

package com.itheima.servlet;
    
    import javax.servlet.*;
    import javax.servlet.http.*;
    import javax.servlet.annotation.*;
    import java.io.IOException;
    import java.io.PrintWriter;
    
    @WebServlet("/demo1")
    public class Demo1CookieServlet extends HttpServlet {
        
        @Override
        protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
            //1.使用构造方法创建一个Cookie对象,指定键和值,注意:键和值都不建议使用中文
            Cookie user = new Cookie("user","NewBoy");
    
            /**
             *2.在默认情况下,关闭浏览器Cookie就失效失效,单位:秒
             * 1.如果设置为正数,表示以秒为单位及时
             * 2.如果是0,表示删除这个Cookie
             * 3.如果是负数,表示浏览器关闭就过期(与不设置相同)
             */
    
            user.setMaxAge(60*10);
            //3.将创建好的Cookie发给浏览器
            response.addCookie(user);
            //再创建一个cookie
    
    
            Cookie age = new Cookie("age","20");
            //设置他的访问地址,只有访问demo3或它的子路径,浏览器才会将Cookie发送给服务器
            age.setPath(request.getContextPath()+"/demo3");
            age.setMaxAge(60*10);
            response.addCookie(age);
    
            //设置响应类型和编码
            response.setContentType("text/html;charset=utf-8");
            //获取打印流
            PrintWriter out = response.getWriter();
            out.println("向浏览器添加了cookie数据");
    
        }
    
        @Override
        protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
            this.doPost(request, response);
    
        }
    }

#### 面试题 ####

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

### 删除Cookie ###

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

package com.itheima.servlet;
    
    import javax.servlet.*;
    import javax.servlet.http.*;
    import javax.servlet.annotation.*;
    import java.io.IOException;
    
    @WebServlet("/demo4")
    public class Demo4Servlet extends HttpServlet {
        
        @Override
        protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
            //创建Cookie对象
            Cookie user = new Cookie("user", "null");
            //设置过期时间为0
            user.setMaxAge(0);
            //添加到浏览器端
            response.addCookie(user);
    
        }
    
        @Override
        protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
            this.doPost(request, response);
    
        }
    }

### 实现自动登录的案例 ###

![在这里插入图片描述][96a2a3b801b041589985547373c559a3.png]  
**LoginServlet文件**

package com.itheima.servlet;
    
    import javax.servlet.*;
    import javax.servlet.http.*;
    import javax.servlet.annotation.*;
    import java.io.IOException;
    
    @WebServlet("/login")
    public class LoginServlet extends HttpServlet {
        
        @Override
        protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
            //1.得到用户名和密码
            String username = request.getParameter("username");
            String password = request.getParameter("password");
            //2.判断是否登录成功
            if ("NewBoy".equals(username)&&"1234".equals(password)){
        
                //登录成功,判断是否勾选"记住我"
                String remember = request.getParameter("remember");
                //如果没有勾选remember为空,不为空表示勾选
                if(remember!=null){
        
                    //勾选的话创建cookie保存用户名
                    Cookie cookieUser = new Cookie("user", username);
                    //设置过期时间
                    cookieUser.setMaxAge(60 *60*24*7);
                    //设置只有访问登录页面login.html,才发送给Cookie给服务器
                    cookieUser.setPath(request.getContextPath()+"/login.html");
                    //写到浏览器端
                    response.addCookie(cookieUser);
    
                    Cookie cookiePass = new Cookie("password", password);
                    cookiePass.setMaxAge(60 *60*24*7);
                    cookiePass.setPath(request.getContextPath()+"/login.html");
                    response.addCookie(cookiePass);
    
                    //3.重定向跳转到成功页面
                    response.sendRedirect(request.getContextPath()+"/success.html");
    
                }else {
        
                    //3.没勾选也跳转重定向跳转到成功页面
                    response.sendRedirect(request.getContextPath()+"/success.html");
                }
            }else {
        
                //重定向跳转到失败页面
                response.sendRedirect(request.getContextPath()+"/failure.html");
            }
    
    
        }
    
        @Override
        protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
            this.doPost(request, response);
    
        }
    }

**commons.js工具类**(js文件夹下)

/**工具方法，通过名字得到值*/
    function getCookieValue(name) {
        
    
        //1.得到所有的cookie
        var cookies = document.cookie;
        if (cookies != "") {
         //username=admin; password=123 注:password前面有一个空格
            //2.使用分号来拆分
            var strings = cookies.split(";");
            for (var i = 0; i < strings.length; i++) {
        
                var cookie = strings[i];
                //3.每个元素再按"="号来拆分
                var key = cookie.split("=")[0].trim(); //第0个元素是键，去掉前后的空格
                var value = cookie.split("=")[1].trim();//第1个元素是值，去掉前后的空格
                //14.比较名字和键是否相同，如果相同就返回value
                if (name == key) {
        
                    return value;
                }
            }
        }
    
        return null;
    }

**failure.html(登录失败)**

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>登录失败</title>
    </head>
    <body>
    <h2>登陆失败</h2>
    <a href="http://localhost:8080/">点我重新登录</a>
    </body>
    </html>

**success.html(登录成功)**

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>登录成功</title>
    </head>
    <body>
    <h1>登录成功欢迎你</h1>
    </body>
    </html>

**login.html(用户登录)**

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    
        <script src="js/commons.js"></script>
    
    </head>
    <body>
    <h2>用户登录</h2>
    <form action="login" method="post" id="loginForm">
        <table>
            <tr>
                <td width="60">用户名</td>
                <td><input type="text" name="username" id="username"></td>
            </tr>
            <tr>
                <td>密码</td>
                <td><input type="password" name="password" id="password"></td>
            </tr>
            <tr>
                <td>记住我</td>
                
                <td><input type="checkbox"  id="remember" name="remember"></td>
            </tr>
            <tr>
                <td colspan="2" align="center"><input type="submit" value="登录"></td>
            </tr>
        </table>
    
    </form>
    <script type="text/javascript">
    
        window.onload = function () {
          
            //1.通过js读取用户名和密码
            let username = getCookieValue("user");
            let password = getCookieValue("password");
    
    
            //2.自动填充到同户名和密码的文本框中
            if (username != null && password != null) {
          
    
    
                document.getElementById("username").value = username;
                document.getElementById("password").value = password;
                //3.提交表单,从而实现自动登录的功能
    
                document.getElementById("loginForm").submit();
            }
        }
    </script>
    
    </body>
    </html>

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

## HttpSession ##

### HttpSession介绍 ###

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

### Cookie和Session的主要区别 ###

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

### Tomcat保留会话重启或者重新发布 ###

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

### 会话对象的方法 ###

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

package com.itheima.Servlet;
    
    import javax.servlet.*;
    import javax.servlet.http.*;
    import javax.servlet.annotation.*;
    import java.io.IOException;
    import java.io.PrintWriter;
    import java.sql.Timestamp;
    
    @WebServlet("/demo1")
    public class Demo1SessionServlet extends HttpServlet {
        
        @Override
        protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
            /**
             * 获取会话对象由Tomcat是西安,并创建对象
             * :org.apache.catalina.session.StandardSessionFacade@1a484079
             * public class StandardSessionFacade implements HttpSession
             *
             * getSession()方法作用:
             * 1.如果是第一次访问,是创建一个新的对象
             * 2.第二次访问以后则是获取已经存在的会话对象
             * 不同的用户是不同的会话对象
             */
            HttpSession session = request.getSession();
            //1.设置响应类型和编码
            response.setContentType("text/html;charset=utf-8");
            //2.获取打印流
            PrintWriter out = response.getWriter();
            out.println("会话对象:"+session+"<hr/>");
    
            //获取每个用户的会话id值:32位的十六进制数组成,而且是唯一的
            out.println("会话id为:"+session.getId()+"<hr/>");
    
            out.println("是否是新会话:"+session.isNew()+"<hr/>");
            //返回的是一个毫秒值,需要转时间戳来显示.
            out.println("创建时间:"+new Timestamp(session.getCreationTime()) +"<hr/>");
            out.println("创建最后一次发访问的时间:"+new Timestamp(session.getLastAccessedTime()) +"<hr/>");
    
    
    
    
        }
    
        @Override
        protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
            this.doPost(request, response);
    
        }
    }

### 会话域的操作方法 ###

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

### 会话作用域 ###

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

#### 创建会话域键和值 ####

#### 获取会话域的键和值 ####

### 会话访问的原理(Session) ###

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

### HttpSession的一些疑问 ###

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

可以配钥匙(自己写个cookie用来存Session的id)服务器端默认存30分钟

#### 案例保存JSESSIONID ####

![在这里插入图片描述][5ed40cad43a0400db27f975437409c68.png]  
![在这里插入图片描述][720a674710514a52895c9f03247fc51a.png]

### 修改会话过期的方式 ###

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

#### 方式一&&方式二 ####

package com.itheima.Servlet;
    
    import javax.servlet.*;
    import javax.servlet.http.*;
    import javax.servlet.annotation.*;
    import java.io.IOException;
    import java.io.PrintWriter;
    
    @WebServlet("/dem4")
    public class Demo3IntervalServlet extends HttpServlet {
        
        @Override
        protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
            //1.设置响应类型和编码
            response.setContentType("text/html;charset=utf-8");
            //2.获取打印流
            PrintWriter out = response.getWriter();
            //获取会话对象
            HttpSession session = request.getSession();
            //浏览器输出会话对象id
            out.println("会话对象:"+session.getId()+"<hr/>");
    
            //获取服务器会话过期最大时间:秒
            //int maxInactiveInterval = session.getMaxInactiveInterval();
            //浏览器端输出过期时间
            //out.println("过期时间"+maxInactiveInterval+"<hr/>");
    
            //方式一:设置会话对象最大过期时间为10s
            //ession.setMaxInactiveInterval(10);
            //浏览器端输出过期时间
            out.println("过期时间:"+session.getMaxInactiveInterval()+"<hr/>");
    
    
            //方式二:会话立马过期:适用于用户退出
            //session.invalidate();
    
    
        }
    
        @Override
        protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
            this.doPost(request, response);
    
        }
    }

#### 方式三通过配置文件修改 ####

<?xml version="1.0" encoding="UTF-8"?>
    <web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
             xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
             xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
             version="4.0">
    
        <session-config>
            <session-timeout>5</session-timeout>
        </session-config>
    </web-app>

### 浏览器端禁用Cookie的处理方式 ###

![在这里插入图片描述][3d09c38abbde40548175eac42a53f34f.png]  
![在这里插入图片描述][4516d23e752e4ee8b41ebd6dfc65fafd.png]

## 案例 ##

### 验证码登录 ###

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

#### 验证码登录的准备 ####

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

#### 登录的Servlet ####

![在这里插入图片描述][8d586da6364a460883b721b85d9b8e29.png]  
![f319694a9c7946039199ea416e1d36b2.png][]

**WelcomeServlet**  
**login.html**

<!Doctype html>
    <html lang="zh-cn">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>登录页面</title>
    
    
    
    </head>
    <body>
    
    <div class="container" style=" text-align: center">
        <h3 style="font-size: 20px">用户登录</h3>
        <form action="login" method="post">
            <div class="form-group">
                <label for="name">用户名: </label>
                <input type="text" name="name" class="form-control" id="name" placeholder="请输入用户名">
            </div>
            <div class="form-group">
                <label for="password">密码:</label>   
                <input type="password" name="password" class="form-control" id="password" placeholder="请输入密码"/>
            </div>
            <div class="form-inline">
                <label for="vcode">验证码:</label>
                <input type="text" name="vcode" class="form-control" size="6px" id="vcode" placeholder="验证码" style=" "
                       maxlength="4"/>
                
                <img src="code" id="code" style="..." title="看不清，点击刷新">
            </div>
            <div style="...">
                <input type="submit" value=" 登录" class="btn btn-primary"/>
            </div>
    <h4 onclick="">退出</h4>
        </form>
    </div>
    </body>
    <script type="text/javascript">
        //给图片添加id属性,通过id获取图片对象
        document.getElementById("code").onclick = function () {
          
            //重新访问服务器,获取新的验证码;带参数是为了让她访问地址不同
            this.src="code?name="+new Date().getTime();
    
    
        }
    </script>
    </html>

**PicCodeServlet**

package com.itheima.servlet;
    
    import javax.imageio.ImageIO;
    import javax.servlet.ServletException;
    import javax.servlet.annotation.WebServlet;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    import javax.servlet.http.HttpSession;
    import java.awt.*;
    import java.awt.image.BufferedImage;
    import java.io.IOException;
    import java.util.Random;
    
    
    @WebServlet("/code")
    public class PicCodeServlet extends HttpServlet {
        
        //随机类
        private Random random = new Random();
    
        /**
         * 随机获取一种颜色
         */
    
        private Color getRandomColor() {
        
            //随机得到r，g，b的取值，范围是0~255
            int r = random.nextInt(256);
            int g = random.nextInt(256);
            int b = random.nextInt(256);
            //red红 green绿 blue蓝
            return new Color(r, g, b);
        }
    
        @Override
        protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
            //设置MIME类型
            response.setContentType("image/jpeg");
            //定义宽和高的值
            int width = 90;
            int height = 30;
            //1，创建一张图片，参数:宽，高，图片模式
            BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
            //获取画笔对象
            Graphics graphics = image.getGraphics();
            //整个图片填充白色
            graphics.setColor(Color.WHITE);
            graphics.fillRect(0, 0, width, height);
            //2.随机绘制4个验证码
            char[] arr = {
        'A', 'B', 'C', 'D', 'N', 'E', 'W', 'b', 'o', 'y', '1', '2', '3', '4', '5', '6', '7', '8'};
            //设置字体，字体对象有三个参数:字体名字，字体样式(加粗，斜体)大小
            graphics.setFont(new Font(Font.DIALOG_INPUT, Font.BOLD + Font.ITALIC, 19));
            //创建一个stringBuilder
            StringBuilder sb = new StringBuilder();
            for (int i = 0; i < 4; i++) {
        
                //随机获取1个索引号
                int index = random.nextInt(arr.length);
                //随机获取字符数组的一个字符
                char c = arr[index];
                //添加到字符串中
                sb.append(c);
                //每个字符的颜色不同
                graphics.setColor(getRandomColor());
                //写字符，参数:文字内容，xy坐标(把字符转成字符串)
                graphics.drawString(String.valueOf(c), 10 + (i * 20), 20);
            }
            //将字符串放在会话域中
            HttpSession session = request.getSession();
            session.setAttribute("code", sb.toString());
            System.out.println("验证码:" + sb);
            //3.绘制8条干扰线
            for (int i = 0; i < 8; i++) {
        
                //指定颜色
                graphics.setColor(getRandomColor());
                int x1 = random.nextInt(width);
                int y1 = random.nextInt(height);
                int x2 = random.nextInt(width);
                int y2 = random.nextInt(height);
                //画线，起点和终点
                graphics.drawLine(x1, y1, x2, y2);
            }
            //4.把图片输出到浏览器，参数:输出的图片对象，图片格式，响应输出流
            ImageIO.write(image, "jpg", response.getOutputStream());
        }
    
        @Override
        protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
            this.doPost(request, response);
    
        }
    }

**LoginServlet**

package com.itheima.servlet;
    
    import javax.servlet.*;
    import javax.servlet.http.*;
    import javax.servlet.annotation.*;
    import java.io.IOException;
    import java.io.PrintWriter;
    
    @WebServlet("/login")
    public class LoginServlet extends HttpServlet {
        
        @Override
        protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
            //获取会话对象
            HttpSession session = request.getSession();
            //从会话域中获取验证码
            String code = (String) session.getAttribute("code");
            //从用户输入框中获取验证码
            String vcode = request.getParameter("vcode");
            //设置响应类型和编码
            response.setContentType("text/html;charset=utf-8");
            //获取打印流
            PrintWriter out = response.getWriter();
            //验证码只用一次
            session.removeAttribute("code");
            //1.判断验证码是否正确
            if (!code.equalsIgnoreCase(vcode)){
        
                //验证码不匹配,就提示一下,跳回初始页面
                out.println("<script>");
                out.println("alert('验证码输入错误');");
                out.println("location.href='login.html';");
                out.println("</script>");
            }else {
        
                //验证码正确再判断用户名和密码
                String name = request.getParameter("name");
                String password = request.getParameter("password");
                if ("NewBoy".equals(name)&&"1234".equals(password)){
        
                    //验证通过成功登录,需要将用户的信息保存在会话域中
                    session.setAttribute("user",name);
                    //跳转到登录成功的页面
                    response.sendRedirect(request.getContextPath()+"/welcome");
                }else {
        
                    out.println("<script>");
                    out.println("alert('用户名或是密码输入错误');");
                    out.println("location.href='login.html';");
                    out.println("</script>");
                }
            }
        }
    
        @Override
        protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
            this.doPost(request, response);
    
        }
    }

**WelcomeServlet**

**LogoutServlet**

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

## 小结 ##

### 能够说出会话的概念 ###

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

### 能够创建,发送.接收,删除Cookie ###

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

### 能够说出Cookie执行原理 ###

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

### 能够说出Session的概念 ###

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

### 能够获取session对象,添加,删除,获取session中的数据 ###

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

[9d9f4472e8224c2da79b1e608cfcb879.png]: https://img-blog.csdnimg.cn/9d9f4472e8224c2da79b1e608cfcb879.png
[9b1120a3bc134746b7fbf4dd146a4669.png]: https://img-blog.csdnimg.cn/9b1120a3bc134746b7fbf4dd146a4669.png
[b2a8d8706ec9471c8f4cc48507410bf7.png]: https://img-blog.csdnimg.cn/b2a8d8706ec9471c8f4cc48507410bf7.png
[fc3c03170da84a0c9c3d35756dbaaec0.png]: https://img-blog.csdnimg.cn/fc3c03170da84a0c9c3d35756dbaaec0.png
[f41313590a084d409f316a52ae60450d.png]: https://img-blog.csdnimg.cn/f41313590a084d409f316a52ae60450d.png
[bffa88d858e8438a9bc9e85c14419537.png]: https://img-blog.csdnimg.cn/bffa88d858e8438a9bc9e85c14419537.png
[02bb0e4ff6c44ac8bee41e08be76a133.png]: https://img-blog.csdnimg.cn/02bb0e4ff6c44ac8bee41e08be76a133.png
[59ba7ba167b94da4ae3dcf9fee64375e.png]: https://img-blog.csdnimg.cn/59ba7ba167b94da4ae3dcf9fee64375e.png
[d07abba236f248389f2e63722a52f85f.png]: https://img-blog.csdnimg.cn/d07abba236f248389f2e63722a52f85f.png
[732e57f3cc1e42e8bd7e7d94344346b8.png]: https://img-blog.csdnimg.cn/732e57f3cc1e42e8bd7e7d94344346b8.png
[be3f86ffd411457d8e480f16eee0de3d.png]: https://img-blog.csdnimg.cn/be3f86ffd411457d8e480f16eee0de3d.png
[96a2a3b801b041589985547373c559a3.png]: https://img-blog.csdnimg.cn/96a2a3b801b041589985547373c559a3.png
[b2d81b65ad574d9399871de5bf40471d.png]: https://img-blog.csdnimg.cn/b2d81b65ad574d9399871de5bf40471d.png
[a0ff804239ac4007bc2ab313eede14e4.png]: https://img-blog.csdnimg.cn/a0ff804239ac4007bc2ab313eede14e4.png
[92886ae6e3f043c2916da7877c4b33df.png]: https://img-blog.csdnimg.cn/92886ae6e3f043c2916da7877c4b33df.png
[28a7fa8733d04e03bd4e77873f2c68e4.png]: https://img-blog.csdnimg.cn/28a7fa8733d04e03bd4e77873f2c68e4.png
[42df293a9e9a498aa58a14103f1c0964.png]: https://img-blog.csdnimg.cn/42df293a9e9a498aa58a14103f1c0964.png
[5a23db0c30434d738d84e6b8d01ec8c0.png]: https://img-blog.csdnimg.cn/5a23db0c30434d738d84e6b8d01ec8c0.png
[72c025bc10e74754b68a7c3c7d442654.png]: https://img-blog.csdnimg.cn/72c025bc10e74754b68a7c3c7d442654.png
[c4cb26728ad24193a3cccc1504346a4a.png]: https://img-blog.csdnimg.cn/c4cb26728ad24193a3cccc1504346a4a.png
[47e4c5a7322b4a72a5e76999040cfe53.png]: https://img-blog.csdnimg.cn/47e4c5a7322b4a72a5e76999040cfe53.png
[5ed40cad43a0400db27f975437409c68.png]: https://img-blog.csdnimg.cn/5ed40cad43a0400db27f975437409c68.png
[720a674710514a52895c9f03247fc51a.png]: https://img-blog.csdnimg.cn/720a674710514a52895c9f03247fc51a.png
[1072fa04155344928983aec39363ed67.png]: https://img-blog.csdnimg.cn/1072fa04155344928983aec39363ed67.png
[3d09c38abbde40548175eac42a53f34f.png]: https://img-blog.csdnimg.cn/3d09c38abbde40548175eac42a53f34f.png
[4516d23e752e4ee8b41ebd6dfc65fafd.png]: https://img-blog.csdnimg.cn/4516d23e752e4ee8b41ebd6dfc65fafd.png
[931567b89d4b49c0a475919b667eacfa.png]: https://img-blog.csdnimg.cn/931567b89d4b49c0a475919b667eacfa.png
[8f3afecbcd524ddcbd000c7164b8789d.png]: https://img-blog.csdnimg.cn/8f3afecbcd524ddcbd000c7164b8789d.png
[8d586da6364a460883b721b85d9b8e29.png]: https://img-blog.csdnimg.cn/8d586da6364a460883b721b85d9b8e29.png
[f319694a9c7946039199ea416e1d36b2.png]: https://img-blog.csdnimg.cn/f319694a9c7946039199ea416e1d36b2.png
[8de346d5eb274d00929a5fc3f916bdc9.png]: https://img-blog.csdnimg.cn/8de346d5eb274d00929a5fc3f916bdc9.png
[8acf5868590e4f09809a3cf0792d5183.png]: https://img-blog.csdnimg.cn/8acf5868590e4f09809a3cf0792d5183.png
[ffc9a39863a3466e902927ece6c0969d.png]: https://img-blog.csdnimg.cn/ffc9a39863a3466e902927ece6c0969d.png
[2be2269afabb48dfa41cdbc66f8cc800.png]: https://img-blog.csdnimg.cn/2be2269afabb48dfa41cdbc66f8cc800.png
[855bc1bfa4734459825d326cbabba9c3.png]: https://img-blog.csdnimg.cn/855bc1bfa4734459825d326cbabba9c3.png
[bd61a70a1dee48c08e67882028622d87.png]: https://img-blog.csdnimg.cn/bd61a70a1dee48c08e67882028622d87.png