正文

认识模板引擎-thymeleaf(代码片段)

一朵花花  一朵花花  2022-11-30  399

关键词：

模板引擎

什么是模板引擎？

【作用】模板引擎就是为了使用户界面与业务数据(内容)分离而产生的，它可以分离 Servlet Java 代码和 Html 网页代码(这是相对于 Servlet 直接返回动态页面来说，模板引擎的优点)

原理 / 流程

Thymeleaf 使用流程

Thymeleaf 是 Java 中的模板引擎，当前最流行的一种

1. 通过 maven 引入依赖

在 maven 中央仓库搜索 Thymeleaf

选择一个合适的版本，如：3.0.12

<!-- https://mvnrepository.com/artifact/org.thymeleaf/thymeleaf -->
<dependency>
    <groupId>org.thymeleaf</groupId>
    <artifactId>thymeleaf</artifactId>
    <version>3.0.12.RELEASE</version>
</dependency>

引入依赖后，一定记得要刷新 Maven 面板
注意: web项目需要打包为 war格式 —— < packaging>war< /packaging>

2. 创建 Html 模板文件

创建 hello.html，放到 webapp / WEB-INF / templates 目录中

<h3 th:text="$message"></h3>

举例:

<body>
    <h3>网页模板技术学习</h3>
    <p th:text="$message"></p>
</body>

会发现，有飘红：

th:text 是 Thymeleaf 的语法，浏览器不能直接识别 th:text 属性

3. 编写 Servlet 代码

创建一个模板引擎和一个网页模板解析器
设置渲染时编码
设置网页模板文件，路径的前缀和后缀
将模板解析器绑定到模板引擎中
创建一个web上下文（环境的语义，里面是map结构，存放键值对数据）
设置键值对的数据
返回渲染后的网页字符串到响应正文

@WebServlet("/hello")
public class helloServlet extends HttpServlet 
    // 一般是浏览器地址栏输入 url 来访问网页,都是get方法
    // 模板引擎都是返回 html，所以重写 doGet
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException 
        resp.setContentType("text/html;charset=utf-8");
        // 使用 thymeleaf 模板技术
        // 创建一个模板引擎
        TemplateEngine engine = new TemplateEngine();

        // 创建一个网页模板的解析器: getServletContext() 是 HttpServlet中的方法，返回 Servlet 上下文对象
        ServletContextTemplateResolver resolver = new ServletContextTemplateResolver(getServletContext());

        // 设置渲染时的编码
        resolver.setCharacterEncoding("utf-8");

        // 设置网页模板文件，路径的前缀和后缀
        resolver.setPrefix("/WEB-INF/templates/"); // 前缀
        resolver.setSuffix(".html");  // 后缀

        // 将模板解析器绑定到模板引擎中
        engine.setTemplateResolver(resolver);

        // 创建一个web上下文(环境的语义，里边有一个map结构，可以存放键值对的数据)
        WebContext webContext = new WebContext(req,resp,getServletContext());
        // 设置了一个键值对数据，可以理解为: 为网页模板定义了一个变量，变量名为 message，值为 "hello模板引擎"
        // queryString 传入msg=xxx
        webContext.setVariable("message",req.getParameter("msg"));

        // 模板引擎渲染网页模板: 第一个参数为模板名称，第二个参数为 web上下文(里边保存了数据)
        // 会根据模板解析器设置的前缀+模板名称+后缀. 为模板路径，查找到模板，再组织模板内容+数据
        // 返回值就是渲染后的网页字符串
        String html = engine.process("hello",webContext);
        resp.getWriter().write(html);

启动服务，刷新页面:

每次请求都创建一个模板引擎和一个网页模板解析器，效率是比较低的，也没有必要，我们可以重写一个 init 方法，因为 init 只执行一次，而 doGet 方法每次请求都会执行，可以将创建模板引擎和创建网页模板解析器的代码放到 init 方法里

@Override
public void init() throws ServletException 
    // 创建一个模板引擎
    TemplateEngine engine = new TemplateEngine();

    // 创建一个网页模板的解析器: getServletContext() 是 HttpServlet中的方法，返回 Servlet 上下文对象
    ServletContextTemplateResolver resolver = new ServletContextTemplateResolver(getServletContext());
    // 设置渲染时的编码
    resolver.setCharacterEncoding("utf-8");

    // 设置网页模板文件，路径的前缀和后缀
    resolver.setPrefix("/WEB-INF/templates/"); // 前缀
    resolver.setSuffix(".html");  // 后缀

    // 将模板解析器绑定到模板引擎中
    engine.setTemplateResolver(resolver);

