就在不久前，開發人員若想實現AJAX的特性，需要直接和XMLHTTPRequest對象打交道，或者使用某些初級的函數庫來完成2005年6月，筆者在DevX上發表第一篇介紹AJAX的文章AJAX: A Fresh Look at Web Development》，那時AJAX技術還在萌芽期。如今，很多免費的AJAX框架為開發人員提供了解決各種復雜任務的諸多特性本文介紹了以下幾種常見的非商業性AJAX框架在呼叫中心開發案例中的應用Prototype Dojo Direct Web Remoting (DWR) Yahoo! User Interface (YUI) Toolkit Google Web Toolkit (GWT)  文中闡述了筆者的個人觀點并且介紹了每個框架可以為開發人員提供哪些功能   一、測試案例為客戶提供服務的應用系統通常以富客戶端或者嵌入瀏覽器可執行程序等方式實現?？蛻糁С窒到y要求程序對客戶的請求作出即時反應以及迅速實現各種查詢。這些需求使得典型的非動態應用的解決方案不能令人滿意，本文的測試應用案例是簡化的呼叫中心程序，可為客戶提供即時的呼叫服務。為了實現對于呼叫人及其賬戶信息的即時訪問，呼叫中心應用需要將企業和賬戶管理系統（基于web的模擬器）集成，從而使得應用具有挑戰性和趣味性。以下是本應用案例的開發和測試環境。開發環境： Eclipse IDE, Visual Web Developer 2005 Express Edition (for Web design) and PSPad 服務器端平臺：, Apache Tomcat 5.5 Servlet/JSP Container 測試用瀏覽器：Firefox 1.5 and Internet Explorer (IE) 6, and IE 呼叫中心應用的界面包含兩個子面板（如圖：左側，顯示需應答的呼叫客戶列表：右側，顯示動態生成的選定客戶的詳細信息。客戶服務人員選取待應答客戶時，賬戶管理系統在右側面板動態產生此用戶的詳細信息。
http://image.it168.com/cms/2007-4-24/Image/2007424105020.JPG圖1

二、Prototype's JavaScript 特性

Prototype 是最受歡迎的AJAX框架之一。Ajaxian.com網站2006年的調查結果顯示，Prototype同框架規模龐大的Yahoo! User Interface, Google Web Toolkit, and Atlas.等相比較起來，其排名竟然遙遙領先，這不能不令人感到驚異。
答案很簡單：Prototype使用起來就像是對于JavaScript語言的自然擴展。嘗試過Prototype框架后，筆者幾乎堅信Prototype框架應該被納入JavaScript語言。
對于我們的案例，緊湊、強大并且設計合理的Prototype框架再合適不過了。通過Ajax.Request對象建立兩個指向服務器端資源（PBX和賬戶查詢）的并發調用，完成了第一個挑戰——資源整合。Ajax.Request對象是對于XMLHTTPRequest對象的跨瀏覽器抽象，可向服務器端發送普通請求或者異步請求。當調用請求結束時，Ajax.Request對象把回調函數的名字作為參數返回。
因此，通過以下兩個連續的調用實現了指向PBX系統兩次請求：
function getInfo()
    {
      //load params from form
        var callerNum = $F('callerNum');
        var url = 'http://<server>/ServiceProvider/pbxService';
        var pars = 'callerNum=' + callerNum;

        //asynchronous calls are used as default

    var response = new Ajax.Request( url, { method: 'get', parameters: pars
    onComplete: showPBXResponse });

    var callerName = response.responseText ;
        var url = 'http://<server>/ServiceProvider/acctService';
        var pars = 'callerName=' + callerName;

    var acctResponse = new Ajax.Request( url, { method: 'get',parameters: pars
    onComplete: showAcctResponse });

    }

    //callback functions

    function showPBXResponse(requestResults)
    {
        //show returned value in the PBX area
        $('pbxResult').value = requestResults.responseText ;
    }

    function showAcctResponse(requestResults)
    ...



