Ajax技術(shù)的研究與應(yīng)用

靖?jìng)?/p>

(中國(guó)傳媒大學(xué) 信息工程學(xué)院，北京 100024)

Ajax技術(shù)的研究與應(yīng)用

靖?jìng)?/p>

(中國(guó)傳媒大學(xué) 信息工程學(xué)院，北京 100024)

Ajax技術(shù)作為Web2.0時(shí)代的重要產(chǎn)物，已經(jīng)越來越多的應(yīng)用在當(dāng)今的互聯(lián)網(wǎng)產(chǎn)品中。通過它實(shí)現(xiàn)無刷新更新頁(yè)面的方式，使用戶能夠方便快捷的訪問應(yīng)用，增加了互動(dòng)性，降低了服務(wù)器負(fù)擔(dān)，節(jié)省了帶寬。本文針對(duì)移動(dòng)端Web應(yīng)用中倒計(jì)時(shí)的問題展開研究，在介紹了Ajax的關(guān)鍵技術(shù)，分析了引入Ajax技術(shù)的站點(diǎn)相對(duì)于傳統(tǒng)Web站點(diǎn)的優(yōu)勢(shì)。利用Ajax技術(shù)和差值補(bǔ)償?shù)姆椒ㄟ_(dá)到了無刷新同步本地時(shí)間，以保證多終端系統(tǒng)計(jì)時(shí)的同步性。最后通過一個(gè)典型的應(yīng)用：“定時(shí)搶票系統(tǒng)”的實(shí)現(xiàn)進(jìn)一步證明了Ajax技術(shù)在時(shí)間同步方面的優(yōu)勢(shì)。

Ajax；HTML；異步交互；時(shí)間同步

1 引言

2004年出版社經(jīng)營(yíng)者O’Reilly和MediaLive International之間的一場(chǎng)頭腦風(fēng)暴論壇。為我們帶來了Web2.0這一劃時(shí)代的概念。Web2.0的核心思想是用戶參與網(wǎng)站內(nèi)容的創(chuàng)造，注重交互性以及設(shè)計(jì)符合W3C標(biāo)準(zhǔn)的網(wǎng)站。Ajax作為Web2.0的核心技術(shù)，對(duì)于構(gòu)建更有吸引力的交互式網(wǎng)站，起到了不可替代的作用。當(dāng)前基于Ajax的應(yīng)用種類繁多，諸如谷哥公司推出的Google Maps能夠提供世界范圍內(nèi)的地圖搜索服務(wù)；Amazon的鉆石搜索應(yīng)用使用戶能夠體驗(yàn)到快捷的購(gòu)物方式；Gmail利用Ajax技術(shù)實(shí)現(xiàn)了功能豐富的系統(tǒng)應(yīng)用[1]。與此同時(shí)，我國(guó)的研究人員也在尋求著Ajax技術(shù)在不同領(lǐng)域應(yīng)用的新途徑。為確保通信的健全性，肖斌等人對(duì)傳統(tǒng)Web 框架的系統(tǒng)存在用戶等待時(shí)間長(zhǎng)、經(jīng)常出現(xiàn)白頁(yè)的問題，提出了采用HTTP壓縮方法和緩存等技術(shù)來提高數(shù)據(jù)傳輸性能的Ajax模型。通過改善Ajax應(yīng)用程序的性能，提高了網(wǎng)絡(luò)反映速度，獲得了高質(zhì)量、快速和健壯的網(wǎng)絡(luò)通信[2]。周揚(yáng)在動(dòng)態(tài)加載、預(yù)見式緩存、內(nèi)容分塊等方面提出了Ajax應(yīng)用的設(shè)計(jì)模式。為 AJAX 應(yīng)用設(shè)計(jì)提供了較為通用的設(shè)計(jì)思路和更加規(guī)范、合理的體系結(jié)構(gòu)，在一定程度上簡(jiǎn)化了 AJAX 應(yīng)用開發(fā)的難度，有效改善了程序的性能[3]。在網(wǎng)絡(luò)時(shí)間同步方面Cristian算法[4]、Berkeley算法[5]、優(yōu)化時(shí)鐘同步算法[6]等，在一方面保證了信息在網(wǎng)絡(luò)傳遞過程中的時(shí)間的同步性。趙英等人將Web Services技術(shù)引入時(shí)間同步研究領(lǐng)域，建立了面向網(wǎng)絡(luò)時(shí)間同步服務(wù)的Web Services體系結(jié)構(gòu)，使客戶端利用客戶機(jī)發(fā)送查詢請(qǐng)求的時(shí)間、服務(wù)器收到查詢請(qǐng)求的時(shí)間、服務(wù)器應(yīng)答時(shí)間信息包的時(shí)間以及客戶機(jī)收到服務(wù)器返回時(shí)間信息包的時(shí)間這四個(gè)時(shí)間戳來計(jì)算它與服務(wù)器間的時(shí)間偏移和包交換的往返延遲，然后使用時(shí)間偏移來調(diào)整本地時(shí)間，讓客戶機(jī)與服務(wù)器的時(shí)間保持同步。這種方法幫助了客戶端拋開各種不同的網(wǎng)絡(luò)環(huán)境進(jìn)行時(shí)間同步[7]。在移動(dòng)客戶端與服務(wù)器端，應(yīng)用層時(shí)間同步方面，傳統(tǒng)的應(yīng)用往往通過頁(yè)面定期刷新更新同步時(shí)間，或者在頁(yè)面加載時(shí)獲取一次標(biāo)準(zhǔn)時(shí)間而后進(jìn)行本地計(jì)時(shí)。這樣經(jīng)過長(zhǎng)時(shí)間計(jì)時(shí)往往會(huì)造成較大的誤差。隨著Ajax技術(shù)的出現(xiàn)，通過Ajax層請(qǐng)求服務(wù)器時(shí)間，可以使客戶端頁(yè)面在不刷新的情況下快速的取得服務(wù)器標(biāo)準(zhǔn)時(shí)間，進(jìn)而進(jìn)行使本地時(shí)間同步，為多終端的精確時(shí)間同步帶來了可能性。

