前言:
聊Thymeleaf
,需要知道為什么到了SpringBoot
中就不用JSP了?這跟SpringBoot
打包方式有點關系,SpringBoot
項目打包是jar包,我們就先簡單來了解下這個war包
war包代表
JavaWeb
應用程序,jar包是類的歸檔文件。war包不僅僅可以包含類的歸檔文件,它還可以包含 Servlet、HTML頁面、Java
類、圖像文件,以及組成Web
應用程序的其他資源。
JAR
(Java Archive,Java 歸檔文件)是與平臺無關的文件格式,它允許將許多文件組合成一個壓縮文件。JAR 文件格式以流行的 ZIP 文件格式為基礎,所以可以直接將jar包后綴改成zip再進行解壓即可得到壓縮前的文件。與 ZIP 文件不同的是,JAR 文件不僅用于壓縮和發布,而且還用于部署和封裝庫、組件和插件程序,并可被像編譯器和 JVM 這樣的工具直接使用。包括我們常用的工具以及SpringBoot項目都是jar包。war是一個可以直接運行的web模塊,通常用于網站,打成包部署到容器中。比如我們之前SSM寫的web程序可以直接將war包部署到
tomcat
的webapps
目錄下,啟動tomcat后會自動解壓war包,就相當于發布了這個web應用程序。
1、About Thymeleaf
Thymeleaf
是SpringBoot
中的一個模版引擎,個人認為有點類似于Python
中的Jinja2,負責渲染前端頁面。
之前寫JavaWeb
和SSM的時候,前端頁面可能會用JSP寫,但是因為之前項目都是war包部署,而SpringBoot
都是jar包且內嵌tomcat,所以是不支持解析jsp文件的。但是如果是編寫純靜態的html就很不方便,那么這時候就需要一個模版引擎類似于Jinja2可以通過表達式幫我們把動態的變量渲染到前端頁面,我們只需要寫一個template
即可。這也就是到了SpringBoot
為什么官方推薦要使用Thymeleaf
處理前端頁面了。
2、Hello Thymeleaf
簡單來個demo
看一下Thymeleaf
效果
Pom.xml中引入依賴
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency>
Resources/templates/index.html
<!doctype html> <!--注意:引入thymeleaf的名稱空間--> <html lang="en" xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <div th:text="${msg}"></div> </body> </html>
Controller
這里return "index"
;Thymeleaf
會在templats
目錄下尋找index.html
@Controller public class IndexController { @RequestMapping("/index") public String test1(Model model){ //存入數據 model.addAttribute("msg","Hello,Thymeleaf"); //classpath:/templates/index.html return "index"; } }
也可以參考Thymeleaf的自動配置類。
這里的注解需要使用@Controller
,不能使用@RestController
注解
- 如果只是使用
@RestController
注解Controller
,則Controller中的方法無法返回jsp頁面,或者html,配置的視圖解析器InternalResourceViewResolver
不起作用,返回的內容就是Return 里的內容- 如果需要返回到指定頁面,則需要用 @Controller配合視圖解析器
InternalResourceViewResolver
才行。如果需要返回JSON,XML或自定義mediaType內容到頁面,則需要在對應的方法上加上@ResponseBody注解。
關于@Controller
和@RestController
@RestController
注解是@Controller
和@ResponseBody
的合集,表示這是個控制器 bean,并且是將函數的返回值直 接填入 HTTP 響應體中,是 REST 風格的控制器。- 單獨使用 @Controller 不加
@ResponseBody
的話一般使用在要返回一個視圖的情況,這種情況屬于比較傳統的Spring MVC
的應用,對應于前后端不分離的情況。@Controller +@ResponseBody 返回 JSON 或 XML 形式數據
3、Thymeleaf 表達式
3.1配置文件聲明
spring: thymeleaf: cache: false # 緩存關閉,不然我們改變頁面之后可能不能及時看到更改的內容,默認是true。 prefix: classpath:/templates/ #默認掃描的目錄去尋找我們return時寫的文件名,即模版文件所在位置 encoding: UTF-8 #編碼 suffix: .html #后綴 mode: HTML
3.2 常用表達式
3.2.1 0x01 ${} 變量表達式
從web作用域里面取到對應的值,作用域包括 request
、session
、application
。
主要需要注意在template中利用獲取 request
、session
、application
的代碼是不一樣的
requset: ${ago.id} Session: ${session.agiao.id} ServletContext: ${application.abc.id}
也可以通過如下形式獲取
<span th:text="${#request.getRequestURL()}"></span><br/> <span th:text="${#session.getMaxInactiveInterval()}"></span><br/> <span th:text="${#servletContext.getServerInfo()}"></span>
示例代碼:
Controller
@GetMapping("/varExpression") public String varExpression(HttpServletRequest request, HttpSession session) { User ago = new User(1, "Ago", "123"); request.setAttribute("ago", ago); User agiao = new User(2, "Agiao", "123"); session.setAttribute("agiao", agiao); User abc = new User(3, "Abc", "123"); ServletContext servletContext = request.getServletContext(); servletContext.setAttribute("abc", abc); return "varExpression"; }
templates/varExpression.html
這里及時html中獲取request部分有報錯也無所謂,不影響正常前端頁面顯示
<!doctype html> <!--注意:引入thymeleaf的名稱空間--> <html lang="en" xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> request: <br/> <div> 編號: <label th:text="${ago.id}"></label><br/> 用戶名:<label th:text="${ago.name}"></label> <br/> 密碼:<label th:text="${ago.pwd}"></label><br/> </div> session:<br/> <div> 編號: <label th:text="${session.agiao.id}"></label><br/> 用戶名:<label th:text="${session.agiao.name}"></label> <br/> 密碼:<label th:text="${session.agiao.pwd}"></label><br/> </div> application:<br/> <div> 編號:<label th:text="${application.abc.id}"></label><br/> 用戶名:<label th:text="${application.abc.name}"></label><br/> 密碼:<label th:text="${application.abc.pwd}"></label><br/> </div> </body> </html>
3.2.2 0x02 *{} 選擇變量表達式#
比較適合偷懶,直接在獲取屬性值之前先把存儲于scope中的整個對象提出來,通過*{}獲取該對象的屬性值
request: <br/> <div> 編號: <label th:text="${ago.id}"></label><br/> 用戶名:<label th:text="${ago.name}"></label> <br/> 密碼:<label th:text="${ago.pwd}"></label><br/> </div> session:<br/> <div> 編號: <label th:text="${session.agiao.id}"></label><br/> 用戶名:<label th:text="${session.agiao.name}"></label> <br/> 密碼:<label th:text="${session.agiao.pwd}"></label><br/> </div>
等價于
request: <br/> <div th:object="${ago}"> 編號: <label th:text="*{id}"></label><br/> 用戶名:<label th:text="*{name}"></label> <br/> 密碼:<label th:text="*{pwd}"></label><br/> </div> session:<br/> <div th:object="${session.agiao}"> 編號: <label th:text="*{id}"></label><br/> 用戶名:<label th:text="*{name}"></label> <br/> 密碼:<label th:text="*{pwd}"></label><br/> </div>
3.2.3 0x03 #{} 消息表達式
對于國際化的支持說明
配置文件聲明
## 配置國際化支持 spring.messages.basename=message
消息表達式
<span th:text="#{home.welcome}"></span><br />
3.2.4 0x04 @{} 鏈接表達式
指定跳轉的鏈接
<a th:href="@{/home}" rel="external nofollow" >url</a>
3.2.5 0x05 空值處理
如果為空則輸出null
,有id
值就輸出id
值
可以在調用對象或者方法的點(.)前面,使用問號(?)來判斷是否為null
<span th:text="${session?.user?.id}"></span>
4、標簽與屬性
常用的屬性大致有
-
th:text
文本顯示 -
th:object
一般和*{}一起用 -
th:if / th:unless
相當于if/else
-
th:each
遍歷循環元素 -
th:value
屬性賦值
所有的HTML5標簽的所有屬性都有一個自定義的
Thymeleaf
屬性對應。
Thymeleaf
屬性只有當Thymeleaf
模板引擎啟動的情況下,才會生效,即取代對應的HTML5屬性,相反,Thymeleaf屬性僅僅只是一個無用的自定義屬性,因為瀏覽器內核不認識,因此使用Thymeleaf
模板引擎可以使得前端代碼和后端代碼分離,當出現顯示問題時,可以立即定位問題所在(是前端頁面還是后臺返回數據有錯),這也是Thymeleaf
相對于JSP的一個優勢。
結尾:
簡單過了一下Thymeleaf
,簡單留個印象,相較于JSP個人感覺Thymeleaf
這種模版引擎才更像是前后端分離,也更方便了。但是在安全里,往往方便的地方就最容易存在漏洞,后續分析Thymeleaf
時再深入研究下。
到此這篇關于Java之SpringBoot-Thymeleaf詳情的文章就介紹到這了,更多相關Java之SpringBoot-Thymeleaf內容請搜索服務器之家以前的文章或繼續瀏覽下面的相關文章希望大家以后多多支持服務器之家!
原文鏈接:https://www.cnblogs.com/CoLo/p/15308848.html