yjhmily

堅(jiān)持走自己的路……

:: 管理

100 Posts :: 8 Stories :: 353 Comments :: 0 Trackbacks

SiteMesh：一個(gè)優(yōu)于Apache Tiles的Web頁面布局、裝飾框架

一、SiteMesh項(xiàng)目簡介

????? OS(OpenSymphony)的SiteMesh是一個(gè)用來在JSP中實(shí)現(xiàn)頁面布局和裝飾（layout and decoration）
的框架組件，能夠幫助網(wǎng)站開發(fā)人員較容易實(shí)現(xiàn)頁面中動(dòng)態(tài)內(nèi)容和靜態(tài)裝飾外觀的分離。

??????Sitemesh是由一個(gè)基于Web頁面布局、裝飾以及與現(xiàn)存Web應(yīng)用整合的框架。它能幫助我們在由大
量頁面構(gòu)成的項(xiàng)目中創(chuàng)建一致的頁面布局和外觀，如一致的導(dǎo)航條，一致的banner，一致的版權(quán)，等等。
它不僅僅能處理動(dòng)態(tài)的內(nèi)容，如jsp，php，asp等產(chǎn)生的內(nèi)容，它也能處理靜態(tài)的內(nèi)容，如htm的內(nèi)容，
使得它的內(nèi)容也符合你的頁面結(jié)構(gòu)的要求。甚至于它能將HTML文件象include那樣將該文件作為一個(gè)面板
的形式嵌入到別的文件中去。所有的這些，都是GOF的Decorator模式的最生動(dòng)的實(shí)現(xiàn)。盡管它是由java語言來實(shí)現(xiàn)的，但它能與其他Web應(yīng)用很好地集成。

??????官方：http://www.opensymphony.com/sitemesh/

??????下載地址：http://www.opensymphony.com/sitemesh/download.action?目前的最新版本是Version 2.3；

二、為什么要使用SiteMesh?

????我們的團(tuán)隊(duì)開發(fā)J2EE應(yīng)用的時(shí)候，經(jīng)常會(huì)碰到一個(gè)比較頭疼的問題：

?????????由于Web頁面是由不同的人所開發(fā)，所以開發(fā)出來的界面通常是千奇百怪，通常讓項(xiàng)目管理人員苦笑不得。

?????而實(shí)際上，任何一個(gè)項(xiàng)目都會(huì)要求界面的統(tǒng)一風(fēng)格和美觀，既然風(fēng)格統(tǒng)一，那就說明UI層肯定有很多可以抽出來
共用的靜態(tài)或動(dòng)態(tài)部分；如何整合這些通用的靜態(tài)或動(dòng)態(tài)UI呢？Apache Tiles框架站了出來很好的解決了這一問題，
再加上他與struts的完美集成，導(dǎo)致大小項(xiàng)目都把他作為UI層的首選框架，

但是：

???Tiles確實(shí)有著它很多的不足之處,下文我會(huì)介紹,本文想說的是，除了Apache Tiles框架,其實(shí)我們還有更好的解
決方案，那就是:SiteMesh；

本文
???
???介紹了一個(gè)基于Web頁面的布局、裝飾以及應(yīng)用整合的框架Sitemesh，它能幫助你為你的應(yīng)用創(chuàng)建一致的外觀，
很好的取代Apache Tiles;

三、SiteMesh?VS Apache Tiles

?????用過struts的朋友應(yīng)該對Apache Tiles的不會(huì)陌生，我曾經(jīng)有一篇文章介紹過struts中tiles框架的組合與繼承，
現(xiàn)在怎么看怎么覺得復(fù)雜;
??????
??????從使用角度來看，Tiles似乎是Sitemesh標(biāo)簽<page:applyDecorator>的一個(gè)翻版。其實(shí)sitemesh最強(qiáng)的
一個(gè)特性是sitemesh將decorator模式用在過濾器上。任何需要被裝飾的頁面都不知道它要被誰裝飾，所以它就
可以用來裝璜來自php、asp、CGI等產(chǎn)生的頁面了。你可以定義若干個(gè)裝飾器，根據(jù)參數(shù)動(dòng)態(tài)地選擇裝飾器，
產(chǎn)生動(dòng)態(tài)的外觀以滿足你的需求。它也有一套功能強(qiáng)大的屬性體系，它能幫助你構(gòu)建功能強(qiáng)大而靈活的裝飾器。
相比較而言，在這方面Tiles就遜色許多。

??????個(gè)人覺得在團(tuán)隊(duì)開發(fā)里面，Apache Tiles框架會(huì)導(dǎo)致所有人不僅僅要了解并且清楚Apache Tiles的存在，
并且要特別熟悉每一個(gè)Tiles layout模板的作用，否則就可能出現(xiàn)用錯(cuò)模板的情況；除此之外，每個(gè)人涉及到
的所有WEB頁面都需要去配置文件里面逐個(gè)配置，不僅麻煩出錯(cuò)的幾率還高；
??? ? 而以上所有的不足都是SiteMesh所不存在的；

