SpringBoot靜態頁路徑,可直接通過URL訪問的:
- /META-INF/resources
- /resources
- /static
- /public
而 5. /template 只和模板引擎有關,加載了模板引擎才能用
welcome頁面的設置默認為index.html
按照1,2,3,4,5的順序尋找index.html,先找到的先解析,但是一般都放到templates目錄下。
SpringBoot CRUD開發
1.將頁面文件和類文件:SpringBoot_crud_頁面.tar 加入到項目相應路徑下:
實現方式
1. 只在/templates目錄下創建index.html頁面,什么也不配智,根據SpringBoot的自動配置自動匹配上
2. 在Controller中指定,但是此時Controller的類上不能配置@RequestMapping("/somePath"),因為頁面引用的靜態文件默認是在當前路徑下,也會被加上/somePath,以至於找不到靜態資源文件而無法渲染
-
@RequestMapping("/hello") @Controller public class HelloWorldController { /** * 這里會被模板引擎解析而走/templates/index.html * @return */ @RequestMapping({"/","/index","/index.html"}) public String index() { return "index"; } }
3. 自定義配置SpringBoot web的配置類
@Configuration public class MyConfig implements WebMvcConfigurer { /** * 瀏覽器發送addViewTest請求,來到success頁面 * 發請求到頁面,就沒有必要在Controller里寫空方法了,直接來做視圖映射 */ @Override public void addViewControllers(ViewControllerRegistry registry) { registry.addViewController("/addViewTest").setViewName("success"); registry.addViewController("/").setViewName("index"); } }
即等同於SpringMvc的如下配置
<mvc:view-controller path="/" view-name="success"/><!-- 配置文件設置頁面跳轉,發一個請求到頁面,就沒必要寫空方法了,配一下即可 -->
4. 配置文件類中@Bean注冊WebMvcConfigurer對象實例
@Configuration
public class MyConfig implements WebMvcConfigurer {
@Bean
public WebMvcConfigurer webMvcConfigurer() {
WebMvcConfigurer configurer = new WebMvcConfigurer() {
@Override
public void addViewControllers(ViewControllerRegistry registry) {
registry.addViewController("/").setViewName("index");
}
};
return configurer;
}
}
二、引入BootStrap的webjars取代本地文件
1.maven依賴
<dependency> <groupId>org.webjars</groupId> <artifactId>bootstrap</artifactId> <version>4.1.3</version> </dependency>
2. 在yml文件中加入配種:
server:
servlet:
context-path: /crud //注意,值前面必須帶斜杠
3.在頁面源碼中加入thymeleaf模板元素
<!DOCTYPE html> <html lang="en" xmlns:th="http://www.thymeleaf.org"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="description" content=""> <meta name="author" content=""> <title>Signin Template for Bootstrap</title> <!-- Bootstrap core CSS --> <!-- 1.原生的href標簽 引用值前面不能加斜杠:"/",表示相對路徑,以下路徑皆可識別 1)項目的/resources/static/路徑 2)webjars的jar包中的/META-INF/resources/ 路徑下, 2.thymeleaf模板引擎標簽 2.1 值前面不➕斜杠,效果與原生的href無異,都是取相對路徑 2.2 值前面➕斜杠,thymeleaf會在斜杠前自動加上系統的根路徑 即配置文件中:server.servlet.context-path=/crud3 指定的值,不指定則默認為空 --> <link href="webjars/bootstrap/4.1.3/css/bootstrap.css" th:href="@{/webjars/bootstrap/4.1.3/css/bootstrap.css}" rel="stylesheet"> <!-- Custom styles for this template --> <link href="asserts/css/signin.css" th:href="@{/asserts/css/signin.css}" rel="stylesheet"> </head> <body class="text-center"> <form class="form-signin" action="dashboard.html"> <img class="mb-4" th:src="@{/asserts/img/bootstrap-solid.svg}" src="asserts/img/bootstrap-solid.svg" alt="" width="72" height="72"> <h1 class="h3 mb-3 font-weight-normal">Please sign in</h1> <label class="sr-only">Username</label> <input type="text" class="form-control" placeholder="Username" required="" autofocus=""> <label class="sr-only">Password</label> <input type="password" class="form-control" placeholder="Password" required=""> <div class="checkbox mb-3"> <label> <input type="checkbox" value="remember-me"> Remember me </label> </div> <button class="btn btn-lg btn-primary btn-block" type="submit">Sign in</button> <p class="mt-5 mb-3 text-muted">© 2017-2018</p> <a class="btn btn-sm">中文</a> <a class="btn btn-sm">English</a> </form> </body> </html>