Spring MVC 實戰：FreeMarker 模板引擎與動態頁面靜態化

一、FreeMarker 核心優勢

• 界面與數據分離，業務邏輯與展示邏輯解耦
• 語法簡潔、功能強大、渲染高效
• 適用：HTML 生成、動態頁靜態化、代碼生成器

二、快速入門示例

1. Maven 依賴

<dependency>
  <groupId>org.freemarker</groupId>
  <artifactId>freemarker</artifactId>
  <version>2.3.23</version>
</dependency>

2. 模板文件 (product.ftl)

----------產品詳細----------
產品名稱：${name}
產品價格：${price}
設計作者：<#list users as user> ${user} 
------------------------------

3. Java 代碼渲染

Configuration cfg = new Configuration(Configuration.VERSION_2_3_22);
cfg.setDirectoryForTemplateLoading(new File("src/main/java/templates"));
cfg.setDefaultEncoding("UTF-8");

Map data = new HashMap<>();
data.put("name", "Huwei P8");
data.put("price", "3985.7");
data.put("users", new String[]{"Tom","Jack","Rose"});

Template temp = cfg.getTemplate("product.ftl");
Writer out = new OutputStreamWriter(System.out);
temp.process(data, out); // 輸出到控制台

三、動態頁面靜態化實戰

優點

• SEO 友好：內容直接在 HTML 中
• 降低服務器壓力：無需動態解析
• 安全性高：避免 SQL 注入、XSS
• 訪問速度快：純靜態資源

挑戰

• 內容更新策略：定時生成、首次請求生成、後台批量生成
• 局部動態內容（評論、訪問量）：AJAX 或 iframe 嵌入

完整實現步驟

1. 建立 Maven Web 項目，引入 freemarker、servlet-api、jsp-api
2. 實體類 Article、服務類 ArticleService（模擬數據）
3. 編寫兩個模板：newsList.ftl（列表）、news.ftl（詳情）
4. Servlet News：檢查靜態文件是否存在 → 不存在則渲染生成列表頁與詳情頁 → 轉發 index.html
5. web.xml 設置 index.html 為首頁，index.jsp 轉發到 Servlet

生成目錄結構：

webapp/
  index.html          // 新聞列表
  news/
    20160701.html     // 單篇新聞
    20160702.html
    ...

四、FreeMarker 模板語法精華

1. 模板四要素

• 文本：直接輸出
• 註釋：<#-- ... --> 不輸出
• 插值：${...} 或 #{...} 輸出變量
• FTL 指令：<#directive> 控制邏輯

2. 常用指令

• <#if>/<#elseif>/<#else> 條件判斷
• <#list items as item> 迭代，內置 item_index、item_has_next
• <#include "file.ftl"> 包含模板
• <#macro name param> 定義宏（復用片段），<@name param=value> 調用
• <#assign var=value> 定義變量
• <#setting name=value> 設置環境（locale、number_format 等）
• <#escape x as x?html> 批量轉義輸出

3. 表達式與運算符

• 直接指定值：字符串、數字、布爾、集合 [1,2,3]、Map {"k":"v"}
• 變量訪問：user.name、list[0]、map.key
• 字符串連接：${"Hello ${user}"} 或 "Hello " + user
• 算術/比較/邏輯運算符完整支持
• 內建函數：?html、?upper_case、?size、?int
• 空值處理：var!default、var??

五、源碼獲取

GitHub 項目地址：github下載或預覽代碼