2 Ajax技術(shù)簡(jiǎn)述

Ajax全稱為“Asynchronous JavaScript and XML”(異步JavaScript和XML)，是指一種創(chuàng)建交互式網(wǎng)頁(yè)應(yīng)用的網(wǎng)頁(yè)開發(fā)技術(shù)。Ajax是目前在瀏覽器中通過JavaScript腳本可以使用的所有技術(shù)的集合。Ajax并沒有創(chuàng)造出某種具體的新技術(shù)，它所使用的都是已經(jīng)存在并且較為成熟的技術(shù)，Ajax通過一種嶄新的方式將這些技術(shù)整合到一起。具體來說包括以下技術(shù)：

(1) XHTML：可擴(kuò)展超文本標(biāo)記語(yǔ)言。

(2)CSS：級(jí)聯(lián)樣式表，它負(fù)責(zé)客戶端頁(yè)面樣式的展現(xiàn)。

(3)DOM：文檔對(duì)象模型，表示和處理一個(gè)HTML或XML文檔的常用方法。

(4)JavaScript：一種成熟的客戶端腳本語(yǔ)言，JavaScript通過操縱DOM來改變前端頁(yè)面結(jié)構(gòu)。

(5)XML：可擴(kuò)展標(biāo)記語(yǔ)言，一種適用于Ajax的語(yǔ)言傳輸格式。

Ajax技術(shù)的核心在于異步通信，不必整體刷新頁(yè)面，從而減少了數(shù)據(jù)傳輸量，提高了Web應(yīng)用的響應(yīng)速度，給用戶帶來了良好的體驗(yàn)。Ajax可以在頁(yè)面內(nèi)與服務(wù)器通信，使得構(gòu)建智能化的客戶端控件成為可能。例如：數(shù)據(jù)表格，樹型控件等各種復(fù)雜的控件。智能化的客戶端控件可以通過XMLHttpRequest對(duì)象與服務(wù)器通信，獲取數(shù)據(jù)，并可緩沖和處理數(shù)據(jù)。這使得許多工作可以在客戶端完成，例如：數(shù)據(jù)效驗(yàn)、表單驗(yàn)證等。Ajax技術(shù)極大地改善了Web應(yīng)用的可用性和用戶的交互體驗(yàn)，最終得到了用戶和市場(chǎng)的廣泛認(rèn)可。

