SpringBoot Thymeleaf

什么是Thymeleaf？

Thymeleaf 是一個(gè)開源Java庫根據(jù) Apache許可2.0 獲得許可。這是一個(gè) HTML5/XHTML/XML 模板引擎。它是用于Web(基于Servlet)和非Web(離線)環(huán)境的 服務(wù)器端Java模板引擎。對(duì)于現(xiàn)代HTML5 JVM Web開發(fā)而言，它是完美的選擇。它提供了與Spring Framework的完全集成。

它對(duì)模板文件應(yīng)用了一組轉(zhuǎn)換，以顯示應(yīng)用程序生成的數(shù)據(jù)或文本。適合在Web應(yīng)用程序中提供XHTML/HTML5。

Thymeleaf的目標(biāo)是提供一種 時(shí)尚和 格式良好的模板創(chuàng)建方式。它基于XML標(biāo)簽和屬性。這些XML標(biāo)記定義了DOM(文檔對(duì)象模型)上預(yù)定義邏輯的執(zhí)行，而不是將該邏輯作為模板中的代碼顯式編寫。它代替了 JSP 。

Thymeleaf的體系結(jié)構(gòu)允許對(duì)模板進(jìn)行 快速 處理，具體取決于緩存解析的文件。它在執(zhí)行過程中使用了最少的I/O操作。

為什么我們使用Thymeleaf？

JSP或多或少類似于HTML。但是它與Thymeleaf等HTML并不完全兼容。我們可以在瀏覽器中正常打開和顯示Thymeleaf模板文件，而JSP文件則不能。

Thymeleaf支持像Spring EL這樣的變量表達(dá)式($ {...})并在模型屬性，星號(hào)表達(dá)式上執(zhí)行(* {...})在表單支持bean上執(zhí)行，哈希表達(dá)式(#{...})用于國際化，鏈接表達(dá)式(@{......))重寫URL。

像JSP一樣，Thymeleaf可以很好地用于Rich HTML電子郵件。

Thymeleaf可以處理哪種模板？

Thymeleaf可以處理六種類型的模板(也稱為" 模板模式)如下:

XML 有效的XML XHTML 有效的XHTML HTML5 舊版HTML5

除了舊版HTML5模式外，上述所有模式均引用 定義明確的XML 文件。它使我們能夠處理具有獨(dú)立標(biāo)簽，沒有值的標(biāo)簽屬性或未在引號(hào)之間寫入等功能的HTML5文件。

要以這種特定模式處理文件，Thymeleaf會(huì)執(zhí)行轉(zhuǎn)換，將文件轉(zhuǎn)換為 格式良好的XML 文件(有效的HTML5文件)。

Thymeleaf還允許我們通過指定兩種在此模式下解析模板的方式來定義自己的模式。這樣，Thymeleaf可以有效地將任何可以建模為DOM樹的模型作為模板進(jìn)行處理。

標(biāo)準(zhǔn)方言

Thymeleaf是模板引擎允許我們定義DOM節(jié)點(diǎn)的框架。在模板中處理的DOM節(jié)點(diǎn)。

將邏輯應(yīng)用于DOM節(jié)點(diǎn)的對(duì)象稱為 處理器。一組處理器以及一些額外的工件稱為 方言。包含Thymeleaf核心庫的方言稱為 標(biāo)準(zhǔn)方言。

如果我們想在利用庫的高級(jí)功能的同時(shí)定義自己的處理邏輯，則可以定義自己的方言。自己的方言。在模板引擎中，我們可以一次配置多個(gè)方言。

Thymeleaf集成包(thymeleaf-spring3和thymeleaf-spring4)定義了一個(gè)稱為 SpringStandard Dialect 的方言。標(biāo)準(zhǔn)方言和SpringStandard幾乎相同。但是標(biāo)準(zhǔn)方言有一些小的變化，可以更好地利用Spring框架中的某些功能。

例如，使用Spring Expression Language代替Thymeleaf的標(biāo)準(zhǔn)ONGL(對(duì)象圖導(dǎo)航語言)。

標(biāo)準(zhǔn)方言可以以任何方式處理模板。但是，它非常適合面向Web的模板模式(HTML5和XHTML)。它支持并驗(yàn)證以下XHTML規(guī)范:

XHTML 1.0過渡版 嚴(yán)格的XHTML 1.0 XHTML 1.0框架集 XHTML 1.1。

標(biāo)準(zhǔn)方言處理器是一種屬性處理器，它允許瀏覽器在處理之前顯示HTML5/XHTML模板文件。這是因?yàn)樗鼈兒雎粤似渌麑傩浴?/p>

例如，當(dāng)JSP文件使用標(biāo)簽庫時(shí)，它包含一段代碼，這些代碼無法由以下瀏覽器顯示:

<form:inputText name="student.Name" value="${student.name}" />

Thymeleaf標(biāo)準(zhǔn)方言允許我們使用以下代碼實(shí)現(xiàn)相同的功能。

<input type="text" name=" student Name" value="Thomas" th:value="${student.name}" />

上面的代碼還允許我們?cè)谄渲卸x value 屬性( Thomas )。在瀏覽器中打開原型時(shí)，將顯示該值。在模板的Thymeleaf處理過程中，該屬性將由對(duì) $ {student.name} 的求值得出的值代替。

