Web開發人員必會的模板引擎技術之Freemarke

Web開發人員必會的模板引擎技術之Freemarker

幾何時，Web開發是個多么高大上的名字，程序猿們都以能搞定Web技術為榮，此時還沒有前后端之說。然而隨著互聯網的發展，社會分工進一步細化，職業崗位也更加細分，慢慢開始有了前端攻城獅和后端攻城獅，技術也進一步細分，出現了以HTML、JS等為主的頁面技術，以Java、Pyton為主的后端開發語言技術。

事實上，直到前后端分離開發模式已經逐漸成為主流的今天，前后端技術的劃分也沒能完全清晰，我們可能會經常聽到一個叫全棧工程師的名字，這是一類野心極其大想前后端通吃的程序猿，這是要逼著其他程序猿回家種地的節奏，程序猿沒有女朋友已經夠慘了，還要這樣傷害這些單純可愛的人嗎？

大家都是程序猿，本自同根生，相煎何太急。

全棧工程師其實就是前端和后端技術都會的一類人，而這類人基本都是后端工程師；為什么這么說呢，以Java工程師為例，哪個Java工程師不會HTML、JS呢，否則會被人鄙視的；甚至經驗豐富的老司機比真正前端工程師還要精通。Web開發本身就是后端工程師的一部分工作。比如，在Java Web開發領域程序猿通常是既寫前端代碼，也寫后端代碼；而且Web開發有著很多很優秀的頁面技術HTML、JSP等。這些優秀的頁面技術，使Java在Web開發領域有著舉足輕重的地位。

咱們今天要學習的也是一個在Java開發領域非常流行的模板引擎技術-Freemarker，用過Spring Boot的同學可能都知道，Spring Boot在自己體系里默認支持的頁面技術不是JSP，而是Thymleaf、Freemarker的模板引擎技術。所以，今天咱們就先來學習一下其中的一個，使用Freemarker模板引擎技術做Web開發。

那么問題來了，咱們一直在說模板引擎技術，那什么是模板引擎呢？接下來咱們先來了解一下模板引擎技術。

什么是模板引擎技術

傳統的頁面開發過程中通常采用的HTML + JS技術，而現在大部分網站都采用標簽化+ 模塊化的設計。模板引擎其實就是根據這種方式，使用戶界面與業務數據（內容）分離而產生的，它可以生成特定格式的文檔，用于網站的模板引擎就會生成一個標準的HTML文檔在原有的HTML頁面中來填充數據。最終達到渲染頁面的目的。

說人話就是，把數據和頁面整合在一起的技術。

常用的模板引擎技術：

? Thymleaf

? FreeMarker

? Velocity

今天咱們就來先學習Freemarker。

什么是FreeMarker

咱們先來介紹下Freemarker的概念，FreeMarker是一個使用純Java編寫的基于模板生成文本輸出的通用工具，通常它的文件都是.ftl結尾，FreeMarker最初被用在MVC模式的Web開發框架中生成HTML頁面，但是它的功能可不僅僅可以用到Web開發生成模板文件，它也可以用于非Web應用環境中，如：生成Java代碼。

FreeMarker的主要特點

既然Freemarker 模板技術是Spring Boot官方默認支持的，那么它有哪些特點，才如此的備受青睞呢？

? 輕量級

不像JSP那樣是Servlet要嵌入到應用程序中

? 可以生成各種文本文件

如：html、xml、java等

? 學習成本低

因為是用java編寫的，所以語法和java很像

好了，接下來我們來看看Spring Boot整合 Freemarker 的實戰操作。

Freemarker 渲染 Web 頁面

首先，添加pom依賴，我們使用SpirngBoot Initializr 創建SpringBoot基礎工程（記得加上Web依賴，因為我是搞Web開發），按照我們的經驗，在Spring Boot中如果想要集成什么技術只需要添加相關技術的依賴就可以，所以呢，這里我們就直接添加FreeMarker的依賴。

