Springboot 模板渲染
在之前所見到的信息顯示發現都是以Rest風格進行顯示,但是在實際開發之中, 所有數據的顯示最終都應該交由頁面去處理完成。在Springboot 中這個頁面並不是我之前的jsp ,FM 這些 而是普通的html頁面,而且最爲重要的是 此處所使用的渲染頁面採用的是模板方式的顯示 而在java開發之中 前臺顯示模板爲三類 FreeMarker Velocity thymeleaf (官方推薦使用)
1.0 如果要使用 thymeleaf 那麼應該首先進行相關支出依賴庫導入 修改pom.xml 配置文件
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
記住改完Maven配置文件要刷新一下哈!
2.0 本次開發需要一個控制層跳到頁面進行信心處理,在SpirngMvc 的時候使用的是ModelAndView 傳遞,而現在Springboot 裏面如果要傳遞直接在方法中定義一個Model 參數就可以了。
3.0 控制層代碼
package com.fabu.demo4.controller;
import com.fabu.demo4.service.IMessage;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.servlet.ModelAndView;
import java.util.HashMap;
/****
* 控制層 用來測試模板渲染處理
*/
@Controller
@RequestMapping("/Message")
public class MessageController {
@Autowired
private IMessage iMessage;
@RequestMapping(value = "/info",method = RequestMethod.GET)
public String info(String user, Model model){
model.addAttribute("url",iMessage.info()); //request 屬性傳遞包裝
model.addAttribute("username",user);
return "message/index"; //返回一個路徑 後綴是默認.html
}
/*****
* 老的方式 進行操作
* @param user
* @param map
* @return
*/
@RequestMapping(value = "/msg",method = RequestMethod.GET)
public ModelAndView msg(String user, HashMap<String,Object> map){
map.put("url",iMessage.info());
map.put("username",user);
return new ModelAndView("message/index",map);
}
}
3.1 service 層的代碼如下
package com.fabu.demo4.service;
public interface IMessage {
/*****
* 按照真實開發 數據全部要去數據庫查詢出來 我這裏爲方便就不建立 數據庫操作層了
*/
public String info();
}
3.2 service 層實現類代碼如下
package com.fabu.demo4.service;
public class IMessageImpl implements IMessage {
/*****
* 按照真實開發 數據全部要去數據庫查詢出來 我這裏爲方便就不建立 數據庫操作層了
*/
@Override
public String info() {
return "測試模板渲染 zw";
}
}
3.4 使用Springboot 構建Bean 方式注入
package com.fabu.demo4.config;
import com.fabu.demo4.service.IMessageImpl;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
/****
* 使用配置向的方式來配置Bean
*/
@Configuration
public class IMessageService {
@Bean //構建一個Bean 進行處理
public IMessageImpl getIMessageImpl(){
return new IMessageImpl();
}
}
項目目錄結果如下
'
4.0 現在控制層使用的是@Controller 註解 所以執行該控制器的方法後會進行跳轉處理 如果要進行跳轉頁面的定義 有嚴格要求 在classpath 路徑下 src/main/resources src/main/view 必須建立有一個templates 的目錄 在這個目錄裏面保存有thymeleaf的所有相關頁面
5.0 在 templates 裏面編寫index頁面
頁面編寫 所有元素必須要有完結標籤
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Springboot thymeleaf 模板渲染</title>
<meta http-equiv="Content-Type" content="text/html" charset="UTF-8">
</head>
<body>
<p th:text=" '數據'+ ${url} "></p>
<p th:text=" '用戶名' +${username} "></p>
</body>
</html>
6.0 運行服務 而後輸入訪問路徑
http://localhost:8080/Message/msg?user=springboot
結果如下
7.0 如果現在我們所定義的要訪問的頁面不是通過控制器跳轉的該怎麼辦? 可以考慮在thymeleaf 所在父路徑裏面建一個static 的子目錄,該目錄保存的是所有靜態頁面
在以後的實際開發之中 像js .css images 等信息文件都要求放在static 目錄裏面
8.0 thymeleaf 默認的訪問的頁面路徑的後綴爲*.html 那麼可以通過application.yml 配置文件進行變更
server:
port: 8080
spring:
thymeleaf:
suffix: .htm
這個時候你需要修改index 頁面後綴爲 .htm