Thymeleaf是什么,Thymeleaf快速入门(新手必看)
Thymeleaf 是一款非常优秀的服务器端页面模板引擎,适用于 Web 和独立环境,具有丰富的标签语言和函数,能够处理 HTML、XML、JavaScript 甚至文本。
Thymeleaf 相较于其他模板引擎更加优雅。它强调自然模板化(允许模板成为工作原型,而 Velocity、FreeMarker 模板不允许这样做),所以它的语法更干净,更符合当前 Web 开发的趋势。
Thymeleaf 亦是如此。Thymeleaf 将其逻辑注入模板控件中,而不会影响模板设计原型,所以可以在浏览器中正确显示 HTML 页面和数据,也可以在无后台时静态显示。由于 Thymeleaf 模板后缀为 .html,可以直接在浏览器中打开,预览非常方便。这样改善了设计人员与开发人员的沟通,弥合了设计人员和开发团队之间的差距,从而可以在开发团队中实现更强大的协作。
Spring Boot 官方推荐使用 Thymeleaf 作为前端页面模板,Spring Boot 2.0 中默认使用 Thymeleaf 3.0。同时 Spring Boot 也为 Thymeleaf 提供了 spring-boot-starter-thymeleaf 组件(集成了 Thymeleaf 模板引擎),还支持 Thymeleaf 自动装配,可以开箱即用。
下面通过一个简单的例子来演示 Spring Boot 是如何集成 Thymeleaf 的。