當然你也可以在創建項目時直接勾選需要的依賴，項目在創建完成的時候自動加上這個依賴，如下圖：

添加FreeMarker相關屬性配置

創建好工程之后，在application.properties文件中添加FreeMarker相關配置。

創建頁面

這里需要注意的是freemarker的文件名是以.ftl后綴的，我們在resources\templates文件夾下創建freemarker.ftl文件，需要注意的是freemarker在取值的時候使用的是插值表達式。

創建Controller

這里需要注意,在寫controller的時候，我們使用注解是@Controller，因為我們要跳轉到html頁面，不再是返回JSON數據了。

測試結果

最后啟動Spirng Boot工程，在瀏覽器地址欄中輸入如下地址就可以了，

效果如下：

好了，通過以上簡單的幾步就可以輕松實現Spring Boot整合FreeMarker模板引擎技術進行web開發了，是不是很激動呢？

怎么樣，你了解了么？歡迎和我們一起探討。

更多IT技術干貨，請關注課工場，和我們一起關注前沿技術，快速提升。

件項目實訓及課程設計指導——如何在Web應用系統表示層開發實現中應用Velocity模板技術

1、分離Web表示層的數據處理和展現邏輯的常見的應用技術

分離Web表示層的數據處理和展現邏輯是目前企業級的Web應用系統開發中表現層組件開發實現中的基本實現目標。為此，軟件應用系統的設計和開發實現人員必須要尋找到一種能夠減少軟件開發人員重復勞動的方法，讓程序員將更多的精力放在業務邏輯以及其它更加具有創造力的工作上。

因此，讀者在課程設計的項目開發中，不應該在Web頁面中出現包含大量的服務器端腳本程序代碼的Web頁面狀況，這樣的Web應用系統在后期的系統維護、升級中都會比較困難。

如下示圖所示的程序代碼示例是不良好的Web表示層程序實現的代碼示例，因為不僅在Web頁面（*.jsp）中包含有大量的Java程序腳本的代碼，而且在JSP頁面中直接訪問數據庫（沒有合理地進行分層設計）和應用System.out.print控制臺信息的輸出語句（此語句只能將信息打印輸出到服務器主機的系統控制臺上而不能輸出到Web瀏覽器中，前端用戶根本就無法瀏覽到相關的信息）。

希望讀者在學習和閱讀作者的《軟件項目實訓及課程設計指導》系列文章的內容時，重點掌握目前比較主流的分離Web表示層的數據處理和展現邏輯的技術實現方法——比如，采用CSS+Div分離Web表示層數據和表現、應用XML+XSLT技術徹底分離數據和樣式、應用Velocity模板技術實現開發職責分離，并能夠在課程設計的項目開發中應用作者在本系列文章中介紹的各種方法。

當然，分離Web表示層的數據處理和展現邏輯目前其實有多種不同的實現方式，不僅僅局限于作者在上文中所提及和介紹過的方法，比如同樣很優秀的 Freemarker 也獲得了非常廣泛的應用。因此，讀者在項目開發實現中應該要根據項目的具體需要和自己對具體技術實現的熟悉程度合理地選用。

作者在下文中將為讀者介紹如何在J2EE 系統平臺中的Web應用系統表示層開發實現中應用Velocity模板技術。但作者考慮到Velocity模板技術以及隨后幾篇文章中將要介紹的Struts和Struts2應用框架等技術在目前高校的課堂教學中一般都不會涉及，因此部分讀者可能在閱讀本系列文章的內容時對Velocity模板技術和Struts2應用框架會感覺比較陌生，給讀者的學習和理解會帶來一定的難度。

作者建議讀者在課程設計的項目開發中能夠應用Velocity模板技術，經過一段時間的項目開發和應用的實踐，也就能夠慢慢地熟悉和掌握Velocity模板技術和Struts2應用框架等應用技術。

2、什么是J2EE 系統平臺中的Velocity模板技術

