快捷導(dǎo)航

spring-boot-starter-thymeleaf加載外部html文件方式

更新時(shí)間：2025年02月24日 14:26:02 作者：jforgame

本文介紹了在SpringMVC中使用Thymeleaf模板引擎加載外部HTML文件的方法,以及在Spring Boot中使用Thymeleaf的基本步驟,包括引入依賴(lài)、創(chuàng)建Controller、創(chuàng)建HTML文件、參數(shù)化訪問(wèn)、熱加載和熱更新文件

1.Thymeleaf介紹

Thymeleaf是一種現(xiàn)代化的服務(wù)器端Java模板引擎，用于構(gòu)建漂亮、可維護(hù)且易于測(cè)試的動(dòng)態(tài)Web應(yīng)用程序。它適用于與Spring框架集成，并且可以與Spring MVC或Spring Boot等框架一起使用。

Thymeleaf模板引擎允許開(kāi)發(fā)人員在HTML頁(yè)面中使用模板表達(dá)式，這些表達(dá)式可以動(dòng)態(tài)地替換頁(yè)面中的內(nèi)容。它提供了豐富的表達(dá)式語(yǔ)法，可以從后端Java代碼中獲取動(dòng)態(tài)數(shù)據(jù)，并在模板中進(jìn)行顯示。

與其他模板引擎相比，Thymeleaf具有以下特點(diǎn)：

自然的模板語(yǔ)法：Thymeleaf的模板語(yǔ)法非常類(lèi)似于HTML，易于理解和編寫(xiě)。
靜態(tài)預(yù)覽：在開(kāi)發(fā)過(guò)程中，可以直接在瀏覽器中預(yù)覽Thymeleaf模板，無(wú)需啟動(dòng)整個(gè)應(yīng)用程序。
強(qiáng)大的功能：Thymeleaf提供了豐富的標(biāo)簽和表達(dá)式，可以處理循環(huán)、條件判斷、國(guó)際化等常見(jiàn)的模板需求。
安全：Thymeleaf會(huì)對(duì)輸出的內(nèi)容進(jìn)行自動(dòng)轉(zhuǎn)義，以防止XSS攻擊。

2.springboot使用thymeleaf

使用spring-boot-starter-thymeleaf可以非常方便地使用thymeleaf，下面來(lái)看詳細(xì)的例子。

2.1.引入spring-boot-starter-thymeleaf依賴(lài)

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

2.2.創(chuàng)建controller

@Controller
public class H5Controller {

    @GetMapping("/external")
    public String loadExternalHtml() {
        return "index";
    }
}

在上述示例中，index()方法處理根路徑的GET請(qǐng)求，并返回"index"字符串。這意味著它將返回名為index.html的Thymeleaf模板。

現(xiàn)在，創(chuàng)建一個(gè)名為index.html的Thymeleaf模板，放置在src/main/resources/templates目錄下（默認(rèn)的Thymeleaf模板目錄）

如果想重新定義模板目錄路徑，只需要修改application.properties文件

spring.thymeleaf.prefix=file:/F:/projects/eb/resources/html5/

2.3.創(chuàng)建簡(jiǎn)易html文件

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Index Page</title>
</head>
<body>
    <h1>This is the index page</h1>
</body>
</html>

2.4.瀏覽器訪問(wèn)

在瀏覽器輸入localhost:8080/index.html，即可看到html內(nèi)容。

2.5.參數(shù)化訪問(wèn)html文件

假設(shè)Thymeleaf目錄下有很多文件，我們希望客戶(hù)端能通過(guò)參數(shù)來(lái)選擇加載某個(gè)文件，那么我們可以修改controller的代碼。

@Controller
public class H5Controller {

    @GetMapping("/external")
    public String loadExternalHtml(@RequestParam String resource) {
        return resource; 
    }

}

瀏覽器重新輸入（可以根據(jù)需要訪問(wèn)特定文件）：

http://localhost:8080/external?resource=hello