但是此时，会发现代码会有飘红:

把 TemplateEngine engine = new TemplateEngine(); 放到 init() 方法外即

重新启动，刷新页面:
(效率得到了提高)

Thymeleaf 常用模板语法

命令	功能
th: text	在标签体中展示表达式求值结果的文本内容
th: [HTML标签属性]	设置任意的 HTML 标签属性的值
th: if	当表达式的结果为真时则显示内容，否则不显示
th: each	循环访问元素

$变量名，来引用 Java 代码中，设置的键值对数据 ( $键就是值 )

注意： 网站的绝对路径还是要加 http:// ，需要写全
举例:
webContext.setVariable("a1","http://www.baidu.com");

理解只创建一个引擎实例

整个web应用，只需要初始化一次(代码中的对象engine，resolver，只需要创建一次)
(原因：对象及属性不会改变)，在文章前面部分，也提出了改进方法，放在 Servlet 的 init() 方法里

但仍然还存在问题: 每个 Servlet 都需要在 init 方法中创建，一个 webapp 中，还是有很多个engine，resolver对象
每个需要渲染页面的 Servlet 类都需要创建一个 TemplateEngine 实例并初始化，其实是完全没有必要的！

一个完整的项目中，只需要创建一个 TemplateEngine，并且只初始化一次即可
为了改进上边出现的问题，需要使用 Servlet 中的 ①ServletContext 和 ②"监听器"

ServletContext

ServletContext是一个 Servlet 程序中全局的储存信息的空间，服务器开始就存在，服务器关闭才销毁

如下图关系:

Tomcat 在启动时，它会为每个 webapp 都创建一个对应的 ServletContext.
一个 Web应用中的所有 Servlet 共享同一个 ServletContext 对象
可以通过 HttpServlet.getServletContext() 或者 HttpServletRequest.getServletContext() 获取到当前 webapp 的 ServletContext 对象

理解 Context: 上下文 / 环境；常用于设置一些数据到上下文环境中；上下文环境中的对象就可以互相引用对方的数据 (很多地方都有 Context 这样的概念，它是一个语义的概念)

即：
多个 Servlet 之间，无法直接传递数据，但可以通过共享的一个上下文环境，来设置 / 使用一些数据 (数据传递)
ServletContext 类似于 Map 结构，存放多组键值对数据

ServletContext 对象的重要方法

方法	描述
void setAttribute(String name, Objectobj)	设置属性(键值对)
Object getAttribute(String name)	根据属性名获取属性值，如果 name 不存在，返回 null
void removeAttribute(String name)	删除对应的属性

可以看到 ServletContext 和 HttpSession 类很类似，也是在内部组织了若干个键值对结构，相当于一个哈希表；此时同一个 webapp 的多个 Servlet 之间就可以通过 ServletContext 来共享数据

代码示例：多个 Servlet 共享数据

1) 创建 ContextWriteServlet 类

@WebServlet("/write")
public class ContextWriteServlet extends HttpServlet 

    // write?data=xxx
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException 
        String data = req.getParameter("data");
        // 把数据写入 Servlet 共享的上下文环境
        ServletContext sc = getServletContext();
        sc.setAttribute("d",data);

        resp.setContentType("text/html;charset=utf-8");
        resp.getWriter().write("写入Context成功!");

2) 创建 ContextReadServlet 类

@WebServlet("/read")
public class ContextReadServlet extends HttpServlet 
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException 
        // 把数据写入 Servlet 共享的上下文环境
        ServletContext sc = getServletContext();
        Object data = sc.getAttribute("d");

        resp.setContentType("text/html;charset=utf-8");
        resp.getWriter().write("读取Context:" + data);

启动服务，打开页面:

如果我们不访问 /write，直接访问 /read，那么此时得到的 data 是 null：

监听器 Listener

监听器，属于一种设计模式