Velocity是Apache 基金會的一個開源的模板引擎（Template Engine）項目，其初始開發的主要目標是分離基于MVC 體系架構設計模式的應用系統的持久化層和業務層，但目前被廣泛地應用于J2EE Web應用系統中的表示層組件開發中。它能夠允許Web開發者在不使用傳統的JSP頁面的應用情況下，可以用 Velocity模板讓HTML頁面也能夠具有動態內容的特性。

如下示圖為Apache Velocity的官方網站頁面中對Velocity模板相關技術特性和應用介紹的文字局部截圖。

讀者可以從Velocity的官方網站上下載Velocity的系統運行包文件和技術參考文檔等系統庫和資料，然后再解包該系統庫的運行包文件，請見下圖所示的下載頁面。

Velocity是一種基于Java系統平臺的模板引擎，它允許軟件應用系統的開發人員使用簡單而強大的模板語言來引用哪些定義在Java程序代碼中的對象。而且Velocity應用具有簡潔的語法和采用類似腳本語言的方式引用目標數據對象。

Velocity模板引擎本身不是采用標準的模型視圖控制器（MVC）體系結構設計，它只是Web應用系統中的"模型組件"和"視圖組件"之間的橋梁。并為Web頁面的前端開發和制作人員提供了一種清晰而又簡單的模板語法，而且模板和程序代碼是分離的。

所以Web應用系統的開發人員可以分別獨立地開發和維護它們，Web前端開發人員可以和后端Java 程序開發人員同步開發一個遵循 MVC體系架構的Web應用系統。而且目前的Velocity 模板引擎也很容易能夠集成到J2EE Web容器的運行環境中——如Servlet容器中，也很容易能夠與Struts應用框架和Struts2應用框架相互集成。

因為Velocity 模板引擎的強大之處在于它嚴格地區分Web應用系統項目開發中的人員職責劃分——頁面開發人員只需要把精力和關注點放在數據的顯示功能實現部分，而Java程序員更多地只需要關注如何編程應用系統中的控制層程序和商業業務邏輯、系統中數據庫表中數據的訪問控制和管理等方面的功能實現。

Velocity 模板是一個目前比較流行的JSP頁面技術的替代物，并且能夠實現把 Java 程序代碼從Web頁面中分離出來。

3、Velocity 模板語言VTL

Velocity 模板使用的腳本語言稱為 Velocity 模板語言（VTL，Velocity Template Language），但它和其它形式的腳本語言（如JavaScript等）相比，Velocity 模板語言的語法相對而言比較簡單。

在Velocity 模板語言中提供有變量定義、指令、注釋、對象的引用和各種運算符、宏定義等，也還提供了許多的內置對象。比如下面的代碼語句是設置變量someVarable的值為"Velocity"：#set( $someVarable="Velocity" )。

在上面的代碼中讀者可以看到很多以"#"和"$"字符開頭的內容，這些都是 Velocity 模板語言的語法。在 Velocity模板語言中所有的關鍵字都是以"#"開頭的，而所有的變量則是以"$"開頭。Velocity 模板語言的語法類似于 JSP 技術中的 JSTL（JSP標準的標簽庫）。

作者考慮到本文章的篇幅有限，在此文中不能詳細地為讀者介紹Velocity 模板語言的語法，讀者有興趣可以參考和閱讀Velocity 的官方文檔，其中提供了Velocity 語法相關的詳細內容。

4、Velocity模板系統庫中的VelocityServlet組件類

雖然大多數基于Velocity模板的Java應用都是基于J2EE Servlet的Web應用系統，但其實Velocity模板是可以應用于J2SE的應用程序和J2EE Web應用程序的兩種不同的開發環境中。但作者在本文中主要介紹在J2EE Web應用程序的開發環境中如何應用Velocity模板。

但由于Velocity模板只是一個模板引擎，讀者如果需要在J2EE Web應用系統項目中應用Velocity模板，還需要在項目中添加一個HTTP框架以便能夠處理HTTP請求（request）和轉發（response）。

