03.Spring Boot 實戰~SpringBoot 整合Thymeleaf

03.Spring Boot 實戰~SpringBoot 整合Thymeleaf

本文是上一篇文章的後續,詳情點擊該鏈接

SpringBoot 訪問靜態資源

        在 SpringBoot 項目中沒有我們之前常規 web 開發的 WebContent(WebApp),它只有 src 目錄。在 src/main/resources 下面有兩個文件夾, static 和 templates。 SpringBoot 默認在 static 目錄中存放靜態頁面,而 templates 中放動態頁面。

static 目錄

        SpringBoot 通過 classpath/static 目錄訪問靜態資源。注意存放靜態資源的目錄名稱必須 是 static。

        我們在靜態目錄裏創建一個HTML文件,然後直接訪問即可。

在這裏插入圖片描述

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
        <h2>hello world</h2>
    </body>
</html>

在這裏插入圖片描述

SpringBoot 訪問靜態資源的位置

        classpath:/META‐INF/resources/

        classpath:/resources/

        classpath:/static/

        classpath:/public/

在這裏插入圖片描述

在這裏插入圖片描述

自定義靜態資源位置

在這裏插入圖片描述在這裏插入圖片描述

        這個時候我們發現報了一個404錯誤,爲什麼呢?因爲SpringBoot只會訪問我們上面列舉的四個靜態位置,除此之外不會去其他地方查找。

        那麼我們如果把我們的靜態資源放到自定義目錄當中,那麼我們肯定要修改配置文件,來修改默認配置。

spring.resources.static-locations=classpath:/MyStaticDire/

在這裏插入圖片描述

SpringBoot 文件上傳


在這裏插入圖片描述
前臺

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    <form action="/FileLoad" method="post" enctype="multipart/form-data">
        <input type="file" name="file"/>
        <input type="submit" value="上傳"/>
    </form>
    </body>
</html>
啓動類
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

//啓動類必須要有這個註解!
@SpringBootApplication
public class FileLoadSpringBoot {
    public static void main(String[] args) {
        //必須要通過SpringApplication下的靜態方法run
        //第一個參數是啓動類的class,第二個參數是main方法裏的args
        SpringApplication.run(FileLoadSpringBoot.class,args);
    }
}
Controller
@Controller
public class MyController {

    @PostMapping("/FileLoad")
    @ResponseBody
    public String FileLoad(MultipartFile file) throws IOException {
        //如果file不等於空說明數據傳過來了
        if(file!=null){
            file.transferTo(new File("C:\\Users\\36961\\Desktop\\Test"));
            return "OK";
        }
        //file是空的話,那麼就說明上傳失敗
        return "error";
    }
}

Thymeleaf

       Thymeleaf 的主要目標是將優雅的自然模板帶到開發工作流程中,並將 HTML 在瀏覽器 中正確顯示,並且可以作爲靜態原型,讓開發團隊能更容易地協作。Thymeleaf 能夠處理 HTML,XML,JavaScript,CSS 甚至純文本。

       長期以來,jsp 在視圖領域有非常重要的地位,隨着時間的變遷,出現了一位新的挑戰 者:Thymeleaf,Thymeleaf 是原生的,不依賴於標籤庫.它能夠在接受原始 HTML 的地方進行編 輯和渲染.因爲它沒有與Servelet規範耦合,因此Thymeleaf模板能進入jsp所無法涉足的領域。

       Thymeleaf在Spring Boot項目中放入到resources/templates中。這個文件夾中的內容是無法通過瀏覽器URL直接訪問的(和WEB-INF效果一樣),所有Thymeleaf頁面必須先走控制器。

添加Thymeleaf啓動器

    <!-- 添加Thymeleaf啓動器  -->
    <dependency>
      <groupId>org.springframework.boot</groupId>
      <artifactId>spring-boot-starter-thymeleaf</artifactId>
    </dependency>

       如果項目用的是分佈式架構,前後端分離的話,Thymeleaf就沒什麼技術特點了,因爲前後端分離各盡其職,後臺只需要提供接口即可。但如果是單體結構的項目當中,對於視圖層技術而言,Thymeleaf的好處遠遠大於JSP。

Thymeleaf啓動器依賴
    <!-- 添加Thymeleaf啓動器  -->
    <dependency>
      <groupId>org.springframework.boot</groupId>
      <artifactId>spring-boot-starter-thymeleaf</artifactId>
    </dependency>

我們先來段代碼感受一下

創建項目

在這裏插入圖片描述

啓動類

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication
public class SpringBootAndThymeleaf {
    public static void main(String[] args) {
        SpringApplication.run(SpringBootAndThymeleaf.class,args);
    }
}
Controller
@Controller
public class MyController {

    @RequestMapping("/show")
    public String showPage(Model model){
    	//發送數據到後臺
        model.addAttribute("msg","hello Thymeleaf");
        return "index";
    }
}
視圖層
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
        <span th:text="${msg}"></span>
    </body>
</html>

在這裏插入圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章