Servlet学习(6)—— thymeleaf

thymeleaf可以让html页面显示从数据库查询出来的数据

一. 添加thymeleaf相关的jar包

二. 创建ViewBaseServlet类

package ServletStudy;

import org.thymeleaf.TemplateEngine;
import org.thymeleaf.context.WebContext;
import org.thymeleaf.templatemode.TemplateMode;
import org.thymeleaf.templateresolver.ServletContextTemplateResolver;

import javax.servlet.ServletContext;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

public class ViewBaseServlet extends HttpServlet {

    private TemplateEngine templateEngine;

    @Override
    public void init() throws ServletException {

        // 1.获取ServletContext对象
        ServletContext servletContext = this.getServletContext();

        // 2.创建Thymeleaf解析器对象
        ServletContextTemplateResolver templateResolver = new ServletContextTemplateResolver(servletContext);

        // 3.给解析器对象设置参数
        // ①HTML是默认模式,明确设置是为了代码更容易理解
        templateResolver.setTemplateMode(TemplateMode.HTML);

        // ②设置前缀
        String viewPrefix = servletContext.getInitParameter("view-prefix");

        templateResolver.setPrefix(viewPrefix);

        // ③设置后缀
        String viewSuffix = servletContext.getInitParameter("view-suffix");

        templateResolver.setSuffix(viewSuffix);

        // ④设置缓存过期时间(毫秒)
        templateResolver.setCacheTTLMs(60000L);

        // ⑤设置是否缓存
        templateResolver.setCacheable(true);

        // ⑥设置服务器端编码方式
        templateResolver.setCharacterEncoding("utf-8");

        // 4.创建模板引擎对象
        templateEngine = new TemplateEngine();

        // 5.给模板引擎对象设置模板解析器
        templateEngine.setTemplateResolver(templateResolver);

    }

    //之后所需要用的方法
    protected void processTemplate(String templateName, HttpServletRequest req, HttpServletResponse resp) throws IOException {
        // 1.设置响应体内容类型和字符集
        resp.setContentType("text/html;charset=UTF-8");

        // 2.创建WebContext对象
        WebContext webContext = new WebContext(req, resp, getServletContext());

        // 3.处理模板数据
        templateEngine.process(templateName, webContext, resp.getWriter());
    }
}

三. 在web.xml中配置

<?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">

    <!--配置上下文参数-->
    <context-param>
        <param-name>view-prefix</param-name>     <!--配置前缀-->
        <param-value>/</param-value>  
    </context-param>
    <context-param>
        <param-name>view-suffix</param-name>    <!--配置后缀-->
        <param-value>.html</param-value>
    </context-param>
</web-app>

四. 创建一个类来继承ViewBaseServlet类

package ServletStudy;

import dao.UserDao;
import dao.impl.UserDaoImpl;
import pojo.User;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.IOException;
import java.util.List;

@WebServlet("/index.html")   
public class IndexServlet extends ViewBaseServlet{
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        UserDao userDao = new UserDaoImpl();
        List<User> userList = userDao.queryUserList();  //获取数据库中所有用户信息

        //保存到session作用域
        HttpSession session = req.getSession();
        session.setAttribute("userList",userList);

        //此处的视图名称是index
        //thymeleaf会将这个逻辑视图名称对应到物理视图名称上
        //逻辑视图名称:index
        //物理视图名称:view-prefix + 逻辑视图名称 + view-suffix
        //则真实的视图名称是: / index .html   (在web.xml里配置的)
        super.processTemplate("index",req,resp);     //将thymeleaf渲染到/index.html
    }
}

五. 在index.html内添加thymeleaf语句

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel = "stylesheet" href = "index.css">
</head>
<body>
<div id="div_container">
    <table id="user_table">
        <tr>
            <th class = "cell_width">姓名</th>
            <th class = "cell_width">密码</th>
            <th class = "cell_width">性别</th>
            <th class = "cell_width">国家</th>
        </tr>
        <tr th:if="${#lists.isEmpty(session.userList)}">
            <td colspan="4">数据库为空</td>
        </tr>
        <tr th:unless="${#lists.isEmpty(session.userList)}" th:each="user:${session.userList}">
            <td th:text="${user.username}"></td>
            <td th:text="${user.password}"></td>
            <td th:text="${user.sex}"></td>
            <td th:text="${user.country}"></td>
        </tr>
    </table>
</div>
</body>
</html>

在html里使用thymeleaf语句出现报错红线问题: https://blog.csdn.net/H_233/article/details/88081353

最终可以将数据库中每个user的内容渲染到html页面对应位置。

  • 0
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值