為此，在Velocity模板所提供的系統程序包中，提供有一個VelocityServlet組件類（org.apache.velocity.servlet.VelocityServlet），Web應用系統只需要繼承并擴展它便可以很快地創建一個基于Velocity模板功能處理的Servlet程序，也就是通過繼承VelocityServlet 組件類以產生出自己的Servlet組件。

由于Velocity 模板的系統庫不斷地在更新和升級，如果讀者通過繼承VelocityServlet 組件類以產生出自己的Servlet組件時出現如下的提示信息："the type VelocityServlet is deprecated"，說明讀者所下載的Velocity 模板系統庫中已經將VelocityServlet升級替換為org.apache.velocity.tools.view.VelocityViewServlet類，讀者只需要將VelocityServlet類修改為VelocityViewServlet類。

如下示圖為Velocity官方網站頁面中對新版本的Velocity 模板系統庫中的VelocityViewServlet類的定義說明局部截圖。

在自己派生出的Servlet組件中可以獲得與HTTP請求相關的request、session與application等對象，從而也可以直接獲得通過Servlet容器保存在這幾個域對象中的值或者返回業務處理后的結果值。

因此，應用Velocity 模板技術可以分離Web應用系統中的業務處理邏輯和數據顯示風格控制邏輯。

5、在Web表示層開發實現中應用Velocity模板的基本步驟

Velocity 的任何模板都可以被VelocityServlet使用、并且能夠部署在服務器上，也相對比較簡單。只需要采用以下的開發實現步驟：

（1）Web應用系統的開發人員首先通過繼承 org.apache.velocity.servlet.VelocityServlet 類（或者org.apache.velocity.tools.view.VelocityViewServlet類）并派生出自己的Servlet 程序類；

（2）其次，在所派生出的Servlet 程序類中，重寫并實現其中的一個handleRequest()方法，在 handleRequest() 的方法實現中，從文件或資源（如JAR文件）中取得模板文件并返回該模板；

如下示圖為Velocity官方網站頁面中對handleRequest()的方法定義及功能、返回參數的說明局部截圖。

（3）最后，在重寫的handleRequest() 的方法實現中，添加希望在模板中作為上下文屬性使用的數據或Velocity工具，并且由VelocityServlet向瀏覽器響應輸出——可以由它在向HttpServletResponse的OutputStream 流對象發送之前生成要響應輸出的 HTML標簽。

體現在Web表示層開發實現中應用Velocity模板的基本步驟相關的程序代碼示例如下，讀者可以根據自己的應用項目的需要進行修改和擴展。

public class VelocityServletDemo extends VelocityViewServlet {
      @Override
      protected Template handleRequest(HttpServletRequest request, HttpServletResponse response, Context ctx) {
            /** 在Context上下文環境容器對象實例中存放指定名稱的變量值 */
            ctx.put("someVarableName","someVarableValue");
            /** 也可以在request域對象實例中存放指定名稱的變量值 */
            request.setAttribute("someVarableName","someVarableValue");
            …
            … 其它的程序代碼，在此省略
            …
            /** 在業務處理完畢后再 forward轉發到指定模板 */
            return getTemplate("myVelocityTemplate.html");
      }
}

Velocity 模板文件是文本格式的文件，并且它可以是HTML、XML等類型的文件（上面的程序代碼示例中的模板文件名稱為myVelocityTemplate.html）。但在模板文件中一般包括有如下幾個不同部分的內容：

1）照原樣合并的靜態部分

2）將被要合并的數據替代的占位符

3）腳本語言中的指示符和指令。

如下頁面代碼為上面程序代碼中最終轉發到的myVelocityTemplate.html模板文件代碼示例，它與標準的HTML頁面差別在于其中包含有黑體標識的數據獲取表達式，如$userName、$userPassword等。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312">
      <title>一個簡單的VelocityWeb應用頁面</title>
</head><body>
      <center> <h2>下面為Servlet處理后的結果</h2></center>
      <table cellspacing="0" cellpadding="5" width="200" align="center">
          <tr><td >用戶名稱</td><td >用戶密碼</td></tr>
          <tr><td>$userName</td><td>$userPassword</td></tr>
      </table>