它允許設(shè)計(jì)人員和開發(fā)人員進(jìn)行處理。相同的模板文件，減少了將靜態(tài)原型轉(zhuǎn)換為工作模板文件所需的工作。它稱為 自然模板。

Thymeleaf特征

它既可以在網(wǎng)絡(luò)環(huán)境中使用，也可以在非網(wǎng)絡(luò)環(huán)境中使用。 用于HTML5/XML/XHTML的Java模板引擎。 其高性能的解析模板緩存將I/O降至最低。 如果需要，它可以用作模板引擎框架。 它支持幾種模板模式: XML，XHTML和HTML5。 它允許開發(fā)人員擴(kuò)展和創(chuàng)建自定義方言。 它基于稱為方言的模塊化功能集。 它支持國際化。

Thymeleaf實(shí)現(xiàn)

我們可以通過在應(yīng)用程序的pom.xml中添加   spring-boot-starter-thymeleaf 依賴項(xiàng)來實(shí)現(xiàn)Thymeleaf模板引擎文件。 Spring Boot將模板引擎配置為從  /resource/templates中讀取模板文件。

示例

<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

 

Spring Boot Thymeleaf示例

我們創(chuàng)建一個(gè)Spring Boot應(yīng)用程序并實(shí)現(xiàn)Thymeleaf模板。

步驟1: 打開Spring Initializr http://start.spring.io 。

步驟2: 選擇Spring Boot版本   2.3.0.M1。

步驟2: 提供  組名稱。我們提供了   com.nhooo 。

步驟3: 提供  工件 ID。我們提供了   spring-boot-thymeleaf-view-example。

步驟5: 添加依賴項(xiàng)   Spring Web 和  Thymeleaf。

步驟6: 單擊   Generate (生成)按鈕。當(dāng)我們單擊"生成"按鈕時(shí)，它將規(guī)格包裝在   Jar 文件中，并將其下載到本地系統(tǒng)。

第7步: 提取 Jar文件并將其粘貼到STS工作區(qū)中。

步驟8: 導(dǎo)入 STS中的項(xiàng)目文件夾。

文件->導(dǎo)入->現(xiàn)有Maven項(xiàng)目->瀏覽->選擇文件夾spring-boot-thymeleaf-view-example->完成

導(dǎo)入需要一些時(shí)間。

步驟9: 在包   com.nhooo 中創(chuàng)建類。我們創(chuàng)建了一個(gè)名為   User的類。

在該類中，我們定義了兩個(gè)變量   name 和   email 并生成   Getter和Setters。

User.java

示例

