http://blogger.org.cn/blog/more.asp?name=lhwork&id=20795
模板引擎 Template Engine
在B/S程式設計中,常常有美工和程序員二個角色,他們具有不同專業技能:美工專注於表現——創建頁面、風格、佈局、效果等等可視元素;而程序員則忙於創建程式的商業流程,生成設計頁面要顯示的數據等等。
很多時候,要顯示的資料在設計的時候並不存在,它們一般是在運行時由程式產生的,比如執行“價格不高於800NT的USB Disk”查詢的返回結果。這種技術需求產生了JSP等Scriptlet,JSP十分強大,但是也常常被濫用,並導致一些不良的後果
- 將邏輯和表現混合在一起。
- 破壞了美工和程序員職責的正常分解。
- 使JSP頁面難以閱讀和維護。
模板引擎就是爲了解決上面的問題而產生的。在設計HTML的時候,我們加入一些特定指令來指定要插入哪些數據,這些加了特殊指令的HTML或者其他文本,我們稱爲模板(Template)。而模板引擎會在輸出頁面時,用適當的數據替代這些代碼。
模板和嵌入JSP的HTML是不同的,模板指令只有很有限的編程能力,可以避免混入商業邏輯。
三萬英尺俯瞰FreeMarker
簡單的說,FreeMarker就是一種用Java編寫的模板引擎,它根據模板輸出多種規格的文本。特別指出的是,FreeMarker與Web應用框架無關,它同樣可以應用在非Web應用程序環境中。
下面我們來看看FreeMarker的模板:(product.ftl)
<html>
<head>
<title>Welcome!</title>
</head>
<body>
<h1>Welcome ${user}!</h1>
<p>Our latest product:
<a href="${latestProduct.url}">${latestProduct.name}</a>!
</body>
</html>
這個例子是在簡單的HTML中加入了一些由${…}包圍的特定代碼,這些特定代碼就是FreeMarker的指令。
至於user、latestProduct.url和latestProduct.name的具體內容則來自於數據模型(data model)。數據模型由程序員編程來創建,向模板提供變化的信息,這些信息來自於數據庫、文件,甚至於在程序中直接生成。
模板設計者不關心數據從那兒來,只知道使用已經建立的數據模型。
藉助FMPP(FreeMarker PreProcessor)來運行FreeMarker
首先說明的是FreeMarker的運行並不依賴於FMPP。FMPP只是一個FreeMarker的輔助工具,有了它,我們可以快速地調試FreeMarker輸出結果,而不需要藉助Java編程,這可以大大地減輕美工設計人員的調試難度。你可以從:http://fmpp.sourceforge.net/ 得到它。
在使用Freemaker的時候,我們需要下載相關的程序:
freemarker: http://freemarker.sourceforge.net/
在磁盤上建立相關的文件夾:
D:/work/src/product.ftl D:/work/out/ D:/work/data/product.tdd D:/work/config.fmpp
我們使用的配置文件(config.fmpp)設置如下:
sourceRoot: src outputRoot: out logFile: log.fmpp modes: [ copy(common/**/*.*, resource/*.*) execute(*.ftl) ignore(templates/*.*, .project, **/*.xml, xml/*.*, *.js) ] replaceExtensions: [ftl, html] sourceEncoding: gb2312 data: tdd(../data/product.tdd)
注意:"data: tdd(../data/product.tdd)" 指定了模板的數據源,TDD是fmpp支持的數據格式之一 ,關於TDD介紹可參閱fmpp文檔,也可參看TDD。product.tdd內容是這樣的:
{ user: "Big Joe" latestProduct: {url: "products/greenmouse.html", name: "Green Mouse"} }
現在在dos下執行(假設FMPP安裝在D:/FMPP下):
D:/work/>D:/FMPP/bin/fmpp
最後的輸出結果是這樣的,存放在文件out/product.html中:
<html>
<head>
<title>Welcome!</title>
</head>
<body>
<h1>Welcome Big Joe!</h1>
<p>Our latest product:
<a href="products/greenmouse.html">green mouse</a>!
</body>
</html>
正如FreeMarker文檔中所敘述的,FreeMarker的工作原理就是:
模板+數據=輸出!
FreeMarker並不侷限於生成html,甚至可以產生java代碼,這僅僅取決於你如何設計模板而已。
現在有了FMPP這個強大工具,我們接下來可以快速學習FreeMarker的相關指令。let us go!