</body></html>

另外，myVelocityTemplate.html頁面為靜態的HTML頁面而不是動態的服務器端的JSP頁面，因此頁面的響應速度將會大大地提高，從而應用Velocity 模板技術的Web頁面可以是非JSP類型的Web頁面——達到"動態內容靜態化"的應用效果。

6、如何在派生的Servlet程序中向響應輸出的目標頁面傳遞數據

J2EE Web應用系統的開發人員只需要把數據放置到Velocity的上下文對象中（org.apache.velocity.context.Context），然后Velocity引擎使用Velocity上下文對象中的數據、并應用到模板文件中，最后按照模板文件的格式輸出數據。在上面的示例代碼中的如下語句則是在模板文件中獲得保存在Velocity上下文對象中的指定名稱的數據值，然后在表格行中顯示。

<tr><td>$userName</td><td>$userPassword</td></tr>

7、與Velocity模板相關的兩個重要的概念

（1）Velocity模板（Template類）

它是遵守Velocity VTL模板語言的語法規則定義的一個文本格式的文件，該文件采用Velocity語言定義模板文件。比如下面的程序示例代碼是獲得指定文件名稱為VelocityTemplate.vm的模板文件，并指定所應用的編碼格式為中文GB2312編碼：

Template oneTemplateObject=oneVelocityObject.getTemplate("VelocityTemplate.vm","gb2312");

在默認的情況下，Velocity模板引擎的系統程序會在Web應用系統資源根路徑下搜索*.vm文件，所以開發人員直接將*.vm文件放在Web應用系統資源根路徑下即可（當然，也可以通過配置velocity.properties文件中的配置項目來指定加載的路徑）。

（2） Velocity上下文（VelocityContext類）

它是Velocity模板引擎系統的一個容器，用于保存相關的業務數據。開發人員可以把Velocity模板上下文VelocityContext類看作是導入 Java 對象并在 Velocity 模板內部訪問的一種方法。

比如下面的程序代碼是創建一個VelocityContext類的對象，并在其中保存需要向Web表示層頁面傳遞的參數——參數的名稱為userName，而對應的參數值為"張三"。

VelocityContext oneContextObject=new VelocityContext();
oneContextObject.put("userName", "張三");

因此，只需要通過創建 org.apache.velocity.context.Context 類型的對象實例就可以獲得 Velocity 的上下文VelocityContext對象，然后利用上下文對象中的 put方法，把要導入到模板文件中的對象附加到上下文中。

當然，如果是采用繼承VelocityViewServlet類而派生出自己的Servlet程序類，并在自己的Servlet程序類中重寫handleRequest()方法的方式的程序中，不需要自行再創建出VelocityContext 類的對象實例，而直接應用handleRequest()方法中所攜帶的Context接口類型的對象實例（參看如下示例代碼中的黑體標識的代碼）。

protected Template handleRequest(HttpServletRequest request, HttpServletResponse response, Context ctx) {
 				…
        … 其它的程序代碼，在此省略
        …
}

應用XML+XSLT技術分離Web應用表示層數據和樣式的實例

如何應用“XML+XSLT”技術分離Web表示層數據和樣式

如何應用CSS+Div分離Web表示層數據處理邏輯和展現邏輯

如何正確應用Web MVC架構模式分離表示層和模型層耦合關系

如何應用策略設計模式分離JDBC數據庫連接中的外部環境信息

件項目實訓及課程設計指導——如何利用MyEclipse開發工具開發基于Velocity模板的Web應用

1、在MyEclipse開發工具中新建一個名稱為WebVelocity的Web項目

在名稱為WebVelocity的J2EE Web應用項目中的lib目錄下添加Velocity模板所需要JAR包文件velocity-1.6.1-dep.jar，請見下圖所示的最終操作的結果截圖。

