Spring Boot的Web应用开发之模板引擎!
moboyou 2025-06-13 07:53 24 浏览
模板引擎
模板引擎是为了使用户界面与业务数据分离而产生的,它具有丰富的功能,可以生成特定格式的页面,在Web开发中的模板引擎最后会生成一个标准的HTML文档。模板引擎的解析过程如图4.1所示,其把数据和静态模板相互匹配后,数据会替换其中的变量,最后形成HTML页面展示给用户。
对于模板引擎来说,将数据渲染到模板上通常需要以下几步:
(1)利用正则表达式分解出普通字符串和模板标识符。
(2)将模板标识符转换成普通的语言表达形式。
(3)生成待执行语句。
(4)将数据填入执行,生成最终的字符串。
目前,在Java开发中常用的模板引擎有Freemaker、Thymeleaf、JSP、JSF和Velocity,它们各有优缺点,本节将介绍不使用JSP的原因,然后再介绍如何使用Thymeleaf。
放弃JSP模板引擎
JSP全称为Java Server Pages,是Sun公司在HTML技术出现之后发布的一种全新的Java动态网页开发技术。它可以直接使用HTML代码,也可以在页面中插入Java代码,能非常方便地把动态数据渲染到静态页面上并最终展示给用户。
在项目开发中使用JSP有以下优点:
JSP的动态部分用Java编写,因此功能更加强大、易用,并且具有跨平台性,方便移植。
同时兼具了HTML和Java的优点,静态部分是HTML代码,动态部分由Java编写,支持多种网页格式。
可以完成很复杂的功能。
官方标准,用户群庞大,JSP标签可扩充,有非常丰富的第三方JSP标签库。
JSP可编译成class文件来执行,性能优异。
虽然JSP有以上5个优点,但是目前的项目开发中很少再使用JSP了,因为它的缺点也非常明显,主要有3个:
使用JSP增加了产品的复杂性。HTML的代码和Java代码全部混合在一起,有的开发人员甚至不需要专门的Java文件,全部代码都在.JSP中,一个JSP文件中动辄几万行代码,从而使后期的开发和维护成本非常高,甚至难以维护。
JSP页面最后都编译成了.class文件,全部内容都在内存中,非常消耗资源。
JSP页面调试困难,JSP页面在执行时都被编译为字节码文件,如果在一个页面上报错了,则需要一处一处地去修改、验证,非常烦琐。
在使用Spring Boot进行开发时,如果模板引擎选择JSP,那么在Tomcat中JSP是不能在嵌套的Tomcat容器中被解析和显示的,即不能在打包成可执行的jar的情况下解析出来,完成页面的显示。Jetty嵌套的容器不支持JSP,Spring官方不建议在项目中使用JSP开发。
因此,在使用Spring Boot进行开发时,一般不会选择JSP作为模板引擎。
选择Thymeleaf模板引擎
Thymeleaf是Spring开发的一个现代的服务端Java模板引擎,适用于开发Web和独立环境项目的服务器端的模板引擎,能够快速地处理HTML元素、JavaScript元素和CSS元素的显示。
Thymeleaf为用户提供了一种优雅且高度可维护的模板创建方式。它以HTML页面为基础,在运行时将动态数据注入模板中并展示给用户。这种运行方式不会影响模板被用作设计原型,而且还提高了沟通效率。
Thymeleaf是专门为Web标准设计的,特别是最新的Web标准——HTML 5。
它还可以创建完全验证的模板,具有非常丰富的功能。在项目开发中将Spring Boot框架、Thymeleaf与Spring MVC的视图技术及Spring Boot的自动化配置集成在一起非常简便,不需要额外的配置,在开发中只需要关注Thymeleaf的语法即可。
实战:使用Thymeleaf模板引擎
下面新建第4章的项目chapter-4,演示在实际项目中怎么使用Thymeleaf开发页面。
(1)添加Thymeleaf依赖到pom.xml中,代码如下:
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<optional>true</optional>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
</dependency>
</dependencies>
(2)在application.properties中添加Thymeleaf配置文件:
#排除静态文件夹
spring.devtools.restart.exclude=static/**,public/**
#关闭 Thymeleaf 缓存开发过程中无须重启
spring.thymeleaf.cache = false
#设置thymeleaf页面的编码
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.mode=HTML5
#设置thymeleaf页面的后缀为.html
spring.thymeleaf.suffix=.html
#设置thymeleaf页面的存储路径
spring.thymeleaf.prefix=classpath:/templates/
(3)新建Controller包,在其中新建UserController类,添加addUser()方法:
package com.example.thymeleafdemo.controller;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;@Controller
public class UserController {
@GetMapping("/addUser")
public String addUser(Model model){
model.addAttribute("title","i miss CC very much");
return "user/addUser";
}
}
在上述代码中,请求URL为/addUser,其会跳转到user目录下的addUSer.html页面,同时设置数据title为i miss CC very much。
(4)在resource/templates下新建一个user目录,然后再新建一个addUser.html文件,内容如下:
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
标题是:
<p th:text="${title}">hello</p>
</body>
</html>
从上述代码中可以看出,Thymeleaf获取一个值的语法是th:text=${title}。
注意:在HTML页面中使用Thymeleaf时需要引入名称空间。例如:<html xmlns:th="http://www.thymeleaf.org">
(5)启动项目,在浏览器中访问localhost:8080/addUser,页面效果如图4.2所示。
简介:Thymeleaf的基础语法
前面的页面只演示了Thymeleaf最基本的取值,在实际开发中还有很多其他的数据格式,如List、Map、对象等。除此之外还有判断、时间格式化和循环处理等操作。下面一起来学习Thymeleaf的基础语法。
1. th属性
常用的th属性如表4.1所示。
2. ~{…} 代码块表达式
~{…}代码块表达式支持两种语法结构:~
{
templatename::fragmentname}格式和{templatename::#id}。推荐使用前一种。
templatename:模板名,Thymeleaf会根据模板名解析完整的路径
/resources/templates/templatename.html,使用时需要注意文件是相对路径还是绝对路径。
fragmentname:片段名,Thymeleaf通过th:fragment声明来定义代码块,即th:fragment= "fragmentname"。
id:HTML的ID选择器,使用时要在前面加上#号,其不支持class选择器。
代码块表达式需要配合th属性(th:insert、th:replace、th:include)一起使用。
th:insert:将整个代码块片段插入使用了th:insert的HTML标签中。
th:replace:将整个代码块片段替换为使用了th:replace的HTML标签内容。
th:include:将代码块片段包含的内容插入使用了th:include的HTML标签中。
3. #{…}消息表达式
#{…}消息表达式一般用于国际化场景。
4. @{…}链接表达式
@{…}链接表达式结构有两种形式:
无参:@{/xxx};
有参:@{/xxx(k1=v1,k2=v2)},对应url结构:xxx?k1=v1&k2=v2。@{…}链接表达式的主要目的是引入本地资源(@{/项目本地的资源路径})和外部资源(@{/webjars/资源在jar包中的路径})。
5. ${…}变量表达式
${…}变量表达式有3个功能:
获取对象的属性和方法;
使用Servlet的ctx、vars、locale、request、response、session和servletContext内置对象,能够获取文件路径和请求信息,设置环境变量等;
使用Thymeleaf的dates、numbers、strings、objects、arrays、lists、sets和maps等内置方法可以将返回的页面数据进行格式化并展示给用户。
其中,Thymeleaf常用的内置对象参见表4.2所示。
Thymeleaf模板中常用的内置方法如表4.3所示。
表4.3 常用的内置方法
介绍完Thymeleaf的常见语法和内置对象后,就能把数据很好地渲染到Thymeleaf模板上,最终展示给用户了。如果前端给出的是静态的HTML页面,则需要对HTML中的引用和头部信息进行修改,将其转换为Thymeleaf页面。
相关推荐
- Excel技巧:SHEETSNA函数一键提取所有工作表名称批量生产目录
- 
        首先介绍一下此函数:SHEETSNAME函数用于获取工作表的名称,有三个可选参数。语法:=SHEETSNAME([参照区域],[结果方向],[工作表范围])(参照区域,可选。给出参照,只返回参照单元格... 
- Excel HOUR函数:“小时”提取器_excel+hour函数提取器怎么用
- 
        一、函数概述HOUR函数是Excel中用于提取时间值小时部分的日期时间函数,返回0(12:00AM)到23(11:00PM)之间的整数。该函数在时间数据分析、考勤统计、日程安排等场景中应用广泛。语... 
- Filter+Search信息管理不再难|多条件|模糊查找|Excel函数应用
- 
        原创版权所有介绍一个信息管理系统,要求可以实现:多条件、模糊查找,手动输入的内容能去空格。先看效果,如下图动画演示这样的一个效果要怎样实现呢?本文所用函数有Filter和Search。先用filter... 
- FILTER函数介绍及经典用法12:FILTER+切片器的应用
- 
        EXCEL函数技巧:FILTER经典用法12。FILTER+切片器制作筛选按钮。FILTER的函数的经典用法12是用FILTER的函数和切片器制作一个筛选按钮。像左边的原始数据,右边想要制作一... 
- office办公应用网站推荐_office办公软件大全
- 
        以下是针对Office办公应用(Word/Excel/PPT等)的免费学习网站推荐,涵盖官方教程、综合平台及垂直领域资源,适合不同学习需求:一、官方权威资源1.微软Office官方培训... 
- WPS/Excel职场办公最常用的60个函数大全(含卡片),效率翻倍!
- 
        办公最常用的60个函数大全:从入门到精通,效率翻倍!在职场中,WPS/Excel几乎是每个人都离不开的工具,而函数则是其灵魂。掌握常用的函数,不仅能大幅提升工作效率,还能让你在数据处理、报表分析、自动... 
- 收藏|查找神器Xlookup全集|一篇就够|Excel函数|图解教程
- 
        原创版权所有全程图解,方便阅读,内容比较多,请先收藏!Xlookup是Vlookup的升级函数,解决了Vlookup的所有缺点,可以完全取代Vlookup,学完本文后你将可以应对所有的查找难题,内容... 
- 批量查询快递总耗时?用Excel这个公式,自动计算揽收到签收天数
- 
        批量查询快递总耗时?用Excel这个公式,自动计算揽收到签收天数在电商运营、物流对账等工作中,经常需要统计快递“揽收到签收”的耗时——比如判断某快递公司是否符合“3天内送达”的服务承... 
- Excel函数公式教程(490个实例详解)
- 
        Excel函数公式教程(490个实例详解)管理层的财务人员为什么那么厉害?就是因为他们精通excel技能!财务人员在日常工作中,经常会用到Excel财务函数公式,比如财务报表分析、工资核算、库存管理等... 
- Excel(WPS表格)Tocol函数应用技巧案例解读,建议收藏备用!
- 
        工作中,经常需要从多个单元格区域中提取唯一值,如体育赛事报名信息中提取唯一的参赛者信息等,此时如果复制粘贴然后去重,效率就会很低。如果能合理利用Tocol函数,将会极大地提高工作效率。一、功能及语法结... 
- Excel中的SCAN函数公式,把计算过程理清,你就会了
- 
        Excel新版本里面,除了出现非常好用的xlookup,Filter公式之外,还更新一批自定义函数,可以像写代码一样写公式其中SCAN函数公式,也非常强大,它是一个循环函数,今天来了解这个函数公式的计... 
- Excel(WPS表格)中多列去重就用Tocol+Unique组合函数,简单高效
- 
        在数据的分析和处理中,“去重”一直是绕不开的话题,如果单列去重,可以使用Unique函数完成,如果多列去重,如下图:从数据信息中可以看到,每位参赛者参加了多项运动,如果想知道去重后的参赛者有多少人,该... 
- Excel(WPS表格)函数Groupby,聚合统计,快速提高效率!
- 
        在前期的内容中,我们讲了很多的统计函数,如Sum系列、Average系列、Count系列、Rank系列等等……但如果用一个函数实现类似数据透视表的功能,就必须用Groupby函数,按指定字段进行聚合汇... 
- Excel新版本,IFS函数公式,太强大了!
- 
        我们举一个工作实例,现在需要计算业务员的奖励数据,右边是公司的奖励标准:在新版本的函数公式出来之前,我们需要使用IF函数公式来解决1、IF函数公式IF函数公式由三个参数组成,IF(判断条件,对的时候返... 
- Excel不用函数公式数据透视表,1秒完成多列项目汇总统计
- 
        如何将这里的多组数据进行汇总统计?每组数据当中一列是不同菜品,另一列就是该菜品的销售数量。如何进行汇总统计得到所有的菜品销售数量的求和、技术、平均、最大、最小值等数据?不用函数公式和数据透视表,一秒就... 
- 一周热门
- 最近发表
- 
- Excel技巧:SHEETSNA函数一键提取所有工作表名称批量生产目录
- Excel HOUR函数:“小时”提取器_excel+hour函数提取器怎么用
- Filter+Search信息管理不再难|多条件|模糊查找|Excel函数应用
- FILTER函数介绍及经典用法12:FILTER+切片器的应用
- office办公应用网站推荐_office办公软件大全
- WPS/Excel职场办公最常用的60个函数大全(含卡片),效率翻倍!
- 收藏|查找神器Xlookup全集|一篇就够|Excel函数|图解教程
- 批量查询快递总耗时?用Excel这个公式,自动计算揽收到签收天数
- Excel函数公式教程(490个实例详解)
- Excel(WPS表格)Tocol函数应用技巧案例解读,建议收藏备用!
 
- 标签列表
- 
- 外键约束 oracle (36)
- oracle的row number (32)
- 唯一索引 oracle (34)
- oracle in 表变量 (28)
- oracle导出dmp导出 (28)
- 多线程的创建方式 (29)
- 多线程 python (30)
- java多线程并发处理 (32)
- 宏程序代码一览表 (35)
- c++需要学多久 (25)
- css class选择器用法 (25)
- css样式引入 (30)
- css教程文字移动 (33)
- php简单源码 (36)
- php个人中心源码 (25)
- php小说爬取源码 (23)
- 云电脑app源码 (22)
- html画折线图 (24)
- docker好玩的应用 (28)
- linux有没有pe工具 (34)
- 可以上传视频的网站源码 (25)
- 随机函数如何生成小数点数字 (31)
- 随机函数excel公式总和不变30个数据随机 (33)
- 所有excel函数公式大全讲解 (22)
- 有动图演示excel函数公式大全讲解 (32)
 