Ajax技術(shù)有著眾多不可取代的優(yōu)勢(shì)的同時(shí)也存在著一些缺點(diǎn)。Ajax中的一個(gè)頁(yè)面并不僅僅作為一個(gè)顯示層表示。作為一個(gè)可操作界面，用戶可以點(diǎn)擊頁(yè)面上的元素，達(dá)到更新局部數(shù)據(jù)的目的。這時(shí)一個(gè)頁(yè)面可以表示為多個(gè)狀態(tài)。那么問題就出現(xiàn)了，雖然頁(yè)面改變了多個(gè)狀態(tài)，但是他的URL沒有改變，所以致使瀏覽器的前進(jìn)后退功能失敗[8]。

3 移動(dòng)端的時(shí)間同步

3.1 Ajax技術(shù)與時(shí)間同步方式的改變

早在Web1.0時(shí)代，頁(yè)面應(yīng)用相對(duì)較少，主要為門戶網(wǎng)站，而用戶對(duì)于互聯(lián)網(wǎng)的需求也主要以瀏覽信息為主。那時(shí)候應(yīng)用的頁(yè)面計(jì)時(shí)方式只是在頁(yè)面加載時(shí)獲取一次服務(wù)器時(shí)間進(jìn)行計(jì)時(shí)，而由于網(wǎng)絡(luò)系統(tǒng)的傳輸延時(shí)、受客戶端影響的腳本運(yùn)行時(shí)間誤差等都會(huì)影響計(jì)時(shí)精度，也無法進(jìn)行后續(xù)的時(shí)間同步。隨著Web2.0時(shí)代的到來，Ajax技術(shù)的出現(xiàn)為許多新的應(yīng)用提供了必要的條件，同時(shí)也為客戶端精準(zhǔn)計(jì)時(shí)提供了可能性。

(1) Web1.0模式下的時(shí)間同步方式

在傳統(tǒng)的Web1.0模式下，計(jì)時(shí)方式主要采取同步方式，當(dāng)頁(yè)面加載后，客戶端會(huì)從服務(wù)器獲得服務(wù)器端標(biāo)準(zhǔn)時(shí)間，來同步一次本地時(shí)間，后面的計(jì)時(shí)會(huì)在本地完成，通過腳本語(yǔ)言設(shè)置時(shí)間間隔來使標(biāo)準(zhǔn)時(shí)間改變。但由于腳本的本地運(yùn)行會(huì)受到終端設(shè)備的影響長(zhǎng)時(shí)間會(huì)有積累誤差，造成計(jì)時(shí)不準(zhǔn)。要想消除誤差只能通過控制頁(yè)面強(qiáng)制刷新。其過程如下：

如圖1所示，腳本控制頁(yè)面刷新，客戶端會(huì)發(fā)出一個(gè)HTTP請(qǐng)求，在這期間它會(huì)一直等待服務(wù)器響應(yīng)。而服務(wù)器在收到請(qǐng)求后，將處理好的數(shù)據(jù)返回客戶端。瀏覽器在收到返回的HTML、CSS、JavaScript等文件數(shù)據(jù)，再進(jìn)行渲染，呈現(xiàn)出頁(yè)面。當(dāng)前大多數(shù)Web頁(yè)面含有大量圖片、JavaScript制作的動(dòng)態(tài)插件等，而我們需要的僅僅是服務(wù)器的時(shí)間數(shù)據(jù)，頁(yè)面也會(huì)再次刷新，這些文件會(huì)被無意義的再次請(qǐng)求與傳輸。這無疑增加了用戶等待時(shí)間，影響體驗(yàn)，也造成了空間上多余的數(shù)據(jù)傳輸，影響帶寬。

圖1 傳統(tǒng)請(qǐng)求模式

對(duì)于時(shí)間精度要求不高的應(yīng)用來說可以采取這種方式。加載時(shí)同步一次時(shí)間，后續(xù)進(jìn)行本地計(jì)算，不再進(jìn)行與服務(wù)器的時(shí)間同步。

(2)基于Ajax的時(shí)間同步方式