比如： 前边学些的，在 html / js 中，为一个 DOM 元素，绑定一个事件 (事件注册)，不需要手动调用该事件的函数，而是在事件发生时，由浏览器来调用事件绑定的函数
这个"事件"，其实就是监听器的设计模式
若我们自己设计，可能是：事件发生，执行一段代码 (耦合性太强)；而上边例子是事件发生需要执行的代码，和事件发生，两个解耦

在 Servlet 运行过程中，会有一些特殊的 “时机”，可以供我们来执行一些我们自定义的逻辑
监听器就是让程序猿可以在这些特殊时机 “插入代码”

监听器优点小结：

将事件发生和事件发生后需要执行的代码进行解耦合
事先注册一个函数或方法到监听器，在某个事件发生后，自动执行

代码示例：监听 ServletContext 的创建

步骤：

首先创建一个类
添加@WebListener 注解修饰，否则 Tomcat 不能识别
实现 ServletContextListener 接口，并实现两个方法 contextInitialized 和 contextDestroyed

@WebListener
public class MyListener implements ServletContextListener 
@WebListener
public class MyListener implements ServletContextListener 
    @Override
    public void contextInitialized(ServletContextEvent sce) 
        // 这个会在 context 被创建的时候调用.
        // 创建的时机在所有 Servlet 实例化之前.
    
    @Override
    public void contextDestroyed(ServletContextEvent sce) 
        // 这个会在 context 被销毁的时候调用

认识模板引擎-thymeleaf(代码片段)

模板引擎什么是模板引擎？原理/流程Thymeleaf使用流程1.通过maven引入依赖2.创建Html模板文件3.编写Servlet代码Thymeleaf常用模板语法理解只创建一个引擎实例ServletContext代码示例：多个Servlet共享数据监听器Listener代码示例：... 查看详情

springboot——springboot集成thymeleaf(代码片段)

文章目录：1.认识Thymeleaf2.详细步骤2.1创建一个SpringBoot项目2.2在pom.xml文件中会自动添加SpringBoot集成Thymeleaf的起步依赖2.3在核心配置文件中添加以下内容2.4写一个Controller控制层2.5写一个html页面2.6启动测试1.认识Thymeleaf Thymeleaf... 查看详情

thymeleaf模板引擎(代码片段)

第九章Thymeleaf模板引擎9.1认识ThymeleafThymeleaf是另外的一种模板技术，它本身并不属于SpringBoot，SpringBoot只是很好地集成这种模板技术，作为前端页面的数据展示。使用java开发的模板技术，在服务器端运行。把处理... 查看详情

模板引擎thymeleaf介绍及使用(代码片段)

...擎2.1模板引擎介绍2.2模板引擎的作用2.3常见的模板引擎3.Thymeleaf3.1Thymeleaf介绍3.2Thymeleaf语法规则3.2.1标准表达式语法3.2.2th属性3.3Thymeleaf使用流程1.服务器生成动态页查看详情

模板引擎thymeleaf介绍及使用(代码片段)

❤️springboot模板引擎❤️——thymeleaf(代码片段)

目录模板引擎简介引入Thymeleaf模板引擎分析Thymeleaf模板引擎测试Thymeleaf模板引擎Thymeleaf入门： thymeleaf语法学习练习测试总结：模板引擎简介jsp有着强大的功能，能查出一些数据转发到JSP页面以后，我们可以用j... 查看详情

springboot第九章thymeleaf模板引擎(代码片段)

thymeleaf搜索模板引擎(代码片段)

1.Thymeleaf是什么?Thymeleaf是一种用于Web和独立环境的现代服务器端的Java模板引擎。Thymeleaf的主要目标是将优雅的自然模板带到开发工作流程中，并将HTML在浏览器中正确显示，并且可以作为静态原型，让开发团队能更容易地协作。T... 查看详情

thymeleaf模板引擎(代码片段)

Springboot需要使用thymeleaf模板引擎来编写前端页面，代替了SSM中的JSPcontroller的return页面的路径，默认为resources下的template 查看thymeleaf的配置文件，在template下默认使用.html页面 thymeleaf的语法：在html中导入thymeleaf的命名... 查看详情

thymeleaf-模板引擎(代码片段)

一，Thymeleaf简介Thymeleaf是一个跟Velocity、FreeMarker类似的模板引擎，它可以完全替代JSP。相较与其他的模板引擎，它有如下三个极吸引人的特点：1，Thymeleaf在有网络和无网络的环境下皆可运行，即它可以让美工在浏览器查看页面... 查看详情

