0 引言

隨著互聯(lián)網(wǎng)的不斷發(fā)展和信息量的劇增，如何使Web響應(yīng)更加靈敏，數(shù)據(jù)傳輸更加快捷，已成為當(dāng)今關(guān)注的熱點(diǎn)。應(yīng)用系統(tǒng)所采用的技術(shù)也由早期的C／S(Client／Server)模式向基于B／S(Browser／Server)的應(yīng)用模式進(jìn)行轉(zhuǎn)變。這種轉(zhuǎn)變避免了繁瑣的部署工作，同時(shí)也體現(xiàn)了瘦客戶(hù)的開(kāi)發(fā)理念，但同步交互方式帶來(lái)客戶(hù)端響應(yīng)速度慢的問(wèn)題始終困擾著最終用戶(hù)。基于Ajax(Asynchronous JavaScript. and XML)的Web 2.0技術(shù)改變?cè)械耐浇换楫惒浇换シ绞?，使?yè)面在后臺(tái)按需獲取數(shù)據(jù)，這樣不僅節(jié)省了帶寬，更加大大提升了用戶(hù)體驗(yàn)。

Ajax是新興網(wǎng)絡(luò)開(kāi)發(fā)技術(shù)的象征，是Web 2.0時(shí)代的代表。最關(guān)鍵的是顛覆了傳統(tǒng)Web與服務(wù)器的交互模式，這種思維模式的轉(zhuǎn)變?yōu)閃eb發(fā)展提供了更廣闊的前景。Ajax是一個(gè)前臺(tái)工具，在后臺(tái)可以使用各種服務(wù)器語(yǔ)言，比如：.NET，PHP，Java等。Ajax是集合了多種技術(shù)，提高互聯(lián)網(wǎng)性能的一種關(guān)鍵技術(shù)。Ajax理念的出現(xiàn)，揭開(kāi)了無(wú)刷新更新頁(yè)面時(shí)代的序幕，并有代替?zhèn)鹘y(tǒng)Web開(kāi)發(fā)中采用form(表單)遞交方式更新Web頁(yè)面的趨勢(shì)，其可以算是一個(gè)里程碑。

1 Ajax的工作原理

在傳統(tǒng)的瀏覽器與服務(wù)器的交互方式中“采用同步方式”由用戶(hù)觸發(fā)一個(gè)HTTP請(qǐng)求到服務(wù)器，服務(wù)器對(duì)其進(jìn)行處理后再返回一個(gè)新的Web頁(yè)到瀏覽器。每次應(yīng)用的交互都需要向服務(wù)器發(fā)送請(qǐng)求，應(yīng)用的響應(yīng)時(shí)間就依賴(lài)于服務(wù)器的響應(yīng)時(shí)間。當(dāng)服務(wù)器正在處理的時(shí)候，用戶(hù)只是在等待，這樣，不會(huì)產(chǎn)生很好的用戶(hù)體驗(yàn)；而在前后兩個(gè)頁(yè)面中的大部分HTML代碼往往是相同的，也浪費(fèi)了許多帶寬資源。

現(xiàn)在使用的Ajax技術(shù)是將幾種成熟技術(shù)按一定的方式結(jié)合在一起，通過(guò)協(xié)作發(fā)揮各自作用，包括：使用XHTML和CSS標(biāo)準(zhǔn)化呈現(xiàn)；使用DOM實(shí)現(xiàn)動(dòng)態(tài)顯示和交互；使用XML和XSLT進(jìn)行數(shù)據(jù)交換與處理；使用XMLHttpRequest進(jìn)行異步數(shù)據(jù)讀取；用JavaS-cript綁定和處理所有數(shù)據(jù)。

Ajax需要一個(gè)穩(wěn)定、響應(yīng)及時(shí)的服務(wù)器向引擎發(fā)送內(nèi)容，作為必要的服務(wù)端處理邏輯，確保向Ajax引擎發(fā)送的數(shù)據(jù)格式是正確的。

