1. 程式人生 > 實用技巧 >Spring Boot 教程:Thymeleaf

Spring Boot 教程:Thymeleaf

【注】本文譯自:https://www.tutorialspoint.com/spring_boot/spring_boot_thymeleaf.htm Thymeleaf 是一個基於 Java 的庫【譯註:模板引擎】,可用於建立 web 應用。它對於 web 應用中的 XHTML/HTML5 提供了良好的支援。在本文中,你將學會有關 Thymeleaf 細節。

Thymeleaf 模板

Thymeleaf 將你的檔案轉換成格式良好的 XML 檔案。它包含以下 6 種類型的模板:
  • XML
  • 有效 XML
  • XHTML
  • 有效 XHTML
  • HTML5
  • 遺留 HTML5
除了遺留HTML5 以外的所有模板都可參閱有效的XML 檔案。遺留 HTML5 允許我們在 web 頁中渲染 HTML5 標籤,包括沒閉合的標籤。

Web 應用

你可以使用Thymeleaf 模板在Spring Boot 中建立 web 應用,需要以下幾個步驟。 使用以下程式碼建立一個@Controller 類檔案以重定向請求 URI 到 HTML 檔案:
 1 package com.tutorialspoint.demo.controller;
 2  
 3 import org.springframework.stereotype.Controller;
 4 import org.springframework.web.bind.annotation.RequestMapping;
 5  
 6 @Controller
 7 public
class WebController { 8 @RequestMapping(value = "/index") 9 public String index() { 10 return "index"; 11 } 12 }
在上述例子中,請求URI 為/index,控制重定向到 index.html 檔案。注意,index.html 檔案應當放到 templates 目錄下面,所有的 JS 和 CSS 檔案應當放到classpath路徑下的 static 目錄。在示例中,我們使用 CSS 檔案改變文字顏色 你可以使用以下程式碼在一個獨立的目錄中建立CSS 檔案,檔名為styles.css:
1
h4 { 2 color: red; 3 }
index.html 檔案的程式碼如下:
 1 <!DOCTYPE html>
 2 <html>
 3    <head>
 4       <meta charset = "ISO-8859-1" />
 5       <link href = "css/styles.css" rel = "stylesheet"/>
 6       <title>Spring Boot Application</title>
 7    </head>
 8    <body>
 9       <h4>Welcome to Thymeleaf Spring Boot web application</h4>
10    </body>
11 </html>
專案瀏覽器的截圖如下所示: 現在,我們需要在我們的構建配置檔案中加上Spring Boot Starter Thymeleaf 依賴。 Maven 使用者可以將下面的依賴加入 pom.xml 檔案:
1 <dependency>
2    <groupId>org.springframework.boot</groupId>
3    <artifactId>spring-boot-starter-thymeleaf</artifactId>
4 </dependency>
Gradle 使用者可以在 build.gradle 檔案中加入以下依賴:
compile group: 'org.springframework.boot', name: 'spring-boot-starter-thymeleaf'
主Spring Boot 應用類程式碼如下所示:
 1 package com.tutorialspoint.demo;
 2  
 3 import org.springframework.boot.SpringApplication;
 4 import org.springframework.boot.autoconfigure.SpringBootApplication;
 5  
 6 @SpringBootApplication
 7 public class DemoApplication {
 8    public static void main(String[] args) {
 9       SpringApplication.run(DemoApplication.class, args);
10    }
11 }
Maven – pom.xml 程式碼如下:
 1 <?xml version = "1.0" encoding = "UTF-8"?>
 2 <project xmlns = "http://maven.apache.org/POM/4.0.0" 
 3    xmlns:xsi = "http://www.w3.org/2001/XMLSchema-instance"
 4    xsi:schemaLocation = "http://maven.apache.org/POM/4.0.0 
 5    http://maven.apache.org/xsd/maven-4.0.0.xsd">
 6    
 7    <modelVersion>4.0.0</modelVersion>
 8    <groupId>com.tutorialspoint</groupId>
 9    <artifactId>demo</artifactId>
10    <version>0.0.1-SNAPSHOT</version>
11    <packaging>jar</packaging>
12    <name>demo</name>
13    <description>Demo project for Spring Boot</description>
14  
15    <parent>
16       <groupId>org.springframework.boot</groupId>
17       <artifactId>spring-boot-starter-parent</artifactId>
18       <version>1.5.8.RELEASE</version>
19       <relativePath />
20    </parent>
21  
22    <properties>
23       <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
24       <project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
25       <java.version>1.8</java.version>
26    </properties>
27  
28    <dependencies>
29       <dependency>
30          <groupId>org.springframework.boot</groupId>
31          <artifactId>spring-boot-starter-web</artifactId>
32       </dependency>
33  
34       <dependency>
35          <groupId>org.springframework.boot</groupId>
36          <artifactId>spring-boot-starter-test</artifactId>
37          <scope>test</scope>
38       </dependency>
39  
40       <dependency>
41          <groupId>org.springframework.boot</groupId>
42          <artifactId>spring-boot-starter-thymeleaf</artifactId>
43       </dependency>
44    </dependencies>
45  
46    <build>
47       <plugins>
48          <plugin>
49             <groupId>org.springframework.boot</groupId>
50             <artifactId>spring-boot-maven-plugin</artifactId>
51          </plugin>
52       </plugins>
53    </build>
54    
55 </project>
Gradle – build.gradle 程式碼如下:
 1 buildscript {
 2    ext {
 3       springBootVersion = '1.5.8.RELEASE'
 4    }
 5    repositories {
 6       mavenCentral()
 7    }
 8    dependencies {
 9       classpath("org.springframework.boot:spring-boot-gradle-plugin:${springBootVersion}")
10    }
11 }
12  
13 apply plugin: 'java'
14 apply plugin: 'eclipse'
15 apply plugin: 'org.springframework.boot'
16  
17 group = 'com.tutorialspoint'
18 version = '0.0.1-SNAPSHOT'
19 sourceCompatibility = 1.8
20  
21 repositories {
22    mavenCentral()
23 }
24 dependencies {
25    compile('org.springframework.boot:spring-boot-starter-web')
26    compile group: 'org.springframework.boot', name: 'spring-boot-starter-thymeleaf'
27    testCompile('org.springframework.boot:spring-boot-starter-test')
28 }
現在你可以使用 Maven 或 Gradle 命令建立可執行executable JAR 檔案並執行 Spring Boot 應用了: Maven 命令如下:
mvn clean install
在 “BUILD SUCCESS” 之後,你可以在 target 目錄下找到 JAR 檔案。 Gradle 可以使用以下命令:
gradle clean build
在 “BUILD SUCCESSFUL” 之後,你可以在build/libs 目錄下找到JAR 檔案。 使用以下命令執行 JAR 檔案:
java –jar <JARFILE>
現在應用已在Tomcat 8080 埠啟動,如下圖所示: 在瀏覽器中輸入以下URL,你將會看到下圖所示的輸出: http://localhost:8080/index