與傳統(tǒng)的Web技術(shù)不同，Ajax采用的是異步交互處理技術(shù)。使用其可以方便的獲取服務(wù)器基準(zhǔn)時(shí)間而無需刷新頁(yè)面。如圖2所示，為了改變傳統(tǒng)的Web客戶端和服務(wù)器的“請(qǐng)求——等待——請(qǐng)求——等待”的模式，在用戶瀏覽器和服務(wù)器之間設(shè)計(jì)一個(gè)中間層——即Ajax層。

圖2 Ajax請(qǐng)求模式

Ajax的工作原理是：客戶端瀏覽器在運(yùn)行時(shí)首先加載一個(gè)Ajax引擎(該引擎由JavaScript編寫)；Ajax引擎創(chuàng)建一個(gè)異步調(diào)用的對(duì)象XMLHttpRequest，向Web服務(wù)器發(fā)出一個(gè)HTTP請(qǐng)求并監(jiān)聽端口動(dòng)態(tài)；服務(wù)器收到請(qǐng)求后，從數(shù)據(jù)庫(kù)中取出數(shù)據(jù)。由于Ajax支持三種數(shù)據(jù)傳輸格式即Json，XML和Text，所以服務(wù)器將數(shù)據(jù)打包成的所需要格式返回客戶端；當(dāng)Ajax所監(jiān)聽的端口，發(fā)現(xiàn)數(shù)據(jù)傳輸完畢后，通過Ajax引擎接收返回的結(jié)果，最后交由JavaScript對(duì)數(shù)據(jù)作相應(yīng)的處理。

上述過程可以看出，客戶端發(fā)出的對(duì)于服務(wù)器時(shí)間的HTTP請(qǐng)求和數(shù)據(jù)的接收全部承接給了Ajax層，再由腳本語(yǔ)言對(duì)時(shí)間數(shù)據(jù)進(jìn)行處理達(dá)到本地時(shí)間的同步化，通過DOM使頁(yè)面結(jié)構(gòu)部分改變，而非整個(gè)頁(yè)面的重載。在這個(gè)處理過程中頁(yè)面處于相對(duì)靜止的狀態(tài)，用戶在這期間可以進(jìn)行其他操作。異步交互時(shí)序如圖3所示。這也就是Ajax技術(shù)在客戶端時(shí)間同步方面的魅力所在。

3.2 移動(dòng)端時(shí)間同步要考慮的問題

移動(dòng)端應(yīng)用以其方便快捷輕巧的優(yōu)勢(shì)，為用戶所喜愛，但同時(shí)移動(dòng)終端在時(shí)間同步方面在考慮到普通Web應(yīng)用共有特點(diǎn)的同時(shí)，也要顧及其特殊性。具體要考慮以下幾個(gè)方面：

(1)手機(jī)鎖屏后系統(tǒng)休眠

一般倒計(jì)時(shí)系統(tǒng)當(dāng)用戶第一次登陸時(shí)獲取一次服務(wù)器時(shí)間，再與本地時(shí)間計(jì)算差值。這樣當(dāng)手機(jī)鎖屏后系統(tǒng)處于休眠狀態(tài)，屏幕再次開啟，前端頁(yè)面會(huì)保持原有狀態(tài)，JavaScript腳本不會(huì)重新加載并運(yùn)行。這時(shí)倒計(jì)時(shí)系統(tǒng)還是會(huì)從鎖屏前一時(shí)刻繼續(xù)計(jì)時(shí)，從而產(chǎn)生了問題。這對(duì)于倒計(jì)時(shí)系統(tǒng)而言，會(huì)有致命的缺陷。

(2)客戶端修改本地時(shí)間

由于計(jì)時(shí)要部分依賴于客戶端本地時(shí)間，如果在計(jì)時(shí)過程中人為的修改本地系統(tǒng)時(shí)間，則可能會(huì)對(duì)計(jì)時(shí)系統(tǒng)產(chǎn)生影響。

(3)網(wǎng)絡(luò)延時(shí)以及系統(tǒng)效率

由于計(jì)時(shí)系統(tǒng)需要精確的計(jì)時(shí)基準(zhǔn)，但是系統(tǒng)運(yùn)行時(shí)的網(wǎng)絡(luò)狀況難以確定，若采取進(jìn)入頁(yè)面后一次讀取服務(wù)器時(shí)間作為基準(zhǔn)，可能會(huì)出現(xiàn)計(jì)時(shí)偏差。而若過于頻繁的通過服務(wù)器同步本地時(shí)間又會(huì)影響系統(tǒng)運(yùn)行效率。

