大家早上好鴨，今天又是周一了，大家的周一綜合癥有沒有犯呢，一起來摸魚吧(手動狗頭)
本文章最先發(fā)布于我的個人博客，簡書為同步發(fā)布，如有需要，可以訪問腿短快跑的個人博客獲取更多內容
Freemarker簡介
FreeMarker 是一款 模板引擎： 即一種基于模板和要改變的數據， 并用來生成輸出文本(HTML網頁，電子郵件，配置文件，源代碼等)的通用工具。 它不是面向最終用戶的，而是一個Java類庫，是一款程序員可以嵌入他們所開發(fā)產品的組件。
Freemarker和Thymeleaf對比
Freemarker和Thymeleaf都是一種模板渲染引擎，兩者各有優(yōu)缺點
Freemarker
- 用Java語言編寫的模板引擎，它基于模板來生成文本輸出
- 與Web容器無關，即在運行時，它并不知道Servlet或HTTP
- 不僅可以用作表現層的實現技術，而且還可以用于生成XML，JSP或Java 等
優(yōu)點
- 不能編寫java代碼，可以實現嚴格的mvc分離
- 性能不錯
- 內置大量常用功能，使用非常方便
- 支持表達式語言
- 支持宏定義（類似jsp標簽）
- 類似于jsp，學習成本低，符合以前使用jsp的習慣
缺點
- 不是官方標準
- 使用</>這樣的語法，就無法直接使瀏覽器渲染出原本頁面的樣子
Thymeleaf
- 是個XML/XHTML/HTML5模板引擎，可以用于Web與非Web應用。
- 主要目標是提供一種可被瀏覽器正確顯示的、格式良好的模板創(chuàng)建方式，因此也可以用作靜態(tài)建模。
- 可擴展性非常棒：可以使用它定義自己的模板屬性集合，這樣就可以計算自定義表達式并使用自定義邏輯。
優(yōu)點
- 使用了標簽屬性做為語法，模版頁面直接用瀏覽器渲染，瀏覽器可以直接打開模板文件，使得前端和后端可以并行開發(fā)
- 適合做服務器端渲染，通過服務器端模版渲染，客戶端收到的是在服務器端根據模版渲染后的html信息
- 可以支持前段瀏覽器渲染
- 可以作為模板引擎框架
- springboot官方推薦方案
缺點
- 模板必須符合xml規(guī)范。js腳本必須加入
<![CDATA[]]>標識，否則一個&符號就會導致后臺模板合成拋異常 - 錯誤信息不友好
為什么選擇Freemarker
上面我們對別了 Freemarker 和 Thymeleaf 的優(yōu)缺點，其實在項目的最開始，我一直是使用 Thymeleaf 作為模板渲染引擎的，但是最近要用到 layout 模板功能，Thymeleaf支持并不是很好，在網上也參考了很多博客的內容，但是沒有實現很完美的，因此考慮到了使用 Freemarker
集成Freemarker
引入依賴
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-freemarker</artifactId>
</dependency>
項目配置
spring:
freemarker:
# 請求重寫
allow-request-override: false
# session重寫
allow-session-override: false
# 緩存模板
cache: false
# 模板編碼
charset: UTF-8
check-template-location: true
# 類型
content-type: text/html
expose-request-attributes: false
expose-session-attributes: false
# 模板后綴名
suffix: .ftl
# 模板目錄
template-loader-path: classpath:/templates/
前端代碼
templates/index.ftl
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Index</title>
</head>
<body>
<div>大家好，我是 ${name}</div>
</body>
</html>
后端代碼
IndexController.java
/**
* @author C.W
* @date 2022/5/10 15:28
* @desc
*/
@Controller
public class IndexController {
@GetMapping("/")
public String index(Model model) throws IOException {
model.addAttribute("name", "腿短快跑");
return "index";
}
}
效果展示
訪問 http://IP地址:端口/
可以看到，頁面正常展示，并且已經將數據渲染成功
layout 模板功能
為什么需要layout
對于一個網站來說，基本的框架結構在每個頁面都是相似的，如果框架結構在每個文件中都重寫一遍，重復工作量很大，且當需要修改框架模板時，每個文件都需要修改，重復且容易出錯
使用 layout 模板，每個文件只需要引入模板即可達到效果
創(chuàng)建公用組件
templates/components/header.ftl
<div style="background-color: green; color: white">
這是頭部
</div>
templates/components/footer.ftl
<div style="background-color: blue; color: white">
這是尾部, @CopyRight 腿短快跑
</div>
創(chuàng)建layout布局
templates/layout.ftl
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Index</title>
</head>
<#macro css>
<#nested>
</#macro>
<body>
<!-- 引入header -->
<#include "components/header.ftl">
<!-- 布局 -->
<#macro layout>
<#nested>
</#macro>
<!-- 引入footer -->
<#include "components/footer.ftl">
</body>
<#macro js>
<#nested>
</#macro>
</html>
創(chuàng)建頁面
templates/index/index.ftl
<#include "../layout.ftl">
<@css>
<style>
.div {
background-color: yellow;
}
</style>
</@css>
<@layout>
<div class="div">
大家好，我是 ${name}
</div>
</@layout>
<@js>
<script>
alert('這是js')
</script>
</@js>
頁面控制器
IndexController.java
/**
* @author C.W
* @date 2022/5/17 11:25
* @desc 首頁
*/
@Controller
public class IndexController {
@GetMapping("/")
public String index(Model model) {
model.addAttribute("name", "腿短快跑");
return "index/index";
}
}
結果展示