由于Velocity 模板的系統庫不斷地在更新和升級，讀者可以從Velocity的官方網站上下載Velocity的系統運行包文件和技術參考文檔等系統庫和資料，然后再解包該系統庫的運行包文件，請見下圖所示的下載頁面。

2、在該Web項目中添加一個文件名稱為userLogin.jsp的JSP頁面

在該userLogin.jsp的JSP頁面中添加一個實現應用系統的用戶登陸功能的Web表單，并且向應用系統后臺的Servlet組件發送Web請求。該userLogin.jsp的JSP頁面的內容標簽請見如下示例中所示的內容—— 名稱為userLogin.jsp的JSP頁面內容。

<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
      <head>
      			<title>My JSP 'userLogin.jsp' starting page</title>
      </head>
      <body>
            <form action="/WebVelocity/userloginservlet" method="POST">
                  請輸入用戶名稱：<input type="text" name="userName"><br>
                  請輸入用戶密碼：<input type="password" name="userPassword"><br>
                  <input type="submit" value="提交">
                  <input type="reset" value="重來">
            </form>
      </body>
</html>

該userLogin.jsp的JSP頁面在Web瀏覽器中的執行結果如下示例圖所示，其中包含有一個收集用戶登陸信息的Web表單。

3、在該Web項目中再添加一個Servlet組件

該Servlet類名稱為UserLoginServlet，程序包名稱為com.px1987.webvelocity.servlet，并且繼承org.apache.velocity.servlet.VelocityServlet類、URL-Pattern為/userloginservlet。該Servlet類代碼內容請見如下代碼示例所示的UserLoginServlet類代碼示例。

在新版本的Velocity模板系統庫中，將VelocityServlet類升級替換為VelocityViewServlet（org.apache.velocity.tools.view.VelocityViewServlet）類，讀者在開發中只需要將VelocityServlet類修改為VelocityViewServlet類。

（1）編程該Servlet類的程序代碼—— UserLoginServlet類代碼示例

package com.px1987.webvelocity.servlet;
import java.io.*;
import java.util.Properties;
import javax.servlet.*;
import javax.servlet.http.*;
import org.apache.velocity.Template;
import org.apache.velocity.app.Velocity;
import org.apache.velocity.context.Context;
import org.apache.velocity.exception.*;
import org.apache.velocity.servlet.VelocityServlet;
public class UserLoginServlet extends VelocityServlet{
      protected Properties loadConfiguration(ServletConfig config ) throws
      IOException,FileNotFoundException{
            String propsFile=config.getInitParameter("properties");
            if ( propsFile !=null ){
                  String realPath=getServletContext().getRealPath(propsFile);
                  if ( realPath !=null ) {
                 			 propsFile=realPath;
                  }
            }
            Properties onePropertiesObject=new Properties();
            onePropertiesObject.load( new FileInputStream(propsFile) );
            String propertiesFilePath=onePropertiesObject.getProperty("file.resource.loader.path");
            if (propertiesFilePath!=null){
                  propertiesFilePath=getServletContext().getRealPath(path);
                  onePropertiesObject.setProperty(Velocity.FILE_RESOURCE_LOADER_PATH, path );
            }
            /** 設置模板的資源位置 */
            propertiesFilePath=onePropertiesObject.getProperty("runtime.log");
            if (propertiesFilePath!=null){
                  propertiesFilePath=getServletContext().getRealPath(path);
                  onePropertiesObject.setProperty("runtime.log", propertiesFilePath);
            }
            return onePropertiesObject;
        }
        public Template handleRequest(HttpServletRequest request,
            HttpServletResponse response, Context context )
            throws ServletException, IOException{
                  String userName=request.getParameter("userName");
                  String userPassword=request.getParameter("userPassword");
                  context.put("userName", userName);
                  context.put("userPassword", userPassword);
                  Template outTemplate=null;
                  try {
                 			 outTemplate=getTemplate("WebVelocityApp.html");
                  }
                  catch( ParseErrorException e ){
                        request.setAttribute("errorText","不能對模板進行解析" );
                        error(request,response,e);
                  }
                  catch( ResourceNotFoundException e ){
                        request.setAttribute("errorText","沒有找到模板文件" );
                        error(request,response,e);
                  }
                  catch( Exception e ){
                        request.setAttribute("errorText","出現了其它方面的錯誤" );
                        error(request,response,e);
                  }
            return outTemplate;
      }
      /** 異常處理也都交到error方法處理，可以覆蓋基類中的error的處理辦法，從而實現對異常的封裝和包裹。*/
      protected void error( HttpServletRequest request, HttpServletResponse response,
      Exception cause ) throws ServletException, IOException{
          String errorText=(String) request.getAttribute("errorText");
          StringBuffer oneStringBuffer=new StringBuffer();
          oneStringBuffer.append("<html>");
          oneStringBuffer.append("<head><meta http-equiv=\"Content-Type\"
          content=\"text/html; charset=gb2312\">");
          oneStringBuffer.append("<title>錯誤信息顯示頁面</title>");
          oneStringBuffer.append("</head><body>"+ errorText+"<br>錯誤出現的位置：<br>");
          StringWriter oneStringWriter=new StringWriter();
          cause.printStackTrace(new PrintWriter(oneStringWriter));
          oneStringBuffer.append(oneStringWriter.toString());
          oneStringBuffer.append("</body></html>");
          response.setContentType("text/html;charset=gb2312");
          PrintWriter webOutPutStream=response.getWriter();
          webOutPutStream.print(oneStringBuffer.toString());
      }
}