thymeleaf模板引擎学习(代码片段)

...SpringBoot中已经不推荐使用JSP页面进行页面渲染了。从而Thymeleaf提供了一个用于整合SpringMVC的可选模块，在应用开发中，你可以使用Thymeleaf来完全代替JSP，或其他模板引擎，如Velocity、FreeMarker等。它的语法与我们以前使用的EL表达... 查看详情

thymeleaf模板引擎的使用(代码片段)

Thymeleaf模板引擎的使用一、模板引擎JSP、Velocity、Freemarker、Thymeleaf二、springboot推荐使用Thymeleaf模板引擎特点：语法更简单，功能更强大；1、引入Thymeleaf<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-bo... 查看详情

使用thymeleaf模板引擎(代码片段)

...必须为自己生气而道歉。】新书购买戳图购买>>>4.1Thymeleaf模板引擎介绍4.1.1Thymeleaf概述Thymeleaf是一个优秀的面向Java的XML/XHTML/HTML5页面模板，并具有丰富的标签语言和函数。因此& 查看详情

thymeleaf使用详解(代码片段)

Thymeleaf是一款用于渲染XML/XHTML/HTML5内容的模板引擎。类似JSP，Velocity，FreeMaker等，它也可以轻易的与SpringMVC等Web框架进行集成作为Web应用的模板引擎。与其它模板引擎相比，Thymeleaf最大的特点是能够直接在浏览器中打开并正确显... 查看详情

014新的模板引擎(代码片段)

一.概述　　在springboot之中,抛弃了默认的thymeleaf作为模板引擎. 二.环境的搭建[1]配置依赖包　　我们首先需要声明的就是我们使用thymeleaf3来完成任务,比2要友好很多的.<properties><thymeleaf.version>3.0.2.RELEASE</thymeleaf.vers... 查看详情

springboot的推荐模板引擎-thymeleaf(代码片段)

1）添加对themeleaf的支持的依赖<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-thymeleaf</artifactId></dependency> 查看详情

11.模板引擎(代码片段)

1.模板引擎的分类　　JSP、Velocity、Freemarker、Thymeleaf（SpringBoot推荐）2.模板引擎的功能3.thymeleaf的使用3.1.thymeleaf的引入<properties><thymeleaf.version>3.0.9.RELEASE</thymeleaf.version><thymeleaf-layout-dialect.version>2.2.2</thymeleaf-lay... 查看详情

thymeleaf模板引擎基础知识(代码片段)

一、表达式分为四类：1.变量表达式$：获取容器上下文变量的值。举例：获取application域中的username：$application.username获取session域中的username：$session.username获取request域中的username：$request.username. 注意：没有使用域对象，直接... 查看详情

正文

认识模板引擎-thymeleaf(代码片段)

模板引擎

什么是模板引擎 ？

原理 / 流程

Thymeleaf 使用流程

1. 通过 maven 引入依赖

2. 创建 Html 模板文件

3. 编写 Servlet 代码

Thymeleaf 常用模板语法

理解只创建一个引擎实例

ServletContext

代码示例：多个 Servlet 共享数据

监听器 Listener

代码示例：监听 ServletContext 的创建

认识模板引擎-thymeleaf(代码片段)

springboot——springboot集成thymeleaf(代码片段)

thymeleaf模板引擎(代码片段)

模板引擎thymeleaf介绍及使用(代码片段)

模板引擎thymeleaf介绍及使用(代码片段)

❤️springboot模板引擎❤️——thymeleaf(代码片段)

springboot第九章thymeleaf模板引擎(代码片段)

thymeleaf搜索模板引擎(代码片段)

thymeleaf模板引擎(代码片段)

thymeleaf-模板引擎(代码片段)

thymeleaf模板引擎学习(代码片段)

thymeleaf模板引擎的使用(代码片段)

使用thymeleaf模板引擎(代码片段)

thymeleaf使用详解(代码片段)

014新的模板引擎(代码片段)

springboot的推荐模板引擎-thymeleaf(代码片段)

11.模板引擎(代码片段)

thymeleaf模板引擎基础知识(代码片段)

什么是模板引擎？