Ajax的工作原理相當(dāng)于在用戶(hù)和服務(wù)器之間加了一個(gè)中間層Ajax引擎，從而實(shí)現(xiàn)用戶(hù)操作與服務(wù)器響應(yīng)的異步化。這樣把以前的一些服務(wù)器負(fù)擔(dān)的工作轉(zhuǎn)嫁到客戶(hù)端，利于客戶(hù)端閑置的處理能力來(lái)處理，減輕服務(wù)器和帶寬的負(fù)擔(dān)，從而達(dá)到節(jié)約ISP的空間及帶寬租用成本的目的。但并不是所有的用戶(hù)請(qǐng)求都提交給服務(wù)器，像一些數(shù)據(jù)驗(yàn)證和數(shù)據(jù)處理等都交給Ajax引擎自己來(lái)做，只有確定需要從服務(wù)器讀取新數(shù)據(jù)時(shí)再由Ajax引擎代為向服務(wù)器提交請(qǐng)求。傳統(tǒng)的Web應(yīng)用程序模型和基于Ajax的Web應(yīng)用模型分別如圖1，圖2所示。

由于Ajax技術(shù)的結(jié)構(gòu)特點(diǎn)，可以為ISP、開(kāi)發(fā)人員、終端用戶(hù)帶來(lái)可見(jiàn)的便捷：

(1)按需獲取數(shù)據(jù)。這是Ajax的根本理念，Ajax的原則是“按需取數(shù)據(jù)”，這樣可以最大程度地減輕冗余請(qǐng)求，減輕服務(wù)器的負(fù)擔(dān)。

(2)無(wú)刷新更新頁(yè)面，減少用戶(hù)心理和實(shí)際的等待時(shí)間。這是Ajax最大的特點(diǎn)，用戶(hù)無(wú)需刷新頁(yè)面便可向服務(wù)器傳輸和讀寫(xiě)數(shù)據(jù)。

(3)基于標(biāo)準(zhǔn)化的并被廣泛支持的技術(shù)。Ajax包含的技術(shù)都是各自領(lǐng)域強(qiáng)有力的技術(shù)，組合之后的功能更加強(qiáng)大。

(4)給用戶(hù)帶來(lái)更好的體驗(yàn)。Ajax使得在Web上運(yùn)行軟件的感受，越來(lái)越接近于本機(jī)上運(yùn)行的效果。

(5)可以調(diào)用外部數(shù)據(jù)，取得足夠權(quán)限后，能輕易地實(shí)現(xiàn)數(shù)據(jù)聚合。

(6)進(jìn)一步促進(jìn)頁(yè)面呈現(xiàn)與數(shù)據(jù)的分離。

2 Ajax技術(shù)在Web 2.0中的應(yīng)用

下面簡(jiǎn)要介紹利用Ajax技術(shù)的無(wú)需頁(yè)面提交而能與服務(wù)器交互，即時(shí)從服務(wù)器獲取數(shù)據(jù)并顯示出來(lái)的特性，實(shí)現(xiàn)自動(dòng)完成(字典)功能的過(guò)程。自動(dòng)完成功能實(shí)現(xiàn)的主要目的是幫助用戶(hù)快速準(zhǔn)確的輸入內(nèi)容，就是用戶(hù)在輸入框中輸入一些檢索詞，根據(jù)用戶(hù)所輸入的信息，從后臺(tái)數(shù)據(jù)庫(kù)以LIKE方式查詢(xún)，同時(shí)在輸入框下方顯示相應(yīng)的提示信息，進(jìn)而幫助用戶(hù)快速的搜索。在很多系統(tǒng)中都需要實(shí)現(xiàn)自動(dòng)完成的功能，但在Ajax技術(shù)出現(xiàn)之前，一般只有桌面應(yīng)用程序才能實(shí)現(xiàn)類(lèi)似的功能。Web應(yīng)用程序只能借助于瀏覽器自身的自動(dòng)完成功能來(lái)實(shí)現(xiàn)，而瀏覽器的自動(dòng)完成功能是比較有限的，它只能提示用戶(hù)輸入過(guò)的信息。如果自動(dòng)完成的數(shù)據(jù)是來(lái)自于服務(wù)器端的，Ajax則是最好的選擇。比如用戶(hù)只記住了要查詢(xún)信息的前面幾個(gè)字，而記不清全名，這樣要查詢(xún)到所要的信息就比較困難。使用Ajax技術(shù)后，在用戶(hù)輸入的同時(shí)，輸入框下方可以給出與已輸入信息相匹配的提示來(lái)輔助用戶(hù)輸入，這樣用戶(hù)進(jìn)行查詢(xún)的速度和準(zhǔn)確率會(huì)大大提高，也可以有效地改善用戶(hù)體驗(yàn)。下面利用Ajax(.net)技術(shù)實(shí)現(xiàn)一個(gè)學(xué)校信息查詢(xún)的自動(dòng)完成功能，其步驟如下：

