摘要:本文介紹了ASP.NET AJAX的由來(lái)、特性和架構(gòu)以及相關(guān)的服務(wù)端和客戶(hù)端技術(shù),并結(jié)合實(shí)際項(xiàng)目開(kāi)發(fā),證明使用ASP.NET AJAX帶來(lái)了更好的用戶(hù)體驗(yàn)和更高的開(kāi)發(fā)效率。
　　關(guān)鍵詞:ASP.NET AJAX;控件;服務(wù)端;客戶(hù)端
　　中圖分類(lèi)號(hào):TP312 文獻(xiàn)標(biāo)識(shí)碼:A
　　
　　1 引言
　　
　　2005年,在 Web2.0熱潮中,Ajax誕生,揭開(kāi)了無(wú)刷新更新頁(yè)面時(shí)代的序幕,并迅速以其更好的用戶(hù)體驗(yàn),更少的服務(wù)器和帶寬負(fù)擔(dān)等傳統(tǒng)Web應(yīng)用無(wú)法比擬的優(yōu)勢(shì),成為炙手可熱的Web開(kāi)發(fā)技術(shù),基于標(biāo)準(zhǔn)化被廣泛支持和應(yīng)用。
　　然而,Ajax也有很多不足之處:由于其涉及的技術(shù)太多,開(kāi)發(fā)者仍需要大量的學(xué)習(xí),對(duì)于某些比較復(fù)雜的客戶(hù)端程序來(lái)講,往往需要開(kāi)發(fā)者對(duì)JavaScript以及相關(guān)技術(shù)非常精通;每種瀏覽器中提供的DOM模型均有輕微的差異,在編寫(xiě)跨瀏覽器的客戶(hù)端應(yīng)用程序時(shí)往往非常困難; 由于大部分表示層以及少部分業(yè)務(wù)邏輯均被移到了客戶(hù)端用JavaScript實(shí)現(xiàn),使客戶(hù)端代碼量急劇增大,但JavaScript從語(yǔ)言層面上并沒(méi)有完善的面向?qū)ο笾С?使客戶(hù)端代碼的質(zhì)量無(wú)法保證。
　　綜上所述,Ajax技術(shù)的優(yōu)勢(shì)在于提高用戶(hù)體驗(yàn),不足之處在于開(kāi)發(fā)困難。而今應(yīng)用程序的發(fā)展趨勢(shì)是:把用戶(hù)體驗(yàn)放在第一位,但與此同時(shí),開(kāi)發(fā)效率也不容忽視。為了解決這樣的問(wèn)題,各種Ajax框架如雨后春筍般應(yīng)運(yùn)而生。
　　
　　2 ASP.NET AJAX簡(jiǎn)介?
　　
　　2.1 Ajax技術(shù)
　　Ajax在用戶(hù)和服務(wù)器之間建立異步操作機(jī)制,可將一些基本的操作交給Ajax引擎,需要從服務(wù)器獲取數(shù)據(jù)時(shí)才通過(guò)Ajax引擎直接向服務(wù)器請(qǐng)求。圖1為傳統(tǒng)Web應(yīng)用模型與Ajax Web應(yīng)用模型的工作模式比較:
　　
　　圖1傳統(tǒng)Web應(yīng)用模型與Ajax Web應(yīng)用模型的工作模式比較?
　　2.2 ASP.NET AJAX框架
　　像所有的優(yōu)秀技術(shù)一樣,Ajax已經(jīng)催生出大量框架,但歸結(jié)起來(lái)不外乎三類(lèi):回調(diào)框架、UI框架和完整框架:
　　回調(diào)框架一般由少數(shù)的幾個(gè)客戶(hù)端及服務(wù)器端庫(kù)文件組成。它只允許開(kāi)發(fā)者從客戶(hù)端調(diào)用服務(wù)器端代碼片段,并以序列化方式傳送輸入和輸出參數(shù)。
　　UI框架一般都是從現(xiàn)有的專(zhuān)業(yè)控件庫(kù)演變而來(lái),它們往往提供給開(kāi)發(fā)者一些高級(jí)網(wǎng)格控件、圖表控件和樹(shù)控件等等。這些控件都會(huì)支持異步回發(fā)機(jī)制并在客戶(hù)端生成用于自動(dòng)刷新頁(yè)面的JavaScript代碼。
　　完整框架提供包含控件和應(yīng)用程序服務(wù)在內(nèi)的極為豐富的編程模型,更適宜于同時(shí)應(yīng)用于客戶(hù)端和服務(wù)器端。
　　ASP.NET AJAX框架屬于第三種類(lèi)別,在實(shí)現(xiàn)Ajax功能的同時(shí)又極大地簡(jiǎn)化了開(kāi)發(fā)過(guò)程。使用 ASP.Net AJAX,甚至只需拖拽幾個(gè)控件,就可以使Web 頁(yè)面具有精彩的AJAX 用戶(hù)界面效果,同時(shí)大量地降低應(yīng)用服務(wù)器層的資源消耗。圖2為傳統(tǒng)ASP.NET頁(yè)面與ASP.NET AJAX頁(yè)面的工作原理比較:
　　
　　圖2傳統(tǒng)ASP.NET頁(yè)面與ASP.NET AJAX頁(yè)面的工作原理比較
　　ASP.NET AJAX主要的設(shè)計(jì)目標(biāo)有兩個(gè):第一,對(duì)現(xiàn)有的ASP.NET服務(wù)器端模型進(jìn)行擴(kuò)展,讓其可以生成實(shí)現(xiàn)富客戶(hù)端的JavaScript代碼;第二,為ASP.NET增加客戶(hù)端編程模型,讓純粹的客戶(hù)端編程變得更加簡(jiǎn)單。
　　這樣,ASP.NET AJAX的特性就可以相應(yīng)地分為服務(wù)器端和客戶(hù)端兩個(gè)部分,前者包含ASP.NET 2.0 AJAX Extensions以及ASP.NET AJAX Control Toolkit(開(kāi)發(fā)者社區(qū)協(xié)作的產(chǎn)物,其中包含了數(shù)十種非常有用的ASP.NET AJAX服務(wù)器端擴(kuò)展器控件以及多種獨(dú)立的ASP.NET AJAX服務(wù)器端控件),后者包含Microsoft AJAX Library。ASP.NET AJAX 的架構(gòu)如圖3所示:
　　
　　圖3ASP.NET AJAX 服務(wù)器和客戶(hù)端架構(gòu)
　　ASP.NET AJAX客戶(hù)端部分是一組JavaScript庫(kù)。這些庫(kù)在任何方面都沒(méi)有綁定到 ASP.NET――非ASP.NET開(kāi)發(fā)人員也可以在自己的Web頁(yè)面里使用�？蛻�(hù)端庫(kù)沒(méi)有提供太多的特性(例如,不包含任何可以直接拖放到Web頁(yè)面的預(yù)先建立的功能)。相反,建立了用于開(kāi)發(fā)ASP.NET AJAX頁(yè)面的基礎(chǔ)。這個(gè)基礎(chǔ)擴(kuò)展了JavaScript,彌補(bǔ)了幾個(gè)方面的不足,并提供了一些基本架構(gòu)。
　　ASP.NET AJAX服務(wù)器端部分在一個(gè)更高的層次上工作。包括使用那些客戶(hù)端腳本庫(kù)的控件和組件。
　　
　　3 ASP.NET AJAX的應(yīng)用?
　　
　　3.1 服務(wù)器端和客戶(hù)端使用方法分析
　　ASP.NET AJAX分為服務(wù)器端和客戶(hù)端兩個(gè)部分,有些功能既可以完全使用客戶(hù)端功能實(shí)現(xiàn),又可以完全使用服務(wù)器端功能實(shí)現(xiàn)。所以,比較異同,權(quán)衡利弊,并根據(jù)實(shí)際開(kāi)發(fā)中的具體情況選擇最合適的方法顯得至關(guān)重要。?
　　3.2 ASP.NET AJAX框架的技術(shù)實(shí)踐
　　對(duì)于開(kāi)發(fā)中遇到的不同情況以及需求,應(yīng)該區(qū)別對(duì)待并選擇最合適的開(kāi)發(fā)方式,下面是三種主要的場(chǎng)景:
　　1.繼續(xù)使用普通的ASP.NET服務(wù)器控件,但利用ASP.NET AJAX組件或者新控件和控件擴(kuò)展器擴(kuò)展其功能。
　　2. 從頭創(chuàng)建“純粹的”Ajax應(yīng)用程序。
　　所謂“純粹的”Ajax應(yīng)用程序,是指服務(wù)器端沒(méi)有任何表示層邏輯,只用來(lái)提供數(shù)據(jù),同時(shí)所有的表示層邏輯均在客戶(hù)端JavaScript中完成。極端一點(diǎn)說(shuō),這種“純粹的”Ajax應(yīng)用程序?qū)⒅挥幸粋�(gè)頁(yè)面,所有的功能(包括用戶(hù)輸入、與服務(wù)器通信、界面改變等)均通過(guò)客戶(hù)端JavaScript來(lái)實(shí)現(xiàn)。
　　3.在非ASP.NET 2.0服務(wù)器端平臺(tái)上使用ASP.NET AJAX。
　　這種情況下的ASP.NET AJAX服務(wù)器端無(wú)法實(shí)現(xiàn),只能考慮使用ASP.NET AJAX的客戶(hù)端實(shí)現(xiàn)方式。
　　值得注意的是,ASP.NET AJAX的兩種實(shí)現(xiàn)方式并不是互相對(duì)立的,而是相輔相成的。上面所說(shuō)的“選擇某種實(shí)現(xiàn)方式”僅僅意味著“偏重使用某種實(shí)現(xiàn)方式”。
　　上述第一種場(chǎng)景最為常見(jiàn),而且實(shí)現(xiàn)最為簡(jiǎn)單。下面以《湖北省農(nóng)村能源管理系統(tǒng)》中的實(shí)際應(yīng)用為例,簡(jiǎn)單介紹CascadingDropDown控件的使用。
　　CascadingDropDown是AjaxControlToolkit中的組件,用來(lái)控制數(shù)個(gè)普通的DropDownList控件,使其產(chǎn)生無(wú)刷新的級(jí)聯(lián)效果,同時(shí)大大簡(jiǎn)化開(kāi)發(fā)流程。完成級(jí)聯(lián)選擇項(xiàng)變化的過(guò)程通過(guò)發(fā)布在 IIS 服務(wù)器上的 Web Service 實(shí)現(xiàn)。這個(gè) Web Service 可以完全地控制其中級(jí)聯(lián)的業(yè)務(wù)邏輯。通過(guò)它開(kāi)發(fā)人員可以很方便地從 Xml 或者數(shù)據(jù)庫(kù)中獲得相關(guān)數(shù)據(jù)。以下是相關(guān)的主要代碼:
　�。�!--下拉列表控件--＞
　�。糰sp:DropDownList ID=“DropDownList1” runat=“server” SkinID=“ddl1” AutoPostBack=“true” OnSelectedIndexChanged=“DropDownList_SelectedIndexChanged”/＞
　　•••
　　＜!--對(duì)應(yīng)的CascadingDropDown控件--＞
　�。糰jaxToolkit:CascadingDropDown ID=“CascadingDropDown1” runat=“server” TargetControlID=“DropDownList1” LoadingText=“正在加載區(qū)域類(lèi)型” PromptText=“請(qǐng)選擇區(qū)域類(lèi)型” ServicePath=“UserManage.asmx” ServiceMethod=“getAreaType” Category=“typename”＞
　　＜/ajaxToolkit:CascadingDropDown＞
　�。糰jaxToolkit:CascadingDropDown ID=“CascadingDropDown2” runat=“server” TargetControlID=“DropDownList2” ParentControlID=“DropDownList1” LoadingText=“正在加載市級(jí)城市” PromptText=“請(qǐng)選擇市級(jí)城市” ServicePath=“UserManage.asmx” ServiceMethod=“getCity” Category=“cityname”＞
　　 ＜/ajaxToolkit:CascadingDropDown＞
　　＜ajaxToolkit:CascadingDropDown ID=“CascadingDropDown3” runat=“server” TargetControlID=“DropDownList3” ParentControlID=“DropDownList2” LoadingText=“正在加載縣級(jí)城市”P(pán)romptText=“請(qǐng)選擇縣級(jí)城市” ServicePath=“UserManage.asmx” ServiceMethod=“getCountry” Category=“countryname”＞
　�。�/ajaxToolkit:CascadingDropDown＞
　　WebService代碼(以三級(jí)下拉列表的WebService代碼為例):
　　 //獲取縣級(jí)城市
　　[WebMethod]
　　public CascadingDropDownNameValue[] getCountry(string knownCategoryValues, string category)
　　{StringDictionary kv= CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);
　　•••
　　if ((kv.ContainsKey(“rolename”) && kv.ContainsKey(“cityname”) && kv[“rolename”] == “6fc98827-de43-4026-b67d-b4d207fb1afd”)|| (kv.ContainsKey(“typename”) && kv.ContainsKey(“cityname”)))
　　{ DataTable countries = getCountryTable(kv[“cityname”].ToString());
　　//填充下拉列表
　　List＜CascadingDropDownNameValue＞ values = new List＜CascadingDropDownNameValue＞();
　　foreach (DataRow dr in countries.Rows)
　　{ values.Add(new CascadingDropDownNameValue(dr[“CountryName”].ToString(), dr[“CountryID”].ToString())); }
　　return values.ToArray();
　　•••
　　
　　4 結(jié)束語(yǔ)
　　
　　ASP.NET AJAX最精彩的特性是它并不只是一個(gè)JavaScript庫(kù)或者一個(gè)簡(jiǎn)化回調(diào)的.NET組件,而是一個(gè)多層的平臺(tái),能夠創(chuàng)建更具響應(yīng)性更動(dòng)態(tài)的頁(yè)面――設(shè)置一個(gè)完全不同類(lèi)型的Web應(yīng)用程序。由以上內(nèi)容可知,可以在三個(gè)不同層次使用ASP.NET AJAX框架。另外,ASP.NET AJAX還在不斷的發(fā)展改善中,可以大膽預(yù)測(cè),ASP.NET AJAX Control Toolkit將提供大量的服務(wù)器端擴(kuò)展器控件,讓開(kāi)發(fā)者極為方便地為現(xiàn)有的ASP.NET應(yīng)用程序添加Ajax功能;其他服務(wù)器端平臺(tái)上將有對(duì)ASP.NET AJAX服務(wù)器端控件/組件的實(shí)現(xiàn)。?
　　
　　參考文獻(xiàn)?
　　[1]陳黎夫.ASP.NET AJAX程序設(shè)計(jì)(第I卷): 服務(wù)器端ASP.NET 2.0 AJAX Extensions與ASP.NET AJAX Control Toolkit [M]. 北京: 人民郵電出版社, 2007.?
　　[2]陳黎夫.ASP.NET 2.0 Ajax程序設(shè)計(jì)(第II卷): 客戶(hù)端Microsoft AJAX Library與異步通信層[M]. 北京: 人民郵電出版社, 2007.?
　　[3][美] Matthew MacDonald, Mario Szpuszta.ASP.NET 3.5高級(jí)程序設(shè)計(jì)(第2版) [M]. 北京: 人民郵電出版社, 2008.?

相關(guān)熱詞搜索：分析 ASP NET ＡＳＰ．ＮＥＴ　ＡＪＡＸ分析與應(yīng)用 asp net+ajax asp net ajax主頁(yè)