開發案例的其它部分由傳統的JavaScript完成。對于頁面元素渲染效果的定制，Prototype框架并不提供太多的支持。這部分處理成常規的基于XHTML/CSS界面設計的事件驅動模式的補充。
三、Dojo ——神奇的界面工具集世界

Dojo是一種頗受歡迎的開源框架，對于web界面工具集和web開發中與后端系統間交互等諸多重要方面提供廣泛的支持。在各種工具中，有些可直接用來渲染呼叫用戶列表（Dojo使用手冊中這部分的文檔不完整），其它像多選列表項的異步調用等則需要作進一步定制工作。
Dojo界面工具的定制需要深入了解Dojo的底層。Dojo的定制機制非常靈活，通曉javascript語言并且對于Dojo框架的細節了如指掌。定制的可能性是無限的。
對于多個后端異步調用的實現，采用了dojo.io.bind對象。Bind對象可實現對后端資源的調用并將結果返回給回調對象。下面的代碼完成了針對PBX交換系統的調用。
var getURL = 'http://<server>/ServiceProvider/acctService?callerName=' +
callerName;
dojo.io.bind({
    url: getURL, /* URL to be called */
    load: function(type, data, evt){
    /* normal callback code here
     */ },
    error: function(type, error){
    /* error handling callback defined here
    */ },
    mimetype: "text/plain"
});



Dojo的類和擴展模型相當復雜，而Bind對象和回調對象的模型則更容易理解和使用，性能也不錯。
四、DWR — 令人激動的服務器端集成

DWR (Direct Web Remoting) 同上述的框架性質上完全不同。DWR的重點是瀏覽器/服務器的交互。DWR框架的大部分API函數也是針對這種交互的。DWR是基于java的框架，最適用于后端運行java應用的情況。
因為這些特性，DWR為開發呼叫中心應用提供了一種有趣的途徑。這種方法不再使用AJAX控制從服務器返回的文本信息，而是使用javascript調用DWR框架的遠程異步對象。實現起來很簡單：通過在瀏覽器端的JavaScript構造和調用PBX和相關JAVA對象。這樣就通過優雅而簡潔的方式完成了客戶端和服務器端的集成。
在Java代碼里，定義了PBXService對象，用來根據呼叫用戶代碼從PBX獲取用戶詳細信息。

public class PBXService ...{
public String getCallerName(int callerNumber)...{
...
    }
}

在html代碼里，嵌入了使用PBXService對象和DWR引擎的JavaScript 方法。

<script type="text/javascript"
    src="ServiceProvider/dwr/interface/PBXService.js"> </script>
<script type="text/javascript"
    src="ServiceProvider/dwr/engine.js"> </script>
...

從JavaScript調用PBXService的方法如下：
PBXService.getCallerName(18003456700, processPBXResponse);
自定義的JavaScript方法processPBXResponse用來處理PBXService.getCallerName 方法的返回結果
盡管不如Dojo的框架復雜精細，也不如Prototype與JavaScript的集成度高，DWR卻提供了頗具吸引力的與服務端的集成方式。在與服務器端Java應用的集成方面，DWR做得最好。
五、Yahoo UI (YUI) Toolkit ——爭做第一流的框架