图 1 hello.html 页面显示效果
由图 1 可知,成功返回 hello.html 页面,并且通过 th:text="${name}" 标签,页面的默认值已经成功地被后端传入的内容所替换。说明 Thymeleaf 已经成功整合到我们的 Spring Boot 项目中。
Thymeleaf 使用非常简单,标签与 Html 基类似。但是,在使用 Thymeleaf 时还需要注意以下几个问题:
以下为 Thymeleaf 的配置和默认参数:
Thymeleaf 相较于其他模板引擎更加优雅。它强调自然模板化(允许模板成为工作原型,而 Velocity、FreeMarker 模板不允许这样做),所以它的语法更干净,更符合当前 Web 开发的趋势。
Thymeleaf的实现机制
模板的诞生是为了将显示与数据分离,模板技术多种多样,本质是将模板文件和数据通过模板引擎生成最终的 HTML 代码。Thymeleaf 亦是如此。Thymeleaf 将其逻辑注入模板控件中,而不会影响模板设计原型,所以可以在浏览器中正确显示 HTML 页面和数据,也可以在无后台时静态显示。由于 Thymeleaf 模板后缀为 .html,可以直接在浏览器中打开,预览非常方便。这样改善了设计人员与开发人员的沟通,弥合了设计人员和开发团队之间的差距,从而可以在开发团队中实现更强大的协作。
Thymeleaf的优点
Thymeleaf 与 Velocity、FreeMarker 等模板引擎类似,可以完全替代 JSP。与其他的模板引擎相比,Thymeleaf 具有如下优点:1) 动静结合
Thymeleaf 页面采用模板+数据的展示方式,既可以展示静态页面,也可以展示数据返回到页面后的动态效果。这是因为 Thymeleaf 支持 HTML 原型,可以在 HTML 原型上添加额外的属性,浏览器在解释 HTML 时会忽视未定义的属性,当定义的属性带数据时就会动态替换静态内容,实现页面动态展示。2) 开箱即用
Thymeleaf 提供标准方言和 Spring 方言,可以直接套用模板实现 JSTL、OGNL 表达式效果,避免套模板、改 JSTL、改标签的困扰。同时,开发人员也可以扩展和创建自定义的方言。3) 多方言支持
Thymeleaf 提供 spring 标准方言和一个与 Spring MVC 完美集成的可选模块,可以快速地实现表单绑定、属性编辑器、国际化等功能。4) 与Spring Boot完美整合
Spring Boot 提供了 Thymeleaf 的默认配置,并且为 Thymeleaf 设置了视图解析器,可以像操作 JSP 一样来操作 Thymeleaf。代码几乎没有任何区别,仅在模板语法上有所区别。Spring Boot 官方推荐使用 Thymeleaf 作为前端页面模板,Spring Boot 2.0 中默认使用 Thymeleaf 3.0。同时 Spring Boot 也为 Thymeleaf 提供了 spring-boot-starter-thymeleaf 组件(集成了 Thymeleaf 模板引擎),还支持 Thymeleaf 自动装配,可以开箱即用。
Spring Boot使用Thymeleaf
Spring Boot 对 Thymeleaf 提供了非常完整的支持,使得我们使用 Thymeleaf 非常简单,只需要引入 spring-boot-starter-thymeleaf 依赖库即可。下面通过一个简单的例子来演示 Spring Boot 是如何集成 Thymeleaf 的。
1) 添加Thymeleaf依赖
修改项目的 pom.xml 文件,添加 spring-boot-starter-thymeleaf 依赖配置:<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency>在上面的示例中,在 Spring Boot 项目中除了需要引入 spring-boot-starter-thymeleaf 依赖库外,还需要引入 spring-boot-starter-web 和 spring-boot-starter 等组件。
2) 配置Thymeleaf参数
如果需要对默认的 Thymeleaf 配置参数进行自定义,可直接在 application.properties 中配置修改:# 是否开启缓存,开发时可以设置为false,默认为true spring.thymeleaf.cache=false # 模板文件位置 spring.thymeleaf.prefix=classpath:/templates/ # Content-Type配置 spring.thymeleaf.servlet.content-type=text/html # 模板文件后缀 spring.thymeleaf.suffix=.html在上面的示例中,主要是配置 Thymeleaf 模板页面的存放位置。当然,也可以通过 application.properties 灵活地配置 Thymeleaf 的其他各项特性。其中,spring.thymeleaf.cache=false 用于关闭 Thymeleaf 的缓存,不然在开发过程中修改页面不会生效,需要重启,生产环境可配置为 true。
3) 创建Thymeleaf页面
Thymeleaf 模板后缀为 .html,在 resource\templates 模板存放目录下创建 hello.html 页面,示例代码如下:<!DOCTYPE html> <html lang="en" xmlns:th="http://www.thymeleaf.org"> <head lang="en"> <meta charset="UTF-8" /> <title></title> </head> <body> Thymeleaf模板引擎 <h1 th:text="${name}">Hello Thymeleaf</h1> </body> </html>在上面的示例中,我们创建了 hello.html 页面。此页面可直接双击来运行,页面会显示出“Hello Thymeleaf”。
4) 创建后台控制器(Controller)
在 Controller 目录中创建 HelloController 控制器并实现测试方法,示例代码如下:@Controller public class HelloController { @RequestMapping("/hello") public String hello(ModelMap map) { map.addAttribute("name", "Hello Thymeleaf From Spring Boot"); return "hello"; } }在上面的示例中,使用 @Controller 注解返回页面和数据。返回具体的 hello.html 页面,需要与前端 HTML 的路径保持一致,同时返回数据 name=Hello Thymeleaf。
5) 运行验证
至此,准备工作已经完成。启动项目后,在浏览器中输入网址 http://localhost:8080/hello,验证 Thymeleaf 配置是否成功,如下图所示:
图 1 hello.html 页面显示效果
由图 1 可知,成功返回 hello.html 页面,并且通过 th:text="${name}" 标签,页面的默认值已经成功地被后端传入的内容所替换。说明 Thymeleaf 已经成功整合到我们的 Spring Boot 项目中。
Thymeleaf 使用非常简单,标签与 Html 基类似。但是,在使用 Thymeleaf 时还需要注意以下几个问题:
- Thymeleaf 模板页面必须在 HTML 标签中声明 xmlns:th="http://www.thymeleaf.org/,表明页面使用的是 Thymeleaf 的语法,否则 Thymeleaf 的自定义标签没有提示;
- 在 application.properties 文件中配置的模板路径为 classpath:/templates/,模板的存放路径在 resource/templates 目录下;
- Spring Boot 默认存放模板页面的路径在 src/main/resources/templates 或者 src/main/view/templates,无论使用什么模板语言都一样,当然默认路径是可以自定义的,不过一般不推荐这样做;
- Thymeleaf 默认的页面文件后缀是 .html,也可以改成其他后缀。
Thymeleaf常用的配置参数
Thymeleaf 提供了很多可自定义的配置参数,只是这些 Spring Boot 都已经默认配置,如果需要自定义修改这些配置,可以通过 application.properties 配置文件灵活地配置 Thymeleaf 的各项特性。以下为 Thymeleaf 的配置和默认参数:
# THYMELEAF (ThymeleafAutoConfiguration) # 开启模板缓存(默认值:true) spring.thymeleaf.cache=true # 检查模板是否存在,然后呈现 spring.thymeleaf.check-template=true # 检查模板位置是否正确(默认值:true) spring.thymeleaf.check-template-location=true # Content-Type的值(默认值:text/html) spring.thymeleaf.content-type=text/html # 开启MVC Thymeleaf视图解析(默认值:true) spring.thymeleaf.enabled=true # 模板编码 spring.thymeleaf.encoding=UTF-8 # 要被排除在解析之外的视图名称列表,用逗号分隔 spring.thymeleaf.excluded-view-names= # 定义模板的模式(默认值:HTML5) spring.thymeleaf.mode=HTML5 # 在构建URL时添加到视图名称前的前缀(默认值:classpath:/templates/) spring.thymeleaf.prefix=classpath:/templates/ # 在构建URL时添加到视图名称后的后缀(默认值:.html) spring.thymeleaf.suffix=.html # Thymeleaf模板解析器在解析器链中的顺序,默认情况下,它排在第一位,顺序从1开始,只有在定义了额外的TemplateResolver Bean时才需要设置这个属性 spring.thymeleaf.template-resolver-order= # 可解析的视图名称列表,用逗号分隔 spring.thymeleaf.view-names=上面的 Thymeleaf 的属性配置看起来很多,其实常用的就是之前介绍的配置项。其他的配置项在实际项目中可以根据实际使用情况来修改。