（2）在Web項目的部署描述文件web.xml文件中部署定義該Servlet類

在部署該Servlet類的同時，還需要為它提供一個名稱為properties的初始化參數，其值為Velocity模板的屬性配置文件velocity.properties的路徑信息（在程序UserLoginServlet類中動態獲得）。如下代碼示例為在web.xml文件中部署該UserLoginServlet類的部分代碼。

<servlet>
      <servlet-name>UserLoginServlet</servlet-name> 
     <servlet-class>com.px1987.webvelocity.servlet.UserLoginServlet</servlet-class>
      <init-param>
            <param-name>properties</param-name>
            <param-value>/velocityConf/velocity.properties</param-value>
      </init-param>
</servlet>
<servlet-mapping>
      <servlet-name>UserLoginServlet</servlet-name>
      <url-pattern>/userloginservlet</url-pattern>
</servlet-mapping>

4、在Web項目的velocityConf目錄中添加Velocity的屬性配置文件

在本Web項目中新增一個屬性配置文件所在的文件目錄，目錄的名稱為velocityConf，并在該velocityConf目錄下，再添加一個文件名稱為velocity.properties文件。設置該文件中的內容，請見如下代碼中的示例——Velocity模板引擎（Template Engine）的velocity.properties屬性配置文件的示例

file.resource.loader.path=/
runtime.log=/velocity.log

該文件為Velocity模版引擎的初始化參數文件，Web應用系統的開發人員可以在其中設置相關的工作參數，這些工作參數主要是Velocity模板引擎的配置、編碼、緩存、日志等文件的工作參數的定義等。

當然，在Velocity模版引擎中也預設了一些默認的配置屬性，從而避免開發人員出現錯誤的配置項目。Web應用系統的開發人員通過配置velocity.properties文件，可以自定義vm文件加載方式，指定編碼等。

當然，也可以不配置velocity.properties文件而使用缺省的值即可。如下代碼示例是一個更有代表性的velocity.properties文件的配置示例。

## 設置Velocity模版引擎的模板文件加載器，webapp從應用根目錄加載
      resource.loader=webapp
      webapp.resource.loader.class=org.apache.velocity.tools.view.servlet.WebappLoader
## 定義Velocity模版引擎的模板文件路徑為Web應用系統的根目錄文件夾
			webapp.resource.loader.path=/
## 設置Velocity模版引擎的編碼方式
      input.encoding=UTF-8
      output.encoding=UTF-8