圖3 時(shí)序圖

3.3 差值補(bǔ)償算法

移動(dòng)端帶有倒計(jì)時(shí)的應(yīng)用最重要的是實(shí)現(xiàn)多終端時(shí)間同步，確保所有用戶使用的是同一基準(zhǔn)時(shí)間。目前比較常用的方法就是根據(jù)基準(zhǔn)時(shí)間使用周期函數(shù)并設(shè)置時(shí)間間隔來計(jì)算最新的時(shí)間，這樣的問題在于函數(shù)周期運(yùn)行的時(shí)間精度比較低，經(jīng)測(cè)試一分鐘大概能相差幾秒，這與電腦性能以及運(yùn)行的任務(wù)也相關(guān)，這樣的誤差在某些需求下是無法滿足的。

因而通過Ajax定期取得服務(wù)器時(shí)間來更新基準(zhǔn)時(shí)間，是十分便捷的辦法。但是為了保證系統(tǒng)的運(yùn)行效率，獲取時(shí)間的間隔不能過長(zhǎng)。同時(shí)為了保證手機(jī)鎖屏或用戶修改客戶端系統(tǒng)時(shí)間而帶來的時(shí)間不一致問題，采用一種改良的時(shí)間差值補(bǔ)償方式。

設(shè)客戶端時(shí)間為CT，服務(wù)器時(shí)間為ST，在頁(yè)面加載的時(shí)候計(jì)算出客戶端與服務(wù)器的時(shí)間差值為ΔT。當(dāng)客戶端時(shí)間被用戶修改或手機(jī)鎖屏造成的停止計(jì)時(shí)，一旦出現(xiàn)這樣的狀況，計(jì)算出來的服務(wù)器時(shí)間也將隨之發(fā)生變化。這就需要檢測(cè)出客戶端時(shí)間的變化并消除這個(gè)變化。檢測(cè)的方法是，即在每個(gè)計(jì)算周期(T)都將當(dāng)時(shí)的客戶端時(shí)間(CT2)與上一個(gè)周期的客戶端時(shí)間(CT1)做比較，一旦兩個(gè)周期的差值：

ΔT’=CT2-CT1-T

大于某個(gè)預(yù)設(shè)值S時(shí)就將差值ΔT’加入到ΔT中，即此時(shí)的ΔT = ΔT + ΔT’。之所以需要設(shè)置一個(gè)預(yù)設(shè)值，是因?yàn)槊總€(gè)周期的時(shí)間本身不是固定的，它要依賴于周期函數(shù)的運(yùn)行情況，因此ΔT’并不會(huì)等于0，如果每次都將周期函數(shù)造成的誤差作為CT與ST之間的誤差將會(huì)造成計(jì)算不準(zhǔn)確。而通過Ajax定期獲取服務(wù)器時(shí)間來更新基準(zhǔn)時(shí)間是對(duì)周期函數(shù)的累積誤差進(jìn)行消除。經(jīng)過以上的計(jì)算，用戶修改時(shí)間或手機(jī)鎖屏后將不會(huì)對(duì)計(jì)算結(jié)果產(chǎn)生影響。

4 Ajax在移動(dòng)端APP定時(shí)搶票系統(tǒng)中的應(yīng)用

4.1 設(shè)計(jì)需求

搶票系統(tǒng)要求設(shè)置一個(gè)基準(zhǔn)搶票時(shí)間，客戶端應(yīng)用實(shí)時(shí)的將倒計(jì)時(shí)顯示給用戶，如圖4所示，到達(dá)基準(zhǔn)時(shí)間系統(tǒng)開放可以搶票。由于搶票系統(tǒng)為多終端大并發(fā)量的系統(tǒng)，要求倒計(jì)時(shí)精準(zhǔn)無誤，設(shè)計(jì)系統(tǒng)時(shí)要考慮到3.2節(jié)所涉及的問題。

圖4 UI

4.2 總體設(shè)計(jì)

(1)創(chuàng)建XMLHttpRequest對(duì)象