YUI 是一種性能穩定的、功能豐富多彩、文檔完善的AJAX開發框架。在測試的幾個框架中，YUI框架最具專業水準的感覺。
完整的呼叫中心應用由Yahoo工具集實現起來相當容易。列表和面板等展示層對象采用YUI的面板和對話框組件實現。對于后端PBX和賬戶查詢系統的異步調用采用Yahoo ConnectorManager（連接管理器）和回調API函數實現。具體用法如下：
var pbxURL = [url=http://</]http://<[/url];server>/ServiceProvider/acctService?callerName=' + callerName;
PbxCallback是JavaScript對象，定義如下：

var requestFromPBX = YAHOO.util.Connect.asyncRequest('GET', pbxUrl, pbxCallback);
var callback = {     
    success:handleSuccess,      
    failure: handleFailure
    argument: { callerName: "N/A" }
};

HandleSuccess 是常規的JavaScript函數，用來讀取PBX服務器返回的結果。并發出以PBX系統返回的呼叫用戶名為參數的對于賬戶查詢系統的調用。

var pbxURL = [url=http://</]http://<[/url];server>/ServiceProvider/acctService?callerName=' + callerName;
var requestFromAcct = YAHOO.util.Connect.asyncRequest('GET', acctURL, acctCallback);

讀者可能會提出疑問，框架提供任務如此之多的特性，是否存在爭議之處？確實如此。YUI是一套特定品牌API的框架，隨處可見其商業公司的烙印。其設計和實現由Yahoo的一個項目組專門維護。同時也用來開發Yahoo公司的門戶產品。雖然框架本身是免費的，卻會在多處用戶的應用代碼中表明Yahoo產品的痕跡。（如圖2）對于習慣于使用開源框架的開發人員這可能是個問題。

[align=center][size=2][color=black][img]http://image.it168.com/cms/2007-4-24/Image/200742411155.jpg[/img][/color][/size][/align][align=center][size=2][color=black]圖2  [/color][/size][/align][color=black][align=left][size=2][color=black]一般來說，[/color][color=black]YUI[/color][color=black]工具箱簡單、易用。[/color][color=black]YUI[/color][color=black]和其它框架比較起來要龐大得多，然而對框架比較熟悉后，用它開發基本上就是一個組裝的過程：在界面上布置各種組件，然后使其協同運行?？傮w看來，這是個不錯的框架。[/color][/size][/align][/color]
六、Google Web Toolkit— 完全Java化

GWT的開發理念同其它幾個框架完全不同。GWT是完全基于Java的開發框架，所有的Web組件采用Java編寫，然后編譯成具有AJAX功能的web頁面。因為筆者是多年的java 程序員，所以對這種相對新奇的方式使用起來感覺相當自如。但是如果不熟悉Java開發，或需要對于從Java到Web的編譯過程有更細致的控制，則會遇到困難。然而，GWT框架非常易用，只要補充一些Java語言技巧就可以開始用GWT了。

對于Java程序員來說，GWT生成Web內容的功能是神奇的（雖然存在少許限制）。典型的Web開發人員偏好對于應用生成的web內容有足夠多的控制，而GWT只提供了非常有限的控制方法。例如，案例中使用了com.google.gwt.user.client.ui.HorizontalPanel 設計頁面布局。這種Swing風格對于Java開發非常方便，適用于不同的瀏覽器。然而，若要細致地調整表現層的效果，則需跳出Java的規范，直接通過樣式定義來微調輸出結果。盡管這種做法很合理，卻超出了GWT的Java-only方式。

七、排除性能因素的框架比較
用于開發測試案例的所有框架有幾個共同之處：對于發送AJAX請求方面功能強大、易于使用，而且免費。YUI對于一般的門戶應用來說功能最完善（界面良好、靈活、拖放操作）。YUI的問題是其純粹的框架性質。YUI提供了很多功能，但也存在很多限制，使用起來感覺有些不夠靈活。而Prototype則正相反，是最開放靈活的框架。Prototype框架規模緊湊，提供了核心的AJAX抽象API , 在此基礎上開發人員可以只有構建其應用。
DWR對于需要與服務器端頻繁交互的、基于Java的應用來說是個不錯的框架。使用DWR，瀏覽器端邏輯層可以直接與業務層互動，從而有效地創建了一種全新的MVC模式?？蚣艿脑O計考慮了各種復雜的客戶端/服務器端交互情況。然而，如果對于類門戶的web應用來說，DWR的作用并不顯著。
如果需要一個支持AJAX的功能完善的框架，并且具有定制和底層代碼微調，應該選用Dojo。如果應用平臺是Java, GWT是最好的選擇。
具體采用哪個框架主要取決與應用的類型和開發人員的業務素質。