腳本之家服務器常用軟件

快捷導航

Java之SpringBoot-Thymeleaf詳情

更新時間：2021年09月24日 09:36:05 作者：CoLoo

聊Thymeleaf，需要知道為什么到了SpringBoot中就不用JSP了？這跟SpringBoot打包方式有點關系，SpringBoot項目打包是jar包，下面文章小編就對此做一個詳細介紹,需要的朋友可以參考一下

war包代表JavaWeb應用程序，jar包是類的歸檔文件。war包不僅僅可以包含類的歸檔文件，它還可以包含 Servlet、HTML頁面、Java類、圖像文件，以及組成Web應用程序的其他資源。

JAR（Java Archive，Java 歸檔文件）是與平臺無關的文件格式，它允許將許多文件組合成一個壓縮文件。JAR 文件格式以流行的 ZIP 文件格式為基礎,所以可以直接將jar包后綴改成zip再進行解壓即可得到壓縮前的文件。與 ZIP 文件不同的是，JAR 文件不僅用于壓縮和發(fā)布，而且還用于部署和封裝庫、組件和插件程序，并可被像編譯器和 JVM 這樣的工具直接使用。包括我們常用的工具以及SpringBoot項目都是jar包。

war是一個可以直接運行的web模塊，通常用于網(wǎng)站，打成包部署到容器中。比如我們之前SSM寫的web程序可以直接將war包部署到tomcat的webapps目錄下，啟動tomcat后會自動解壓war包，就相當于發(fā)布了這個web應用程序。

1、About Thymeleaf

Thymeleaf是SpringBoot中的一個模版引擎，個人認為有點類似于Python中的Jinja2，負責渲染前端頁面。

之前寫JavaWeb和SSM的時候，前端頁面可能會用JSP寫，但是因為之前項目都是war包部署，而SpringBoot都是jar包且內嵌tomcat，所以是不支持解析jsp文件的。但是如果是編寫純靜態(tài)的html就很不方便，那么這時候就需要一個模版引擎類似于Jinja2可以通過表達式幫我們把動態(tài)的變量渲染到前端頁面，我們只需要寫一個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){
      //存入數(shù)據(jù)
      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,并且是將函數(shù)的返回值直接填入 HTTP 響應體中,是 REST 風格的控制器。

單獨使用 @Controller 不加 @ResponseBody的話一般使用在要返回一個視圖的情況，這種情況屬于比較傳統(tǒng)的 Spring MVC 的應用，對應于前后端不分離的情況。@Controller +@ResponseBody 返回 JSON 或 XML 形式數(shù)據(jù)

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 遍歷循環(huán)元素
th:value 屬性賦值

所有的HTML5標簽的所有屬性都有一個自定義的Thymeleaf屬性對應。

Thymeleaf屬性只有當Thymeleaf模板引擎啟動的情況下，才會生效，即取代對應的HTML5屬性，相反，Thymeleaf屬性僅僅只是一個無用的自定義屬性，因為瀏覽器內核不認識，因此使用Thymeleaf模板引擎可以使得前端代碼和后端代碼分離，當出現(xiàn)顯示問題時，可以立即定位問題所在（是前端頁面還是后臺返回數(shù)據(jù)有錯），這也是Thymeleaf相對于JSP的一個優(yōu)勢。