四、SiteMesh的基本原理

??????一個(gè)請求到服務(wù)器后，如果該請求需要sitemesh裝飾，服務(wù)器先解釋被請求的資源，然后根據(jù)配置文件
獲得用于該請求的裝飾器，最后用裝飾器裝飾被請求資源，將結(jié)果一同返回給客戶端瀏覽器。

五、如何使用SiteMesh

???這里以struts2+spring2+hibernate3構(gòu)架的系統(tǒng)為例
?????1、下載SiteMesh?
?????????下載地址：http://www.opensymphony.com/sitemesh/download.action?目前的最新版本是Version 2.3；
??????
???????2、在工程中引入SiteMesh的必要jar包，和struts2-sitemesh-plugin-2.0.8.jar；
??????
??????3、修改你的web.xml,在里面加入sitemesh的過濾器，示例代碼如下：
?????????

????<filter>

????????<filter-name>sitemesh</filter-name>

????????<filter-class>

????????????com.opensymphony.module.sitemesh.filter.PageFilter

????????</filter-class>

????</filter>

????<filter-mapping>

????????<filter-name>sitemesh</filter-name>

????????<url-pattern>/*</url-pattern>

????</filter-mapping>

?????

??? ??? 注意過濾器的位置：應(yīng)該在struts2的org.apache.struts2.dispatcher.FilterDispatcher過濾器之前org.apache.struts2.dispatcher.ActionContextCleanUp過濾器之后，否則會(huì)有問題；

??????4、在下載的SiteMesh包中找到sitemesh.xml，(\sitemesh-2.3\src\example-webapp\WEB-INF目錄下就有)

??? ??? 將其拷貝到/WEB-INF目錄下；

??????5、在sitemesh.xml文件中有一個(gè)property結(jié)點(diǎn)(如下)，該結(jié)點(diǎn)指定了decorators.xml在工程中的位置，讓sitemesh.xml能找到他;
按照此路徑新建decorators.xml文件，當(dāng)然這個(gè)路徑你可以任意改變，只要property結(jié)點(diǎn)的value值與其匹配就行；

<property?name="decorators-file"?value="/WEB-INF/sitemesh/decorators.xml"/>

????
???? 6、在WebRoot目錄下新建decorators目錄，并在該目錄下新建一個(gè)模板jsp，根據(jù)具體項(xiàng)目風(fēng)格編輯該模板，
如下示例：我的模板：main.jsp

<%@?page?language="java"?pageEncoding="UTF-8"%>
<%@taglib?prefix="decorator"
????uri="http://www.opensymphony.com/sitemesh/decorator"%>
<%@taglib?prefix="page"?uri="http://www.opensymphony.com/sitemesh/page"%>
<!DOCTYPE?html?PUBLIC?"-//W3C//DTD?XHTML?1.1?Transitional//EN"?
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%
????response.setHeader("Pragma",?"no-cache");
????response.setHeader("Cache-Control",?"no-cache");
????response.setDateHeader("Expires",?0);
%>
<html>
????<head>
????????<title><decorator:title?default="kangxm?test"?/>
????????</title>
????????
????????<decorator:head?/>
????</head>
????<body?id="page-home">
????????<div?id="page-total">
????????????<div?id="page-header">
????????????????<table?width="100%"?border="0"?cellspacing="0"?cellpadding="0">
????????????????????<tr>
????????????????????????<td>
????????????????????????????<div?class="topFunc">
????????????????????????????????我的賬戶
????????????????????????????????|
????????????????????????????????退出
????????????????????????????</div>
????????????????????????</td>
????????????????????</tr>
????????????????</table>
????????????</div>
????????</div>
????????
????????
????????<div?id="page-menu"?style="margin-top:?8px;?margin-bottom:?8px;">
????????????<div>
????????????????這里放菜單
????????????</div>
????????</div>
????????
????????<div?id="page-content"?class="clearfix">
????????????<center>
????????????????<table?width="100%"?border="0"?cellpadding="0"?cellspacing="0">
????????????????????<tr>
????????????????????????<td>
????????????????????????????<decorator:body?/>
????????????????????????</td>
????????????????????</tr>
????????????????</table>
????????????</center>
????????</div>
????????
????????<div?id="page-footer"?class="clearfix">

????????????這里放頁面底部
????????????
????????</div>
????????
????</body>
</html>

這就是個(gè)簡單的模板，頁面的頭和腳都由模板里的靜態(tài)HTML決定了，主頁面區(qū)域用的是<decorator:body />標(biāo)簽；
也就是說凡是能進(jìn)入過濾器的請求生成的頁面都會(huì)默認(rèn)加上模板上的頭和腳，然后頁面自身的內(nèi)容將自動(dòng)放到<decorator:body />標(biāo)簽所在位置；

<decorator:title?default="Welcome?to?test?sitemesh!"?/>：讀取被裝飾頁面的標(biāo)題，并給出了默認(rèn)標(biāo)題。
<decorator:head?/>：讀取被裝飾頁面的<head>中的內(nèi)容；
<decorator:body?/>：讀取被裝飾頁面的<body>中的內(nèi)容；

?????7、說到這里大家就要想了，那如果某個(gè)特殊的需求請求路徑在過濾器的范圍內(nèi)，但又不想使用模板怎么辦？
你總不能這么不講道理吧！
????????大家放心吧，SiteMesh早就考慮到這一點(diǎn)了，上面第5步說道的decorators.xml這個(gè)時(shí)候就起到作用了！
????????
下面是我的decorators.xml：

<?xml?version="1.0"?encoding="ISO-8859-1"?>

<decorators?defaultdir="/decorators">

????

????<excludes>

????????<pattern>/index.jsp*</pattern>
??????????<pattern>/login/*</pattern>

????</excludes>

????<decorator?name="main"?page="main.jsp">

????????<pattern>/*</pattern>

????</decorator>

</decorators>

decorators.xml有兩個(gè)主要的結(jié)點(diǎn)：
??????decorator結(jié)點(diǎn)指定了模板的位置和文件名，通過pattern來指定哪些路徑引用哪個(gè)模板
??????excludes結(jié)點(diǎn)則指定了哪些路徑的請求不使用任何模板

如上面代碼，/index.jsp和凡是以/login/開頭的請求路徑一律不使用模板；

另外還有一點(diǎn)要注意的是：decorators結(jié)點(diǎn)的defaultdir屬性指定了模板文件存放的目錄;

六、實(shí)戰(zhàn)感受

?????剛剛做完一個(gè)用到sitemesh的項(xiàng)目，跟以前用tiles框架相比，最大的感受就是簡單，系統(tǒng)設(shè)計(jì)階段
就把模板文件和sitemesh框架搭好了！哪些頁面使用框架哪些不使用，全部都通過UI Demo很快就定義出來了；
在接下來的開發(fā)中所有成員幾乎感受不到sitemesh的存在，各自僅僅關(guān)心自己的模塊功能實(shí)現(xiàn)；

七、總結(jié)

????使用sitemesh給我們帶來的是不僅僅是頁面結(jié)構(gòu)問題，它的出現(xiàn)讓我們有更多的時(shí)間去關(guān)注底層業(yè)務(wù)
邏輯，而不是整個(gè)頁面的風(fēng)格和結(jié)構(gòu)。它讓我們擺脫了大量用include方式復(fù)用頁面尷尬局面，也避免了tiles
框架在團(tuán)隊(duì)開發(fā)中的復(fù)雜度，它還提供了很大的靈活性以及給我們提供了整合異構(gòu)Web系統(tǒng)頁面的一種方案。

posted on 2007-09-28 15:34 kangxm 閱讀(9946) 評論(3) 編輯收藏所屬分類: J2EE

Feedback

# re: SiteMesh：一個(gè)優(yōu)于Apache Tiles的Web頁面布局、裝飾框架 2007-09-29 09:59 xplazy

不錯(cuò)。支持。希望能有更詳細(xì)的文檔說明。回復(fù) 更多評論

# re: SiteMesh：一個(gè)優(yōu)于Apache Tiles的Web頁面布局、裝飾框架 2008-06-10 11:18 王志猛

不存在是不可能的，呵呵，因?yàn)檫€有標(biāo)簽的啊。
sitemesh現(xiàn)在怎么不更新了？回復(fù) 更多評論

# re: SiteMesh：一個(gè)優(yōu)于Apache Tiles的Web頁面布局、裝飾框架[未登錄] 2009-12-31 16:06 FRANK

寫得很好，謝謝分享回復(fù) 更多評論

新用戶注冊刷新評論列表


只有注冊用戶登錄后才能發(fā)表評論。




網(wǎng)站導(dǎo)航: 博客園 IT新聞 Chat2DB C++博客博問管理
相關(guān)文章: 轉(zhuǎn)載：java編程中'為了性能'一些盡量做到的地方做個(gè)記錄-jasperReport中的Demo說明 SiteMesh：一個(gè)優(yōu)于Apache Tiles的Web頁面布局、裝飾框架 JAVA程序員不可不注意的編碼規(guī)范請教:新建一個(gè)Dynamic Web Project與新建一個(gè)MyEclipse里面的Web Project有什么區(qū)別? struts中tiles框架的組合與繼承我用struts標(biāo)簽的感受

yjhmily

留言簿(9)

隨筆分類(65)

隨筆檔案(60)

文章分類(12)

文章檔案(8)

看看朋友

經(jīng)常去的網(wǎng)站

搜索

積分與排名

最新隨筆

最新評論

閱讀排行榜

評論排行榜

Feedback