服務(wù)器端提供GetSearchItems方法給客戶(hù)端，用來(lái)返回滿(mǎn)足條件的列表；

客戶(hù)端的輸入框需要增加onkeydown響應(yīng)函數(shù)，以便即時(shí)獲得滿(mǎn)足條件的列表；

通過(guò)客戶(hù)端的JavaScript動(dòng)態(tài)列出待選結(jié)果的列表，同時(shí)還要提供鍵盤(pán)和鼠標(biāo)的響應(yīng)。

在服務(wù)器端添加供客戶(hù)端調(diào)用的GetSearchItems方法是：在服務(wù)器端函數(shù)GetSearchItems的定義前加上[AjaxMethod()]標(biāo)記，以表明它可以被客戶(hù)端異步的調(diào)用。具體代碼如下所示：

(1)服務(wù)器端代碼設(shè)置如下：

該方法用于查詢(xún)數(shù)據(jù)庫(kù)，最后返回一個(gè)ArrayList對(duì)象，他將包含所有以用戶(hù)輸入字符串開(kāi)頭的所有學(xué)校名稱(chēng)的條目。

(2)客戶(hù)端處理的部分代碼

客戶(hù)端相對(duì)于服務(wù)器端處理要復(fù)雜得多，要根據(jù)服務(wù)器端返回的ArrayList對(duì)象展示結(jié)果，此處用JavaScript和DOM創(chuàng)建一個(gè)新的div，將ArrayList中的每一條目都作為其子節(jié)點(diǎn)加入到div中，而每一個(gè)條目也被看作是一個(gè)div，具體的文本內(nèi)容則是一個(gè)span對(duì)象。

3結(jié) 語(yǔ)

利用Ajax技術(shù)，開(kāi)發(fā)人員可以創(chuàng)建一個(gè)與桌面應(yīng)用程序相媲美的交互式用戶(hù)界面。Ajax使Web中的界面與應(yīng)用分離(也可以說(shuō)是數(shù)據(jù)與呈現(xiàn)分離)，而在以前兩者是沒(méi)有清晰界限的，數(shù)據(jù)與呈現(xiàn)的分離，有利于分工合作、減少非技術(shù)人員對(duì)頁(yè)面的修改造成Web應(yīng)用程序的錯(cuò)誤，提高效率，也更加適用于現(xiàn)在的發(fā)布系統(tǒng)，也可以把以前一些服務(wù)器負(fù)擔(dān)的工作轉(zhuǎn)嫁到客戶(hù)端，利用客戶(hù)端閑置的處理能力來(lái)處理。Ajax技術(shù)的出現(xiàn)將基于Web的應(yīng)用程序開(kāi)發(fā)帶進(jìn)了一個(gè)全新的階段，但Ajax主要是基于JavaScript的客戶(hù)端技術(shù)，所以客戶(hù)端的開(kāi)發(fā)顯得越來(lái)越臃腫，隨之而來(lái)的安全性等一系列問(wèn)題有待進(jìn)一步研究。