要實(shí)現(xiàn)網(wǎng)頁(yè)的動(dòng)態(tài)化，Ajax的XMLHttpReques對(duì)象是最為關(guān)鍵的一環(huán)，使用XMLHttpReques對(duì)象可以方便的實(shí)現(xiàn)與服務(wù)器的數(shù)據(jù)交互。

首先判斷瀏覽器類型，因?yàn)闉g覽器版本類型不同，支持的標(biāo)準(zhǔn)不同，要先進(jìn)行兼容性測(cè)試。IE6、IE5支持創(chuàng)建的Ajax對(duì)象為ActiveXObject(“Microsoft.XMLHTTP”)，IE7以上以及 Firefox、Chrome、Opera、Safari瀏覽器都是支持標(biāo)準(zhǔn)規(guī)范創(chuàng)建XMLHttpReques對(duì)象。

if (window.XMLHttpRequest)

{ // code for IE7+，F(xiàn)irefox，Chrome，

//Opera，Safari

xmlhttp=new XMLHttpRequest()；

}

else

{ // code for IE6，IE5

xmlhttp=new

ActiveXObject("Microsoft.XMLHTTP")；

}

(2)發(fā)送請(qǐng)求

通過XMLHttpRequest對(duì)象的open()和send()方法發(fā)送HTTP請(qǐng)求。其中open(Method，Url，Synch)方法有三個(gè)參數(shù)，Method 參數(shù)提供HTTP方法，如POST、GET等，見表1。 Url參數(shù)提供請(qǐng)求的URL地址，可以為絕對(duì)地址也可以為相對(duì)地址。Async參數(shù)為布爾型，指定此請(qǐng)求是否為異步方式，默認(rèn)為true。如果為真，當(dāng)狀態(tài)改變時(shí)會(huì)調(diào)用onreadystatechange屬性指定的回調(diào)函數(shù)。

表1 發(fā)送模式

設(shè)置5000ms鐘讀取一次服務(wù)器時(shí)間，用以消除本地計(jì)時(shí)帶來的誤差。

function GetRTime(){

xmlhttp.open(“GET”，“timeNew.asp”，true)；//

xmlhttp.send()；

}

setInterval(“GetRTime()”，5000)；

(3)端口監(jiān)聽

通過監(jiān)聽XMLHttpRequest對(duì)象的屬性onreadystatechange得出何時(shí)數(shù)據(jù)傳輸完畢，當(dāng)狀態(tài)碼為4時(shí)表示服務(wù)器已經(jīng)傳回所有的信息，Status值為200表示頁(yè)面正常，當(dāng)符合這兩個(gè)條件則接受數(shù)據(jù)。

xmlhttp.onreadystatechange=function()

{ //監(jiān)聽端口

if(xmlhttp.readyState==4&&

xmlhttp.status==200)

{ //接收數(shù)據(jù)并處理

var differentSec=xmlhttp.responseText；

manageTime(differentSec)}}

其他屬性如表2所示。

表2 其他屬性

最后接受到的數(shù)據(jù)通過manageTime()函數(shù)進(jìn)行處理，算法采用3.3節(jié)介紹的時(shí)間補(bǔ)償方法。該方法消除了因修改客戶端時(shí)間或手機(jī)鎖屏而帶來的計(jì)時(shí)問題。

(4)服務(wù)端

服務(wù)器端負(fù)責(zé)響應(yīng)Ajax發(fā)來的基準(zhǔn)時(shí)間請(qǐng)求。由于搶票系統(tǒng)要求實(shí)現(xiàn)預(yù)設(shè)時(shí)間系統(tǒng)

開放，需要在后臺(tái)設(shè)置標(biāo)記文件。當(dāng)票已搶光，標(biāo)記文件修改。

采用Ajax技術(shù)的定時(shí)搶票系統(tǒng)，實(shí)現(xiàn)了客戶端與服務(wù)器進(jìn)行異步交互進(jìn)行時(shí)間同步的目的。由于采用異步交互的方法，Ajax在進(jìn)行數(shù)據(jù)傳輸過程中不會(huì)影響用戶的其他操作，頁(yè)面無需刷新即可準(zhǔn)確的更新時(shí)間。通過設(shè)置時(shí)間差值補(bǔ)償措施，避免了因手機(jī)鎖屏或客戶端時(shí)間修改而造成的倒計(jì)時(shí)錯(cuò)誤。

