SpringBoot項目中如何訪問HTML頁面

Posted on by

SpringBoot默認的頁面映射路徑（即模板文件存放的位置）為“classpath:/templates/*.html”。靜態文件路徑為“classpath:/static/”，其中可以存放JS、CSS等模板共用的靜態文件。

1、將HTML頁面存放在resources/static目錄下的訪問

將HTML頁面存放在 resources（資源目錄）下的 static 目錄中。

【示例】在static目錄下創建test1.html頁面，然後在static目錄下創建view目錄，在view目錄下創建test2.html頁面，實現在瀏覽器中的訪問。項目結構如下圖：

（1）在static目錄下創建test1.html頁面，頁面代碼如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>測試頁面1</title>
    <meta name="author" content="pan_junbiao的博客">
</head>
<body>
    <h3>測試頁面1</h3>
    <p>您好，歡迎訪問 pan_junbiao的博客</p>
    <p>https://blog.csdn.net/pan_junbiao</p>
</body>
</html>

執行結果：

（2）在static目錄下創建view目錄，在view目錄下創建test2.html頁面，頁面代碼如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>測試頁面2</title>
    <meta name="author" content="pan_junbiao的博客">
</head>
<body>
    <h3>測試頁面2</h3>
    <p>您好，歡迎訪問 pan_junbiao的博客</p>
    <p>https://blog.csdn.net/pan_junbiao</p>
</body>
</html>

執行結果：

2、將HTML頁面存放在resources/templates目錄下的訪問

將HTML頁面存放在 resources（資源目錄）下的 templates 目錄中。

【示例】在templates目錄下創建test3.html頁面，實現在瀏覽器中的訪問。

在templates目錄下創建test3.html頁面，頁面代碼如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>測試頁面3</title>
    <meta name="author" content="pan_junbiao的博客">
</head>
<body>
    <h3>測試頁面3</h3>
    <p>您好，歡迎訪問 pan_junbiao的博客</p>
    <p>https://blog.csdn.net/pan_junbiao</p>
</body>
</html>

2.1 方式一

解決SpringBoot不能直接訪問templates目錄下的靜態資源（不推薦）

SpringBoot項目下的templates目錄的資源默認是受保護的，沒有開放訪問權限。這是因為templates文件夾，是放置模板文件的，因此需要視圖解析器來解析它。所以必須通過服務器內部進行訪問，也就是要走控制器 → 服務 → 視圖解析器這個流程才行。同時，存在安全問題，比如說，你把你後臺的html文件放到templates，而這個文件夾對外又是開放的，就會存在安全隱患。

解決方法：在application.yml或者application.properties配置文件中將訪問權限開放（不推薦）

application.yml文件配置：

spring:
  resources:
    static-locations: classpath:/META-INF/resources/, classpath:/resources/, classpath:/static/, classpath:/public/, classpath:/templates/

application.properties文件配置：

spring.resources.static-locations=classpath:/META-INF/resources/,classpath:/resources/,classpath:/static/,classpath:/public/,classpath:/templates/

配置完成後，啟動SpringBoot，在瀏覽器中輸入地址就可以直接訪問templates目錄下的靜態資源瞭。

執行結果：

2.2 方式二

通過Controller控制器層跳轉訪問的資源（推薦）

在源代碼層中創建controller目錄（控制器層），在controller目錄下創建IndexController（首頁控制器類），項目結構如下圖：

（1）pom.xml文件的配置

註意：一定要添加thymeleaf的依賴。

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

（2）編寫控制器方法

創建IndexController（首頁控制器類），代碼如下：

package com.pjb.springboothtml.controller; 
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
 
/**
 * 首頁控制器
 * @author pan_junbiao
 **/
@Controller
public class IndexController
{
    @RequestMapping("/test3")
    public String test3()
    {
        return "test3";
    }
}

執行結果：

以上為個人經驗，希望能給大傢一個參考，也希望大傢多多支持WalkonNet。

推薦閱讀：