JavaWeb-综合案例(用户信息)-学习笔记01【列表查询】

分手后的思念是犯贱 2022-10-29 15:35 213阅读 0赞

>  *  **[Java后端 学习路线 笔记汇总表【黑马程序员】][Java_ _]**
> 
> 1.  [JavaWeb-综合案例(用户信息)-学习笔记01【列表查询】][JavaWeb-_-_01]
> 2.  [JavaWeb-综合案例(用户信息)-学习笔记02【登录功能】][JavaWeb-_-_02]
> 3.  [JavaWeb-综合案例(用户信息)-学习笔记03【添加删除修改功能】][JavaWeb-_-_03]
> 4.  [JavaWeb-综合案例(用户信息)-学习笔记04【删除选中功能】][JavaWeb-_-_04]
> 5.  [JavaWeb-综合案例(用户信息)-学习笔记05【分页查询功能】][JavaWeb-_-_05]
> 6.  [JavaWeb-综合案例(用户信息)-学习笔记06【复杂条件查询功能】][JavaWeb-_-_06]

**目录**

三层架构：软件设计架构

案例：用户信息列表展示

步骤分析

案例资料

jar包

配置文件

页面

数据库设计

列表查询分析

案例效果

案例代码

druid.properties

package cn.itcast.dao;

UserDaoImpl.java

UserDao.java

package cn.itcast.domain;

User.java

package cn.itcast.service;

UserServiceImpl.java

UserService.java

package cn.itcast.util;

JDBCUtils.java

package cn.itcast.web;

UserListServlet.java

web页面

index.jsp

list.jsp

index.html

add.html

list.html

update.html

--------------------

# 三层架构：软件设计架构 #

> 1.  界面层(表示层)：用户看的得界面。用户可以通过界面上的组件和服务器进行交互。
> 2.  业务逻辑层：处理业务逻辑的。
> 3.  数据访问层：操作数据存储文件。

> ![20210216114237931.png][] 三层架构

# 案例：用户信息列表展示 #

## 步骤分析 ##

> 1. 需求：用户信息的增删改查操作  
> 2. 设计：  
>     1. 技术选型：Servlet + JSP + MySQL + JDBCTempleat + Duird + BeanUtilS + tomcat  
>     2. 数据库设计：  
>         create database day17; -- 创建数据库  
>         use day17;                -- 使用数据库  
>         create table user(   -- 创建表  
>             id int primary key auto\_increment,  
>             name varchar(20) not null,  
>             gender varchar(5),  
>             age int,  
>             address varchar(32),  
>             qq    varchar(20),  
>             email varchar(50)  
>         );  
> 3. 开发：  
>     1. 环境搭建  
>         1. 创建数据库环境  
>         2. 创建项目，导入需要的jar包  
>     2. 编码  
> 4. 测试  
> 5. 部署运维

## 案例资料 ##

> ![20210216114833393.png][]

### jar包 ###

> ![20210216114857723.png][]

### 配置文件 ###

> ![20210216114942261.png][]

### 页面 ###

> ![20210216115004474.png][]

## 数据库设计 ##