4.3 實(shí)驗(yàn)及結(jié)果

客戶端采用10臺(tái)不同型號(hào)的IOS和安卓系統(tǒng)手機(jī)，系統(tǒng)開放時(shí)間為下午4：00，后臺(tái)記錄的搶票者信息，順序?yàn)閾屍睍r(shí)間，如圖5所示。

圖5 參加者信息

第一個(gè)進(jìn)入系統(tǒng)號(hào)碼為12211435832的終端成功搶到票，如圖6所示。

圖6 個(gè)人信息

5 總結(jié)

Ajax作為一種Web2.0時(shí)代重要的技術(shù)，在現(xiàn)

代互聯(lián)網(wǎng)應(yīng)用中的使用空間越來越大。本文介紹了Ajax的主要技術(shù)，分析了它的優(yōu)勢(shì)與不足之處。通過對(duì)Ajax技術(shù)的一個(gè)典型應(yīng)用，客戶端服務(wù)器時(shí)間同步問題展開研究，并提出了解決方案。最后通過一個(gè)實(shí)例應(yīng)用——“定時(shí)搶票系統(tǒng)”的設(shè)計(jì)，證明了Ajax技術(shù)的易用性。Ajax技術(shù)終將在現(xiàn)代互聯(lián)網(wǎng)發(fā)展中綻放出璀璨的光芒。

[1]丁娜.基于Ajax的WEB2.0技術(shù)研究[D].浙江大學(xué).2007.

[2]肖斌，汪敏.基于Ajax通信的數(shù)據(jù)傳輸優(yōu)化[J].通信技術(shù)，2011，34(3).

[3]周揚(yáng).Ajax應(yīng)用的典型設(shè)計(jì)模式[J].計(jì)算機(jī)系統(tǒng)應(yīng)用，2011，20(1).

[4]Cristian F.Probabilistic clock synchronization[J].Distributed Computing，1989，3(3)：146-158.

[5]Gusella R，Zatti S.The accuracy of clock synchronization achieved by TEMPO in Berkeley Unix 4.3 BSD[J].IEEE Trans Software Engineering，1989，15(7)：847-853.

[6]Anceaume E，Puaut I.A taxonomy of clock synchronization algorithms[R].Washington：IRISA，1997.

[7]趙英，史莉，張瑩瑩.基于Web Services的網(wǎng)絡(luò)時(shí)間同步[J].北京化工大學(xué)學(xué)報(bào)，2006，32(2).

[8]馮振興.Ajax技術(shù)在Web系統(tǒng)中的應(yīng)用研究[D].北京林業(yè)大學(xué)，2008.

[9]柯昌正，黃厚寬.Ajax技術(shù)的原理與應(yīng)用[J].鐵路計(jì)算機(jī)應(yīng)用，2007，16(1)：27-29.

[10]姜皓文.基于狀態(tài)轉(zhuǎn)換的動(dòng)態(tài)爬蟲系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)[D].中山大學(xué)，2014.

[11]Ajax數(shù)據(jù)庫(kù)實(shí)例[EB/OL].http：//www.w3school.com.cn/ajax/ajax_database.asp，2015.03.

(責(zé)任編輯：王謙)

The Research and Application of Ajax Technology

JING Wei

(School of Information and Engineering，Communication University of China，Beijing 100024，China)

As an important technology which comes from Web2.0 era，Ajax has been used more and more in today’s Internet products.By implementing the way without refreshing updates page，Ajax brings to the users of good experience at the same time reduces the burden of the server and saves bandwidth.The paper concentrates on the problem of countdown in mobile Web application and introduces the key technology of Ajax and analyzes the advantages of the Web site which uses the Ajax technology compared with the traditional Web site.By using the method of Ajax technology and the compensation of time difference in order to update local time without refresh the web page.Through this we can ensure the synchronism of multi terminal system.The design of rob ticket system proves the advantage of Ajax technology further.

Ajax；HTML；asynchronous interaction；time synchronization

2015-04-27

靖?jìng)?1989-)，男(漢族)，天津人，中國(guó)傳媒大學(xué)碩士研究生.E-mail：jingwei610032626@sina.com

TP311

A

1673-4793(2015)06-0050-06