讀者也可以根據Web應用項目的需要，將其中的"input.encoding"和"output.encoding"設置為中文編碼格式，如GBK或者GB2312等。

5、在Web項目中再添加一個webVelocityApp.html模板文件

Velocity 模板文件其實是文本格式的文件，并且模板文件除了可以為*.vm的模板文件之外，還可以是HTML、XML 等標準格式類型的文本文件。因此，模板文件的文件擴展名可以是*.vm、*.html和*.xml等類型。在模板文件中一般都會包括有：

1）照原樣合并的靜態部分

2）將被要合并的數據替代的占位符

3）腳本語言中的指示符和指令

因此，在Web項目中新增一個HTML頁面文件，它是文件名稱為webVelocityApp.html的模板文件，在該模板文件中添加如下代碼示例所示的HTML標簽內容——webVelocityApp.html模板文件中的HTML標簽內容，讀者注意其中黑體標識的語句。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
      <head>
            <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
            <title>一個簡單的VelocityWeb應用頁面</title>
      </head>
      <body>
            <center> <h2>下面為Servlet處理后的結果</h2></center>
            <table cellspacing="0" cellpadding="5" width="200" align="center">
                  <tr>
                  				<td >用戶名稱</td><td >用戶密碼</td>
                  </tr>
                  <tr>
                  				<td>$userName</td><td>$userPassword</td>
                  </tr>
            </table>
      </body>
</html>

由于上面的這個模板文件是一個完整的 HTML 文件，因此可以使用任何Web頁面設計工具或者文本編輯器來創建和編輯該HTML頁面文件；在模板文件中訪問保存在上下文對象中的屬性：

比如，可以使用 $userName指令來引用前面保存到上下文對象中的屬性。注意：在Velocity模板文件中，變量的定義都是使用"$"字符開頭的，"$"字符作為Velocity模板文件中的標識符。

由于Velocity模板引擎系統采用簡單而強大的模板語言VTL實現對Web頁面的渲染，因此能保證在Dreamwaver之類的Web頁面可視化編輯器中都能夠正常顯示；另外，模板文件可以是任意的文件擴展名，采用*.vm、*.html或者*.xml都是可以的（本示例采用*.html文件擴展名），這樣就能直接在Web瀏覽器中看到Web頁面的預覽的效果。

6、執行該Web應用并測試Velocity模板的功能效果

讀者可以直接在瀏覽器中輸入如下形式的URL地址字符串，直接瀏覽用戶登錄頁面http://127.0.0.1:8080/WebVelocity/userLogin.jsp的請求URL地址后，將會出現如下示圖所示的實現用戶登陸功能的頁面。

讀者在上圖中所示的Web表單框中輸入用戶名稱和密碼，然后點擊其中的"提交"按鈕后，Web表單頁面將向Web應用系統后臺的Servlet組件提交Web請求，最后將出現如下示圖所示的執行結果狀態——本示例為了驗證應用Velocity模版引擎的正確性，在響應頁面中獲得用戶登錄的賬戶和密碼等信息，然后在頁面中顯示以比對是否正確地獲得了相關的數據。

從執行結果和最終在Web瀏覽器中響應輸出的信息來看，本示例的功能是正確的，對Velocity模版引擎的應用也是合情合理和正確的。

當然，在實際的Web應用系統中的業務處理邏輯中，并不會簡單直接地顯示出用戶敏感的登錄信息，而是通過訪問系統后臺的物理數據庫系統中的數據庫表中的數據，比對用戶提交的登錄信息是否合法和有效。

另外，webVelocityApp.html頁面為靜態的HTML頁面而不是動態的服務器端的JSP頁面，如果在本Web示例中不應用Velocity模版引擎系統，是很難實現在靜態的HTML頁面中獲得服務器端返回的業務處理結果的參數。

因此Web頁面的響應速度將會大大地提高，從而應用Velocity 模板技術的Web頁面可以是非JSP類型的Web頁面——達到"動態內容靜態化"的應用效果。

如何在Web應用系統表示層開發中應用Velocity模板技術