package com.nhooo;  
public class User 
{  
String name;  
String email;  
public String getName() 
{  
return name;  
}  
public void setName(String name) 
{  
this.name = name;  
}  
public String getEmail() 
{  
return email;  
}  
public void setEmail(String email) 
{  
this.email = email;  
}  
}

 

步驟10: 創(chuàng)建控制器類。我們創(chuàng)建了一個(gè)名為   DemoController 的控制器類。

DemoController.java

示例

package com.nhooo;  
import org.springframework.web.bind.annotation.ModelAttribute;  
import org.springframework.web.bind.annotation.RequestMapping;  
import org.springframework.web.bind.annotation.RequestMethod;  
import org.springframework.web.servlet.ModelAndView;  
import org.springframework.stereotype.Controller;  
@Controller  
public class DemoController 
{  
@RequestMapping("/")  
public String index()
{  
return"index";  
}  
@RequestMapping(value="/save", method=RequestMethod.POST)  
public ModelAndView save(@ModelAttribute User user)
{  
ModelAndView modelAndView = new ModelAndView();  
modelAndView.setViewName("user-data");      
modelAndView.addObject("user", user);    
return modelAndView;  
}  
}

 

下一步，我們將創(chuàng)建Thymeleaf模板。

步驟11: 在  模板內(nèi)部(src/main/resources/模板)文件夾中，創(chuàng)建一個(gè)名稱為   user-data 的Thymeleaf模板。

右鍵單擊模板文件夾->新建->其他-> HTML文件->下一步->提供文件名->完成

注意: 不要忘記在模板文件中實(shí)現(xiàn)以下內(nèi)容。

示例

<html lang="en" xmlns:th="http://www.thymeleaf.org">

 

user-data.html

示例

<html xmlns:th="https://thymeleaf.org">  
<table>  
<tr>  
<td><h4>User Name: </h4></td>  
<td><h4 th:text="${user.name}"></h4></td>  
</tr>  
<tr>  
<td><h4>Email ID: </h4></td>  
<td><h4 th:text="${user.email}"></h4></td>  
</tr>  
</table>  
</html>

 

步驟12: 類似地，在文件夾模板中創(chuàng)建一個(gè)   HTML 文件。我們創(chuàng)建了一個(gè)名為   index 的HTML文件。

index.html

示例

<html lang="en">  
<head>  
<title>Index Page</title>  
</head>  
<body>  
<form action="save" method="post">  
<table>  
<tr>  
<td><label for="user-name">User Name</label></td>  
<td><input type="text" name="name"></input></td>  
 </tr>  
<tr>  
<td><label for="email">Email</label></td>  
<td><input type="text" name="email"></input></td>  
</tr>  
<tr>  
<td></td>  
<td><input type="submit" value="Submit"></input></td>  
</tr>  
</table>  
</form>  
</body>  
</html>

 

步驟13: 打開   application.properties 文件并在其中添加以下屬性。

application.properties

示例

spring.thymeleaf.cache=false
spring.thymeleaf.suffix: .html

 

創(chuàng)建所有文件，文件夾和包后，項(xiàng)目目錄如下所示:

讓我們運(yùn)行應(yīng)用程序。

步驟14: 打開   SpringBootThymeleafViewExampleApplication.java 文件并以Java應(yīng)用程序。

SpringBootThymeleafViewExampleApplication.java

示例

package com.nhooo;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
@SpringBootApplication
public class SpringBootThymeleafViewExampleApplication 
{
public static void main(String[] args) 
{
SpringApplication.run(SpringBootThymeleafViewExampleApplication.class, args);
}
}

 

步驟15: 現(xiàn)在，打開瀏覽器并調(diào)用URL http://localhost:8080。它顯示輸出，如下所示。

提供  用戶名和  電子郵件，然后單擊  提交按鈕。

點(diǎn)擊  提交按鈕，URL更改為http://localhost: 8080/save并顯示顯示用戶數(shù)據(jù)，如下所示。

在本節(jié)中，我們討論了Thymeleaf視圖。如果要使視圖更具吸引力，可以添加   CSS 和   JS 文件。這些文件必須位于   src/main/resources/static 文件夾下。