> **user表数据：**
> 
> INSERT  INTO \`user\`(\`id\`,\`name\`,\`gender\`,\`age\`,\`address\`,\`qq\`,\`email\`) VALUES (1,'张三','男',13,'陕西','12345','zhangsan@itcast.cn');  
> INSERT  INTO \`user\`(\`id\`,\`name\`,\`gender\`,\`age\`,\`address\`,\`qq\`,\`email\`) VALUES (2,'李四','女',15,'北京','88888','ls@itcast.cn');
> 
> ![20210216105152899.png][]  ![20210216114614883.png][]

## 列表查询分析 ##

> ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDk0OTEzNQ_size_16_color_FFFFFF_t_70][] 列表查询分析

# 案例效果 #

> ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDk0OTEzNQ_size_16_color_FFFFFF_t_70 1][]
> 
> ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDk0OTEzNQ_size_16_color_FFFFFF_t_70 2][]

# 案例代码 #

> ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDk0OTEzNQ_size_16_color_FFFFFF_t_70 3][]  ![20210216115805265.png][]

## druid.properties ##

driverClassName=com.mysql.jdbc.Driver
    url=jdbc:mysql:///day17
    username=root
    password=root
    # 初始化连接数量
    initialSize=5
    # 最大连接数
    maxActive=10
    # 最大等待时间
    maxWait=3000

## package cn.itcast.dao; ##

### UserDaoImpl.java ###

package cn.itcast.dao.impl;
    
    import cn.itcast.dao.UserDao;
    import cn.itcast.domain.User;
    import cn.itcast.util.JDBCUtils;
    import org.springframework.jdbc.core.BeanPropertyRowMapper;
    import org.springframework.jdbc.core.JdbcTemplate;
    
    import java.util.List;
    
    public class UserDaoImpl implements UserDao {
        private JdbcTemplate template = new JdbcTemplate(JDBCUtils.getDataSource());
        @Override
        public List<User> findAll() {
            //使用JDBC操作数据库...
            //1.定义sql
            String sql = "select * from user";
            List<User> users = template.query(sql, new BeanPropertyRowMapper<User>(User.class));
            return users;
        }
    }

### UserDao.java ###

package cn.itcast.dao;
    
    import cn.itcast.domain.User;
    
    import java.util.List;
    
    /**
     * 用户操作的DAO
     */
    public interface UserDao {
        public List<User> findAll();
    }

## package cn.itcast.domain; ##

### User.java ###

package cn.itcast.domain;
    
    public class User {
        private int id;
        private String name;
        private String gender;
        private int age;
        private String address;
        private String qq;
        private String email;
    
        public int getId() {
            return id;
        }
    
        public void setId(int id) {
            this.id = id;
        }
    
        public String getName() {
            return name;
        }
    
        public void setName(String name) {
            this.name = name;
        }
    
        public String getGender() {
            return gender;
        }
    
        public void setGender(String gender) {
            this.gender = gender;
        }
    
        public int getAge() {
            return age;
        }
    
        public void setAge(int age) {
            this.age = age;
        }
    
        public String getAddress() {
            return address;
        }
    
        public void setAddress(String address) {
            this.address = address;
        }
    
        public String getQq() {
            return qq;
        }
    
        public void setQq(String qq) {
            this.qq = qq;
        }
    
        public String getEmail() {
            return email;
        }
    
        public void setEmail(String email) {
            this.email = email;
        }
    
        @Override
        public String toString() {
            return "User{" +
                    "id=" + id +
                    ", name='" + name + '\'' +
                    ", gender='" + gender + '\'' +
                    ", age=" + age +
                    ", address='" + address + '\'' +
                    ", qq='" + qq + '\'' +
                    ", email='" + email + '\'' +
                    '}';
        }
    }

## package cn.itcast.service; ##

### UserServiceImpl.java ###

package cn.itcast.service.impl;
    
    import cn.itcast.dao.UserDao;
    import cn.itcast.dao.impl.UserDaoImpl;
    import cn.itcast.domain.User;
    import cn.itcast.service.UserService;
    
    import java.util.List;
    
    public class UserServiceImpl implements UserService {
        private UserDao dao = new UserDaoImpl();
        @Override
        public List<User> findAll() {
            //调用Dao完成查询
            return dao.findAll();
        }
    }

### UserService.java ###

package cn.itcast.service;
    
    import cn.itcast.domain.User;
    
    import java.util.List;
    
    /**
     * 用户管理的业务接口
     */
    public interface UserService {
        /**
         * 查询所有用户信息
         *
         * @return
         */
        public List<User> findAll();
    }

## package cn.itcast.util; ##

### JDBCUtils.java ###

package cn.itcast.util;
    
    import com.alibaba.druid.pool.DruidDataSourceFactory;
    
    import javax.sql.DataSource;
    import java.io.IOException;
    import java.io.InputStream;
    import java.sql.Connection;
    import java.sql.SQLException;
    import java.util.Properties;
    
    /**
     * JDBC工具类 使用Durid连接池
     */
    public class JDBCUtils {
    
        private static DataSource ds;
    
        static {
            try {
                //1.加载配置文件
                Properties pro = new Properties();
                //使用ClassLoader加载配置文件，获取字节输入流
                InputStream is = JDBCUtils.class.getClassLoader().getResourceAsStream("druid.properties");
                pro.load(is);
                //2.初始化连接池对象
                ds = DruidDataSourceFactory.createDataSource(pro);
            } catch (IOException e) {
                e.printStackTrace();
            } catch (Exception e) {
                e.printStackTrace();
            }
        }
    
        /**
         * 获取连接池对象
         */
        public static DataSource getDataSource() {
            return ds;
        }
    
        /**
         * 获取连接Connection对象
         */
        public static Connection getConnection() throws SQLException {
            return ds.getConnection();
        }
    
    }

## package cn.itcast.web; ##

### UserListServlet.java ###

package cn.itcast.web.servlet;
    
    import cn.itcast.domain.User;
    import cn.itcast.service.UserService;
    import cn.itcast.service.impl.UserServiceImpl;
    
    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 java.io.IOException;
    import java.util.List;
    
    @WebServlet("/userListServlet")
    public class UserListServlet extends HttpServlet {
        protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
            //1.调用UserService完成查询
            UserService service = new UserServiceImpl();
            List<User> users = service.findAll();
            //2.将list存入request域
            request.setAttribute("users", users);
            //3.转发到list.jsp
            request.getRequestDispatcher("/list.jsp").forward(request, response);
        }
    
        protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
            this.doPost(request, response);
        }
    }

## web页面 ##

### index.jsp ###

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <!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>
        
        <link href="css/bootstrap.min.css" rel="stylesheet">
        
        <script src="js/jquery-2.1.0.min.js"></script>
        
        <script src="js/bootstrap.min.js"></script>
        <script type="text/javascript">
        </script>
    </head>
    <body>
    <div align="center">
        <a href="${pageContext.request.contextPath}/userListServlet" style="text-decoration:none;font-size:33px">查询所有用户信息</a>
    </div>
    </body>
    </html>

### list.jsp ###

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    <!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>
        
        <link href="css/bootstrap.min.css" rel="stylesheet">
        
        <script src="js/jquery-2.1.0.min.js"></script>
        
        <script src="js/bootstrap.min.js"></script>
        <style type="text/css">
            td, th {
                text-align: center;
            }
        </style>
    </head>
    <body>
    <div class="container">
        <h3 style="text-align: center">用户信息列表</h3>
        <table border="1" class="table table-bordered table-hover">
            <tr class="success">
                <th>编号</th>
                <th>姓名</th>
                <th>性别</th>
                <th>年龄</th>
                <th>籍贯</th>
                <th>QQ</th>
                <th>邮箱</th>
                <th>操作</th>
            </tr>
            <c:forEach items="${users}" var="user" varStatus="s">
                <tr>
                    <td>${s.count}</td>
                    <td>${user.name}</td>
                    <td>${user.gender}</td>
                    <td>${user.age}</td>
                    <td>${user.address}</td>
                    <td>${user.qq}</td>
                    <td>${user.email}</td>
                    <td><a class="btn btn-default btn-sm" href="update.html">修改</a> <a class="btn btn-default btn-sm" href="">删除</a></td>
                </tr>
            </c:forEach>
            <tr>
                <td colspan="8" align="center"><a class="btn btn-primary" href="add.html">添加联系人</a></td>
            </tr>
        </table>
    </div>
    </body>
    </html>

### index.html ###

### add.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>
        
        <link href="css/bootstrap.min.css" rel="stylesheet">
        
        <script src="js/jquery-2.1.0.min.js"></script>
        
        <script src="js/bootstrap.min.js"></script>
    </head>
    <body>
    <div class="container">
        <center><h3>添加联系人页面</h3></center>
        <form action="" method="post">
            <div class="form-group">
                <label for="name">姓名：</label>
                <input type="text" class="form-control" id="name" name="name" placeholder="请输入姓名">
            </div>
            <div class="form-group">
                <label>性别：</label>
                <input type="radio" name="sex" value="男" checked="checked"/>男
                <input type="radio" name="sex" value="女"/>女
            </div>
            <div class="form-group">
                <label for="age">年龄：</label>
                <input type="text" class="form-control" id="age" name="age" placeholder="请输入年龄">
            </div>
            <div class="form-group">
                <label for="address">籍贯：</label>
                <select name="address" class="form-control" id="jiguan">
                    <option value="广东">广东</option>
                    <option value="广西">广西</option>
                    <option value="湖南">湖南</option>
                </select>
            </div>
            <div class="form-group">
                <label for="qq">QQ：</label>
                <input type="text" class="form-control" name="qq" placeholder="请输入QQ号码"/>
            </div>
            <div class="form-group">
                <label for="email">Email：</label>
                <input type="text" class="form-control" name="email" placeholder="请输入邮箱地址"/>
            </div>
            <div class="form-group" style="text-align: center">
                <input class="btn btn-primary" type="submit" value="提交"/>
                <input class="btn btn-default" type="reset" value="重置"/>
                <input class="btn btn-default" type="button" value="返回"/>
            </div>
        </form>
    </div>
    </body>
    </html>

### list.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>
        
        <link href="css/bootstrap.min.css" rel="stylesheet">
        
        <script src="js/jquery-2.1.0.min.js"></script>
        
        <script src="js/bootstrap.min.js"></script>
        <style type="text/css">
            td, th {
                text-align: center;
            }
        </style>
    </head>
    <body>
    <div class="container">
        <h3 style="text-align: center">用户信息列表</h3>
        <table border="1" class="table table-bordered table-hover">
            <tr class="success">
                <th>编号</th>
                <th>姓名</th>
                <th>性别</th>
                <th>年龄</th>
                <th>籍贯</th>
                <th>QQ</th>
                <th>邮箱</th>
                <th>操作</th>
            </tr>
            <tr>
                <td>1</td>
                <td>张三</td>
                <td>男</td>
                <td>20</td>
                <td>广东</td>
                <td>44444222</td>
                <td>zs@qq.com</td>
                <td><a class="btn btn-default btn-sm" href="update.html">修改</a> <a class="btn btn-default btn-sm" href="">删除</a></td>
            </tr>
            <tr>
                <td>2</td>
                <td>张三</td>
                <td>男</td>
                <td>20</td>
                <td>广东</td>
                <td>44444222</td>
                <td>zs@qq.com</td>
                <td><a class="btn btn-default btn-sm" href="update.html">修改</a> <a class="btn btn-default btn-sm" href="">删除</a></td>
            </tr>
            <tr>
                <td>3</td>
                <td>张三</td>
                <td>男</td>
                <td>20</td>
                <td>广东</td>
                <td>44444222</td>
                <td>zs@qq.com</td>
                <td><a class="btn btn-default btn-sm" href="update.html">修改</a> <a class="btn btn-default btn-sm" href="">删除</a></td>
            </tr>
            <tr>
                <td>4</td>
                <td>张三</td>
                <td>男</td>
                <td>20</td>
                <td>广东</td>
                <td>44444222</td>
                <td>zs@qq.com</td>
                <td><a class="btn btn-default btn-sm" href="update.html">修改</a> <a class="btn btn-default btn-sm" href="">删除</a></td>
            </tr>
            <tr>
                <td>5</td>
                <td>张三</td>
                <td>男</td>
                <td>20</td>
                <td>广东</td>
                <td>44444222</td>
                <td>zs@qq.com</td>
                <td><a class="btn btn-default btn-sm" href="update.html">修改</a> <a class="btn btn-default btn-sm" href="">删除</a></td>
            </tr>
            <tr>
                <td colspan="8" align="center"><a class="btn btn-primary" href="add.html">添加联系人</a></td>
            </tr>
        </table>
    </div>
    </body>
    </html>

### 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>
        
        <link href="css/bootstrap.min.css" rel="stylesheet">
        
        <script src="js/jquery-2.1.0.min.js"></script>
        
        <script src="js/bootstrap.min.js"></script>
        <script type="text/javascript">
        </script>
    </head>
    <body>
    <div class="container" style="width: 400px;">
        <h3 style="text-align: center;">管理员登录</h3>
        <form action="login" method="post">
            <div class="form-group">
                <label for="user">用户名：</label>
                <input type="text" name="user" class="form-control" id="user" 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="verifycode" class="form-control" id="verifycode" placeholder="请输入验证码" style="width: 120px;"/>
                <a href="javascript:refreshCode()"><img src="vcode" title="看不清点击刷新" id="vcode"/></a>
            </div>
            <hr/>
            <div class="form-group" style="text-align: center;">
                <input class="btn btn btn-primary" type="submit" value="登录">
            </div>
        </form>
        
        <div class="alert alert-warning alert-dismissible" role="alert">
            <button type="button" class="close" data-dismiss="alert">
                <span>×</span></button>
            <strong>登录失败!</strong>
        </div>
    </div>
    </body>
    </html>

### update.html ###

<!DOCTYPE html>
    
    <html lang="zh-CN">
    <head>
        <base href="<%=basePath%>"/>
        
        <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>
    
        <link href="css/bootstrap.min.css" rel="stylesheet">
        <script src="js/jquery-2.1.0.min.js"></script>
        <script src="js/bootstrap.min.js"></script>
    
    </head>
    <body>
    <div class="container" style="width: 400px;">
        <h3 style="text-align: center;">修改联系人</h3>
        <form action="" method="post">
            <div class="form-group">
                <label for="name">姓名：</label>
                <input type="text" class="form-control" id="name" name="name" readonly="readonly" placeholder="请输入姓名"/>
            </div>
            <div class="form-group">
                <label>性别：</label>
                <input type="radio" name="sex" value="男"/>男
                <input type="radio" name="sex" value="女"/>女
            </div>
            <div class="form-group">
                <label for="age">年龄：</label>
                <input type="text" class="form-control" id="age" name="age" placeholder="请输入年龄"/>
            </div>
            <div class="form-group">
                <label for="address">籍贯：</label>
                <select name="address" class="form-control">
                    <option value="广东">广东</option>
                    <option value="广西">广西</option>
                    <option value="湖南">湖南</option>
                </select>
            </div>
            <div class="form-group">
                <label for="qq">QQ：</label>
                <input type="text" class="form-control" name="qq" placeholder="请输入QQ号码"/>
            </div>
            <div class="form-group">
                <label for="email">Email：</label>
                <input type="text" class="form-control" name="email" placeholder="请输入邮箱地址"/>
            </div>
            <div class="form-group" style="text-align: center">
                <input class="btn btn-primary" type="submit" value="提交"/>
                <input class="btn btn-default" type="reset" value="重置"/>
                <input class="btn btn-default" type="button" value="返回"/>
            </div>
        </form>
    </div>
    </body>
    </html>

>       《醒世诗》明朝状元·罗殿
> 
> 急急忙忙苦追求，寒寒暖暖度春秋。  
> 朝朝暮暮营家计，昧昧昏昏为己谋。  
> 是是非非何日了，烦烦恼恼几时休。  
> 明明白白一条路，万万千千不肯修。

[Java_ _]: https://blog.csdn.net/weixin_44949135/article/details/113773297
[JavaWeb-_-_01]: https://blog.csdn.net/weixin_44949135/article/details/113823440
[JavaWeb-_-_02]: https://blog.csdn.net/weixin_44949135/article/details/113822709
[JavaWeb-_-_03]: https://blog.csdn.net/weixin_44949135/article/details/113824663
[JavaWeb-_-_04]: https://blog.csdn.net/weixin_44949135/article/details/113826067
[JavaWeb-_-_05]: https://blog.csdn.net/weixin_44949135/article/details/113826657
[JavaWeb-_-_06]: https://blog.csdn.net/weixin_44949135/article/details/113827460
[20210216114237931.png]: /images/20221024/7673e55271e948d0a7a032c9e36418c7.png
[20210216114833393.png]: /images/20221024/f64f198389a74838b0143c95d4faffdc.png
[20210216114857723.png]: /images/20221024/a8a9ff8bb99a43be8f884a24fbaf219c.png
[20210216114942261.png]: /images/20221024/a4c6c5bd89c04544b9fb781763da5d2c.png
[20210216115004474.png]: /images/20221024/485cfd6f6bfb4d33ad06bdbfad2332a1.png
[20210216105152899.png]: https://img-blog.csdnimg.cn/20210216105152899.png
[20210216114614883.png]: /images/20221024/467d8632b4da48e1a74507807d7358f8.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDk0OTEzNQ_size_16_color_FFFFFF_t_70]: /images/20221024/b22db9cb54564408a762886cf08faa7b.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDk0OTEzNQ_size_16_color_FFFFFF_t_70 1]: /images/20221024/27456ae02cd2409aab8f23385ba1addd.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDk0OTEzNQ_size_16_color_FFFFFF_t_70 2]: /images/20221024/b887a432a89845c3b702dfeb687ec319.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDk0OTEzNQ_size_16_color_FFFFFF_t_70 3]: https://img-blog.csdnimg.cn/20210216115729992.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDk0OTEzNQ==,size_16,color_FFFFFF,t_70
[20210216115805265.png]: /images/20221024/752e058b1f6f40e597cf242748230b00.png