一個(gè)用于J2EE應(yīng)用程序的Backbase Ajax前端
動(dòng)態(tài)HTML技術(shù)已經(jīng)出現(xiàn)了多年。最近，Google的最新Web應(yīng)用程序GMail、Google Suggests和Google
Maps，在前端頁(yè)面中重新引入了基于標(biāo)準(zhǔn)的DHTML開(kāi)發(fā)模型。Google證明了，DHTML開(kāi)發(fā)模型能夠讓開(kāi)發(fā)人員創(chuàng)建具有可視化吸引力和高度交互
式的Rich Internet Application（豐富網(wǎng)絡(luò)應(yīng)用程序，RIA）。
Adaptive Path公司的Jesse James Garrett為這個(gè)基于標(biāo)準(zhǔn)的RIA開(kāi)發(fā)模型創(chuàng)造了術(shù)語(yǔ)Ajax (Asynchronous JavaScript + XML)。與傳統(tǒng)的基于頁(yè)面的Web應(yīng)用程序模型相比，Ajax有3點(diǎn)不同之處：
- 有一個(gè)客戶(hù)端引擎擔(dān)任用戶(hù)界面（UI）和服務(wù)器之間的中介。
- 用戶(hù)行為由客戶(hù)端引擎處理，而不是生成發(fā)往服務(wù)器的頁(yè)面請(qǐng)求。
- XML數(shù)據(jù)在客戶(hù)端引擎和服務(wù)器之間傳輸。
換言之，Ajax解決方案包括一個(gè)客戶(hù)端引擎，它用于呈現(xiàn)用戶(hù)界面，并使用XML格式與服務(wù)器通信。這個(gè)引擎由很多JavaScript函數(shù)組成，位于Web瀏覽器中，它不需要插件，也不需要用戶(hù)安裝。
基于Ajax的RIA正在迅速成為Web應(yīng)用程序前端的基準(zhǔn)，因?yàn)樗梢酝瑫r(shí)提供二者的優(yōu)點(diǎn)：豐富性和可達(dá)性。Ajax應(yīng)用程序和桌面應(yīng)用程序
一樣豐富，響應(yīng)高度靈敏，并且可以在一個(gè)頁(yè)面上提供所有數(shù)據(jù)，無(wú)需刷新頁(yè)面。它們還擁有基于標(biāo)準(zhǔn)的瀏覽器應(yīng)用程序的可達(dá)性特點(diǎn)，這類(lèi)應(yīng)用程序可以在不具備
瀏覽器插件或客戶(hù)端applet的情況下進(jìn)行部署。
Backbase所提供的Ajax軟件具有以下特點(diǎn)：基于標(biāo)準(zhǔn)、功能全面且易于使用。Backbase Presentation
Client (BPC)基于Ajax技術(shù)，它使用稱(chēng)為Backbase XML (BXML)的附加標(biāo)簽擴(kuò)展了DHTML。Backbase XML
Server Edition for J2EE
(BXS)包含了一些服務(wù)器端的組件，利用這些組件，J2EE開(kāi)發(fā)人員可以快速開(kāi)發(fā)J2EE應(yīng)用程序的Ajax前端。
在本文中，我使用Backbase為Java Pet Store開(kāi)發(fā)了一個(gè)基于Ajax的前端。該案例分析說(shuō)明了如何使用Backbase技術(shù)作為J2EE應(yīng)用程序的Ajax表示層。您可以查看文中所描述的應(yīng)用程序的在線(xiàn)演示，網(wǎng)址是http://www.backbase.com/xmlserver。
Backbase Ajax表示層
Web開(kāi)發(fā)人員應(yīng)該能夠輕松創(chuàng)建具有以下特點(diǎn)的Rich Internet Application
(RIA)：完全基于HTML標(biāo)準(zhǔn)（W3C），不需要最終用戶(hù)安裝插件，速度超快，能夠在所有瀏覽器上進(jìn)行操作，并與J2EE運(yùn)行時(shí)和開(kāi)發(fā)環(huán)境完全集成。
RIA利用客戶(hù)端（Web瀏覽器）資源創(chuàng)建和管理用戶(hù)界面，從而為最終用戶(hù)提供一個(gè)響應(yīng)靈敏而且具有應(yīng)用程序風(fēng)格的用戶(hù)界面。
這種方法最近被稱(chēng)為Ajax。Ajax這個(gè)術(shù)語(yǔ)的靈感來(lái)源于Gmail、Google Maps和Google
Suggests這類(lèi)應(yīng)用程序，它把現(xiàn)有的瀏覽器技術(shù)提高到了一個(gè)新的水平上。RIA從根本上改進(jìn)了在線(xiàn)應(yīng)用程序的可用性和有效性。Ajax
RIA只使用標(biāo)準(zhǔn)的瀏覽器技術(shù)（如JavaScript、XHTML和XMLHttpRequest對(duì)象）就做到了這一點(diǎn)。通過(guò)使用
XMLHttpRequest，在將數(shù)據(jù)異步加載到界面中時(shí)就無(wú)需刷新頁(yè)面。
Backbase在J2EE架構(gòu)中提供一個(gè)Ajax表示層，它結(jié)合了目前的J2EE服務(wù)器和先進(jìn)的富客戶(hù)端技術(shù)的優(yōu)點(diǎn)。Backbase表示層
控制了富用戶(hù)界面的每個(gè)方面：與最終用戶(hù)的交互模型，與后端系統(tǒng)的集成，以及整個(gè)客戶(hù)端-服務(wù)器通信。Backbase直接提供了用于聚合來(lái)自任意位置的
XML的下一個(gè)范型，將數(shù)據(jù)綁定到先進(jìn)的富用戶(hù)界面控件，并在一個(gè)統(tǒng)一的富用戶(hù)界面中交付組合應(yīng)用程序。
Backbase表示層由一個(gè)客戶(hù)機(jī)和一個(gè)服務(wù)器組成。Backbase Presentation Client
(BPC)是一個(gè)基于Ajax的GUI引擎，它允許開(kāi)發(fā)人員以聲明性的方式快速構(gòu)建RIA。Backbase
XML(BXML)是對(duì)XHTML的擴(kuò)展。它為開(kāi)發(fā)人員提供了交付富前端功能的附加標(biāo)簽(B tag)。Backbase XML Server
(BXS)提供一種XML流水線(xiàn)架構(gòu)，利用它可以從Web服務(wù)、數(shù)據(jù)庫(kù)或Java對(duì)象獲取數(shù)據(jù)，可以聚合和轉(zhuǎn)換這些數(shù)據(jù)，并將其綁定到BPC中的UI元
素。BPC和BXS相結(jié)合，可以在Web瀏覽器和應(yīng)用服務(wù)器之間搭建一座功能強(qiáng)大的橋梁，并提供一個(gè)分布在客戶(hù)端和服務(wù)器上的完整的富Internet表
示層。
圖1說(shuō)明了在邏輯和物理應(yīng)用程序架構(gòu)中，Backbase所處的位置。應(yīng)用程序由一個(gè)J2EE后端和一個(gè)基于Ajax的RIA前端組成。從邏輯
上說(shuō)，Backbase提供了表示層，而J2EE提供了業(yè)務(wù)邏輯和數(shù)據(jù)層。從物理上說(shuō)，表示層分布在客戶(hù)端和服務(wù)器上。在客戶(hù)端上，Backbase使用
BPC擴(kuò)展了瀏覽器。在服務(wù)器上，Backbase使用BXS擴(kuò)展了應(yīng)用服務(wù)器。
圖1. Backbase富Internet表示層
Pet Store案例分析
我們將使用Java Pet Store作為案例來(lái)分析如何為J2EE應(yīng)用程序添加Backbase RIA前端。Java Pet
Store Demo是Sun Microsystems提供的一個(gè)示例應(yīng)用程序，其目的是為了演示如何使用Java 2 Platform,
Enterprise Edition(J2EE)構(gòu)建Web應(yīng)用程序（詳情請(qǐng)參見(jiàn)http://java.sun.com/developer/releases/petstore）。
Java Pet Store是業(yè)內(nèi)一個(gè)著名的參考應(yīng)用程序（pet store還有.NET和Flash版本）。由于以下兩個(gè)原因，它成為為J2EE應(yīng)用程序添加基于Ajax的RIA前端的完美案例：
- Java Pet Store是一個(gè)完整的Web應(yīng)用程序。
Sun設(shè)計(jì)Pet Store的目的是演示所有常見(jiàn)的Web應(yīng)用程序功能。通過(guò)使用Pet Store作為案例，我可以說(shuō)明為J2EE應(yīng)用程序添加RIA層的所有方面。
作為一個(gè)典型的在線(xiàn)商店，它包含以下功能：
- 瀏覽產(chǎn)品類(lèi)別。
- 在購(gòu)物車(chē)中添加和刪除物品。
- 填寫(xiě)訂單表單。
- 提交訂單。
- Java Pet Store有一個(gè)傳統(tǒng)的HTML前端。
使用RIA前端的目的是提供更簡(jiǎn)單和響應(yīng)更靈敏的GUI，以及通常更為豐富的Web用戶(hù)體驗(yàn)。我將說(shuō)明，如何通過(guò)Backbase RIA技術(shù)極大地改進(jìn)應(yīng)用程序的前端，同時(shí)無(wú)需對(duì)后端和總體系統(tǒng)需求做任何修改。
Pet Store的RIA前端將通過(guò)以下方式改善可用性：
- 把前端變?yōu)橐粋€(gè)單頁(yè)面的界面（SPI）。
- 提供更先進(jìn)的UI控件（如模態(tài)彈出式菜單）。
- 使用可視化效果（例如，把寵物放入購(gòu)物車(chē)）。
- 更加有效地利用電腦屏幕的操作區(qū)域。
RIA Pet Store前端
在這一節(jié)中，我將討論經(jīng)過(guò)改進(jìn)的新Pet Store RIA前端。
下面的兩個(gè)屏幕快照演示了前端的改進(jìn)。要獲得對(duì)Backbase RIA前端更直觀的感受，請(qǐng)?jiān)L問(wèn)http://www.backbase.com/xmlserver上的在線(xiàn)演示，或者到http://www.backbase.com/download下載Backbase社區(qū)版本。
下面兩個(gè)圖對(duì)兩個(gè)前端進(jìn)行了可視化的比較。圖2顯示的是原來(lái)靜態(tài)的多頁(yè)面HTML前端。圖3顯示的是新的Backbase SPI前端：
圖2. 原始HTML前端
圖3. 新Backbase前端
Backbase為創(chuàng)建豐富的單頁(yè)面Web界面提供了許多可能性。下面列出了一些Pet Store所使用的例子。
- 選項(xiàng)卡式的單頁(yè)面瀏覽
在Web界面上，不同的動(dòng)物種類(lèi)（狗、貓等等）被表示為不同的選項(xiàng)卡。點(diǎn)擊一個(gè)選項(xiàng)卡就會(huì)打開(kāi)相應(yīng)的類(lèi)別，顯示可供出售的寵物。
在Backbase SPI中，無(wú)需刷新頁(yè)面就可以打開(kāi)選項(xiàng)卡。BPC只從服務(wù)器請(qǐng)求所需的數(shù)據(jù)，然后更新客戶(hù)端的視圖。SPI機(jī)制可以極大地縮短響應(yīng)時(shí)間，讓客戶(hù)隨心所欲地在類(lèi)別之間來(lái)回穿梭。
- 活動(dòng)的多功能界面
界面有三個(gè)主要功能——類(lèi)別瀏覽、購(gòu)物車(chē)和頁(yè)面引導(dǎo)歷史記錄，它們?cè)诮缑嫔隙际且恢笨梢?jiàn)的。因此，購(gòu)物者總是能夠查看購(gòu)物車(chē)的當(dāng)前內(nèi)容或最近看過(guò)的寵物的記錄。
這些功能是高度同步的：瀏覽一個(gè)寵物時(shí)，歷史記錄將自動(dòng)更新為在記錄中顯示該寵物。定購(gòu)一個(gè)寵物時(shí)，它將被添加到購(gòu)物車(chē)中。上述一切都發(fā)生在客戶(hù)端的一個(gè)頁(yè)面上（例如，無(wú)需重新加載頁(yè)面就可以更新界面的各個(gè)部分）。
- 界面變化的流暢可視化效果
進(jìn)行瀏覽時(shí)，客戶(hù)將會(huì)看到不斷變化的界面視圖。例如，他可以按照價(jià)格和名稱(chēng)對(duì)寵物進(jìn)行排序。界面需要根據(jù)新的排列順序顯示更新以后的寵物清單。
在Backbase RIA前端中，以前的視圖被使用可視化效果的新視圖所代替，新視圖向最終用戶(hù)顯示什么正在改變。圖4說(shuō)明了如何通過(guò)流暢的定位效果，把按名稱(chēng)排列的順序轉(zhuǎn)變?yōu)榘磧r(jià)格排列的順序：
圖4.類(lèi)別視圖的排列順序轉(zhuǎn)換
- 用于提高轉(zhuǎn)換速度的信息欄驗(yàn)證
為了執(zhí)行購(gòu)買(mǎi)，購(gòu)買(mǎi)者必須在一份表單中填入個(gè)人詳細(xì)信息。Backbase極大地簡(jiǎn)化了這個(gè)購(gòu)買(mǎi)過(guò)程，通過(guò)客戶(hù)端的信息欄驗(yàn)證提供即時(shí)的反饋，并在提供所有數(shù)據(jù)的過(guò)程中提供逐步的指南和概述。
圖5顯示了在填寫(xiě)表單的第一個(gè)步驟中，對(duì)于e-mail地址信息欄的驗(yàn)證。當(dāng)購(gòu)買(mǎi)者填寫(xiě)下一欄時(shí)，就會(huì)提供即時(shí)的反饋。
圖5. 信息欄驗(yàn)證—e-mail欄
Backbase RIA Pet Store的架構(gòu)
增強(qiáng)Pet Store（或其他任何Web應(yīng)用程序）的前端時(shí)，我們將繼續(xù)依賴(lài)于以下兩條架構(gòu)基本原則：
- 最終用戶(hù)仍然使用標(biāo)準(zhǔn)的Web瀏覽器訪(fǎng)問(wèn)Pet Store，無(wú)需添加任何插件。
- 由J2EE業(yè)務(wù)邏輯和數(shù)據(jù)組成的整個(gè)后端保持不變。
現(xiàn)有的后端在開(kāi)發(fā)期間是完全孤立的，而且不會(huì)改變，這個(gè)事實(shí)對(duì)于架構(gòu)師和IT管理人員十分有利。通過(guò)一個(gè)規(guī)整的、模塊化的架構(gòu)，他們將能夠控制風(fēng)險(xiǎn)和成本，同時(shí)顯著提高Web應(yīng)用程序的用戶(hù)友好性。
Backbase的富表示層技術(shù)由兩個(gè)模塊組成，它們將被加入到架構(gòu)中。在客戶(hù)端，BPC管理著SPI，并通過(guò)異步響應(yīng)事件來(lái)處理與最終用戶(hù)之
間的交互。在服務(wù)器端，Backbase XML
Server這個(gè)靈活的XML管道可以連接到任意服務(wù)器端的數(shù)據(jù)源，包括Web服務(wù)、文件、數(shù)據(jù)庫(kù)或本地Java對(duì)象。圖6說(shuō)明了BPC和BXS如何共同
為RIA提供一個(gè)聲明式的、基于XML的端到端表示層。
圖6. 聲明式的端到端表示層
Backbase表示客戶(hù)端
BPC是一個(gè)基于Ajax的GUI引擎，它運(yùn)行在標(biāo)準(zhǔn)的Web瀏覽器中。運(yùn)行時(shí)，BPC被加載到瀏覽器中，然后它會(huì)接收BXML代碼，構(gòu)造對(duì)應(yīng)的B樹(shù)，并不斷地把這種表示轉(zhuǎn)換為瀏覽器所呈現(xiàn)的DOM樹(shù)。圖7說(shuō)明了運(yùn)行時(shí)轉(zhuǎn)換過(guò)程。
圖7. BPC運(yùn)行時(shí)
Backbase XML
Backbase XML (BXML)是XHTML的擴(kuò)展。開(kāi)發(fā)人員通過(guò)創(chuàng)建BXML應(yīng)用程序來(lái)開(kāi)發(fā)富前端，包括BXML標(biāo)簽、標(biāo)準(zhǔn)的XHTML和CSS。BXML是一種聲明性語(yǔ)言，它包含了XHTML中所沒(méi)有的標(biāo)簽（B標(biāo)簽）
BXML包含用于下列用途的標(biāo)簽：
- 定義屏幕分區(qū)(<b:panel>)
- 交互式客戶(hù)端控制(<b:menu>)
- 處理標(biāo)準(zhǔn)的用戶(hù)交互事件(onClick)
- 處理高級(jí)的用戶(hù)交互事件(拖放和調(diào)整大小)
- 管理客戶(hù)端狀態(tài)
- 處理可視化效果(使修改任意CSS屬性的過(guò)程動(dòng)畫(huà)化)
- 數(shù)據(jù)綁定
- 使用XSLT的一個(gè)子集進(jìn)行客戶(hù)端轉(zhuǎn)換
用于J2EE的Backbase XML Server
Backbase XML Server (BXS)是一個(gè)服務(wù)器端的引擎，用于把BPC鏈接到任意J2EE后端。和BPC一樣，BXS是完全基于XML的，其編程是聲明性的。它使用一種XML管道架構(gòu)，提供功能強(qiáng)大的服務(wù)器端轉(zhuǎn)換和聚合。
BXS附帶一些用于訪(fǎng)問(wèn)最常用的數(shù)據(jù)源（包括Web服務(wù)、數(shù)據(jù)庫(kù)、文件系統(tǒng)和本地Java對(duì)象）的開(kāi)箱即用任務(wù)。我們使用Backbase標(biāo)簽對(duì)從這些源獲得的數(shù)據(jù)進(jìn)行聚合，然后使用XSLT進(jìn)行轉(zhuǎn)換。結(jié)果以無(wú)格式XML數(shù)據(jù)或BXML表示代碼的形式返回給BPC。
BXS還提供一些應(yīng)用服務(wù)，包括身份驗(yàn)證、授權(quán)、日志記錄和用戶(hù)跟蹤。圖8顯示了BXS的總體架構(gòu)。
圖8. BXS架構(gòu)
Eclipse開(kāi)發(fā)工具
為了讓J2EE開(kāi)發(fā)人員可以只使用一種開(kāi)發(fā)工具就能創(chuàng)建完整的Web應(yīng)用程序，包括富前端，Backbase提供了一個(gè)Eclipse插件。如圖9所示，該插件提供了在Eclipse中突出顯示語(yǔ)法和Backbase標(biāo)簽代碼自動(dòng)完成的功能。
圖9. Backbase Eclipse插件
注意：Eclipse的可視化拖放開(kāi)發(fā)插件還處在開(kāi)發(fā)階段。
部署到BEA WebLogic
BXS是一個(gè)與標(biāo)準(zhǔn)兼容的J2EE應(yīng)用程序，可以將其部署到任何J2EE應(yīng)用服務(wù)器上。圖10顯示了如何使用WebLogic控制臺(tái)把BXS部署到BEA WebLogic Server。
圖10. 把BXS部署到BEA WebLogic
實(shí)現(xiàn)Backbase RIA Pet Store
下面的順序圖包括更多詳細(xì)信息，可以幫助您更好地理解如何實(shí)現(xiàn)Backbase pet store。該順序圖顯示了在應(yīng)用程序的初始化加載期間BPC與BXS之間的交互，如圖11所示，它包括以下4個(gè)步驟：
- 初始化：用戶(hù)在瀏覽器中輸入寵物商店的URL；對(duì)BPC進(jìn)行初始化。
- 應(yīng)用程序布局：觸發(fā)正在構(gòu)造的事件；BPC構(gòu)建整體應(yīng)用程序布局；寵物類(lèi)別被加載并顯示在選項(xiàng)卡中。
- 默認(rèn)數(shù)據(jù)：默認(rèn)情況下加載狗的類(lèi)別；最初顯示8張狗的圖片，并帶有向前/向后和排序功能。
用戶(hù)交互：用戶(hù)點(diǎn)擊Next按鈕便可顯示編號(hào)從9到16的狗圖片。
圖11.順序圖：富商店前端
- 初始化
從用戶(hù)在瀏覽器中輸入寵物商店的URL開(kāi)始，這將導(dǎo)致從Web服務(wù)器請(qǐng)求一個(gè)索引頁(yè)面。
索引頁(yè)面包含用于實(shí)例化BPC的代碼。索引頁(yè)面是XHTML和BXML標(biāo)簽的結(jié)合，包含負(fù)責(zé)啟動(dòng)富前端的初始化事件處理程序。
BPC初始化代碼：
<...><body onload="bpc.boot('/Backbase/')">
<...>
<xmp b:backbase="true"
style="display:none;height:100%;">
<s:loading>
<div style="position:absolute;width:20%;
top: 50px;left: 35%;">
<center>Please wait while loading...
</center>
</div>
</s:loading>
<...>
<!-- Include petshop specific behaviors -->
<s:include b:url="petshop.xml"/>
應(yīng)用程序布局加載頁(yè)面之后，BPC就會(huì)處理正在構(gòu)造的事件，以便開(kāi)始構(gòu)建總體的應(yīng)用程序布局。
應(yīng)用程序布局由幾個(gè)面板組成，它們將屏幕劃分為幾個(gè)部分。頂行有一個(gè)固定高度的寵物商店徽標(biāo)，接下來(lái)的主行是實(shí)際的商店，大小可以調(diào)整。主行分為兩列，左邊一列是產(chǎn)品類(lèi)別，右邊一列是購(gòu)物車(chē)和歷史記錄。
產(chǎn)品類(lèi)別使用選項(xiàng)卡式的導(dǎo)航，每個(gè)寵物類(lèi)別一個(gè)選項(xiàng)卡。這些選項(xiàng)卡是動(dòng)態(tài)構(gòu)造的，具體過(guò)程是通過(guò)BXS從一個(gè)XML文件加載類(lèi)別，然后通過(guò)一個(gè)客戶(hù)端模板把這些類(lèi)別轉(zhuǎn)換為選項(xiàng)卡，該轉(zhuǎn)換模板的BPC代碼如下：
<s:task b:action="transform"
b:stylesheet="b:xml('categories')"
b:xmldatasource="b:url('categories.xml')"
b:destination="id('main-content')"
b:mode="aslastchild" />
下面是用于從文件系統(tǒng)把類(lèi)別加載為XML的BXS代碼：
<bsd:pipeline equals="categories.xml"
access="public">
<bsd:readxml input="file:/categories.xml"/>
</bsd:pipeline>
下面是用于創(chuàng)建選項(xiàng)卡式導(dǎo)航的BPC客戶(hù)端模板：
<b:tabrow>
<s:for-each b:select="categories/category">
<b:tab>
<s:attribute b:name="b:followstate">
id('<s:value-of b:select="name"/>')
</s:attribute>
<s:value-of b:select="name"/>
</b:tab>
</s:for-each>
</b:tabrow>
所有BPC代碼（用藍(lán)色表示）都在客戶(hù)端執(zhí)行，而所有BXS代碼（用紅色表示）都在服務(wù)器端執(zhí)行。注意，在本例中，我選擇了在客戶(hù)端進(jìn)行轉(zhuǎn)換，因?yàn)?
數(shù)據(jù)集很小。下面我會(huì)給出一個(gè)在服務(wù)器端轉(zhuǎn)換的例子。兩種轉(zhuǎn)換都要用到XSLT語(yǔ)法。Backbase的一個(gè)強(qiáng)大功能就是，前端開(kāi)發(fā)人員可以根據(jù)情況選擇
在客戶(hù)端還是服務(wù)器端處理表示邏輯。語(yǔ)法似乎允許輕松地把代碼從客戶(hù)端移到服務(wù)器端，或者反之。
以上的代碼示例應(yīng)該可以使您了解到，借助于Backbase，Ajax編程變得多么輕松。結(jié)合了DHTML的聲明性方法則更容易上手。使用附加的B
標(biāo)簽不僅可以使界面更加豐富，而且可以使開(kāi)發(fā)人員的效率更高。諸如<b:tab>之類(lèi)的單個(gè)標(biāo)簽可以代替多行HTML和JavaScript
代碼，而且保證可以用于各種瀏覽器。
默認(rèn)數(shù)據(jù)顯示商店前端時(shí)，默認(rèn)情況下顯示的是狗的類(lèi)別。對(duì)于本案例，BXS負(fù)責(zé)此項(xiàng)操作。BXS從一個(gè)Web服務(wù)獲得數(shù)據(jù)，將其放入緩存，然后生成BXML
表示代碼，再把這些表示代碼發(fā)回給BPC。服務(wù)器還通過(guò)一項(xiàng)配置設(shè)置確定一個(gè)頁(yè)面上可以顯示的動(dòng)物數(shù)量，并根據(jù)需要加入了Next和Previous按
鈕。最后，服務(wù)器還提供了按照名稱(chēng)或價(jià)格進(jìn)行排序的功能。
下面的代碼片斷演示了服務(wù)器功能。外部管道products-overview.xml首先調(diào)用catalog.xml子管道。該子管道要么返回緩
存中的寵物信息，要么調(diào)用另一個(gè)子管道catalog.ws。在緩存沒(méi)有命中的情況下，內(nèi)部管道catalog.ws會(huì)從Web服務(wù)獲取寵物信息。
外部管道獲得寵物信息，然后進(jìn)行XSLT轉(zhuǎn)換，從而以4x2表格顯示這些信息，并帶有Next和Previouse按鈕，然后把BXML格式的代碼發(fā)回給BPC。BPC呈現(xiàn)它接收到的BXML。
有3個(gè)嵌套的BXS管道分別用于從Web服務(wù)獲取數(shù)據(jù)、將其放入緩存，以及通過(guò)XSLT轉(zhuǎn)換創(chuàng)建BXML輸出：
<bsd:pipeline equals="products-overview.xml"
access="public"/>
<bsd:callpipe pipe="catalog.xml"/>
<bsd:pipeline equals="catalog.xml" access="private">
<bsd:exist field="{global:petstore-catalog}">
<bsd:readxml>{global:petstore-catalog}
</bsd:readxml>
<bsd:otherwise>
<bsd:callpipe pipe="catalog.ws"/>
<bsd:pipeline equals="catalog.ws"
access="private">
<bsd:try>
<bsd:callws wsdl="PetstoreCatalog.wsdl"
method="getAll"/>
<bsd:callpipe pipe="strip-root-ns"/>
<bsd:catch>
<bsd:xslt xslt="error.xslt">
<bsd:param name="errormsg">{error:message}
</bsd:param>
<bsd:param name="errorsrc">{error:source}
</bsd:param>
</bsd:xslt>
</bsd:catch>
</bsd:try>
</bsd:pipeline>
<bsd:writexml>{global:petstore-catalog}
</bsd:writexml>
</bsd:otherwise>
</bsd:exist>
</bsd:pipeline>
<bsd:extractfilter xpath=
"category[name/text()='{requestparam:category}']"/>
<bsd:xslt xslt="products/products-overview.xslt">
<bsd:param name="category">
{requestparam:category}
</bsd:param>
<bsd:param name="stepsize">
{global:stepsize}
</bsd:param>
<bsd:param name="sortorder">
{requestparam:sortorder}
</bsd:param>
<bsd:param name="sortfield">
{requestparam:sortfield}
</bsd:param>
</bsd:xslt>
</bsd:pipeline>
代碼示例再次清楚地說(shuō)明了，借助于Backbase，以聲明性的方式創(chuàng)建Ajax前端是多么容易的事情。例如，只要使用帶有一個(gè)WSDL引用作為屬性的<bsd:callws>標(biāo)簽，就可以調(diào)用一個(gè)Web服務(wù)。
用戶(hù)交互現(xiàn)在，最終用戶(hù)可以與寵物商店類(lèi)別進(jìn)行交互。可以使用Next或Previous按鈕或者排序功能在動(dòng)物類(lèi)別中進(jìn)行瀏覽。或者，只要點(diǎn)擊一下相應(yīng)的選項(xiàng)卡，就可以轉(zhuǎn)到另一個(gè)類(lèi)別中。
BPC和BXS對(duì)這種交互進(jìn)行了無(wú)縫處理。顯示已經(jīng)在客戶(hù)端上的數(shù)據(jù)時(shí)，無(wú)需與服務(wù)器進(jìn)行任何通信。例如，購(gòu)物者已經(jīng)從狗類(lèi)別轉(zhuǎn)到了貓類(lèi)別，然后再
回到狗類(lèi)別。客戶(hù)端仍然擁有狗類(lèi)別的數(shù)據(jù)，所以可以馬上顯示出來(lái)，這使得購(gòu)物體驗(yàn)變得更完美。其他的類(lèi)別需要從BXS獲取。BXS要么立即從其緩存返回它
們，要們?cè)L問(wèn)Web服務(wù)來(lái)獲得新數(shù)據(jù)。
為了詳細(xì)說(shuō)明Backbase Ajax寵物商店的實(shí)現(xiàn)，我把重點(diǎn)放在了初始化的步驟上。完整的寵物商店（可以從http://www.backbase.com/xmlserver下載）還包括以下功能：
- 商店前端
- 初始化。
- 使用從文件加載的寵物類(lèi)別創(chuàng)建選項(xiàng)卡。
- 默認(rèn)情況下從Web服務(wù)加載Dog選項(xiàng)卡。
- 通過(guò)緩存瀏覽Dog并對(duì)其進(jìn)行排序。
- 寵物詳細(xì)情況
- 使用跟蹤聚合來(lái)自緩存和數(shù)據(jù)庫(kù)的寵物詳細(xì)情況。
- 創(chuàng)建可視化歷史記錄。
- 購(gòu)物車(chē)
- 登錄
- 退出
結(jié)束語(yǔ)
最近有很多人都在研究Ajax。Ajax的優(yōu)點(diǎn)已經(jīng)在實(shí)踐中得到了證明。定制Ajax的缺點(diǎn)在于它的復(fù)雜性和不兼容性。大量客戶(hù)端
JavaScript的出現(xiàn)意味著開(kāi)發(fā)人員很可能陷入到瀏覽器實(shí)現(xiàn)差別的泥潭中去。另外，JavaScript這種語(yǔ)言不適用于復(fù)雜的應(yīng)用程序。
為了開(kāi)發(fā)易于管理的、可伸縮的和適應(yīng)未來(lái)變化的Ajax解決方案，開(kāi)發(fā)人員所需使用的工具應(yīng)該具有比定制部件開(kāi)發(fā)更多的功能。Backbase
Ajax軟件提供了一個(gè)功能全面的客戶(hù)端GUI管理引擎(Backbase Presentation
Client)、一個(gè)靈活的服務(wù)器端XML管道(Backbase XML
Server)和一種聲明性的基于標(biāo)簽的UI語(yǔ)言，BXML(Backbase eXtensible Markup
Language)。該方法具有幾個(gè)優(yōu)點(diǎn)。
首先，Backbae易于使用。它的聲明性語(yǔ)言水平地?cái)U(kuò)展了DHTML；它完全對(duì)開(kāi)發(fā)人員隱藏了瀏覽器兼容性的問(wèn)題；而且它帶有一套開(kāi)發(fā)和調(diào)試工具。
其次，Backbase是一個(gè)功能全面的Ajax
GUI管理系統(tǒng)。Backbase的先進(jìn)性大大超過(guò)了其他Ajax框架，它完全把重點(diǎn)放在提供一個(gè)部件庫(kù)或客戶(hù)端－服務(wù)器通信（如DWR）上。在控件和客
戶(hù)端－服務(wù)器通信的基礎(chǔ)上，Backbase提供了用于如下用途的標(biāo)簽：提供電影效果，隨需應(yīng)變的數(shù)據(jù)加載，數(shù)據(jù)綁定和客戶(hù)端的數(shù)據(jù)轉(zhuǎn)換，對(duì)于Back和
Forward按鈕的支持，完善的GUI狀態(tài)管理，等等。所有這些功能對(duì)于目前的Ajax Web應(yīng)用程序來(lái)說(shuō)都是必需的。
最后，Backbase是以兼容的方式提供所有客戶(hù)端和服務(wù)器端的功能。用戶(hù)可以使用富Ajax前端擴(kuò)展現(xiàn)有的應(yīng)用程序，同時(shí)無(wú)需修改后端。對(duì)于整個(gè)表示層來(lái)說(shuō)，它的架構(gòu)是時(shí)新的、模塊化的，而且它基于XML。
參考資料
原文出處
A Backbase Ajax Front-end for J2EE Applications
http://dev2dev.bea.com/pub/a/2005/08/backbase_ajax.html
| 作者簡(jiǎn)介 |
| Mark Schiefelbein自2005年2月以來(lái)一直擔(dān)任Backbase的產(chǎn)品管理主管。Mark極大地推動(dòng)了Backbase Rich Internet Application的全球推廣。 |