劉風(fēng)華,王愛民
(新疆工程學(xué)院 計算機工程系,新疆 烏魯木齊830091)
隨著Internet技術(shù)的興起,B/S結(jié)構(gòu)得到了大規(guī)模應(yīng)用。但是傳統(tǒng)Web存在不足之處[1]:(1)獨占式請求。如果前一個請求沒有得到完全響應(yīng),后一個請求則不能發(fā)送。在等待服務(wù)器響應(yīng)期間,用戶的瀏覽器是一片空白。(2)刷新頻繁。傳統(tǒng)Web應(yīng)用基本上都采用請求-頁面的對應(yīng)模式,每個請求都需要丟棄當(dāng)前頁面,重新加載新頁面。頻繁的頁面刷新不僅讓用戶處于不連續(xù)的體驗中,也讓服務(wù)器的負(fù)擔(dān)加重。
Ajax[2](Asynchronous javascript and XML)為彌補以上不足而誕生,它使用XMLHttpRequest對象異步發(fā)送請求,發(fā)送請求不需要重新加載頁面。瀏覽器發(fā)送請求后,無需等待服務(wù)器響應(yīng),而可以繼續(xù)原來的操作。當(dāng)服務(wù)器的響應(yīng)完成后,客戶端使用JavaScript函數(shù)將相應(yīng)數(shù)據(jù)加載到瀏覽器中。通過使用Ajax技術(shù),用戶發(fā)送請求并得到響應(yīng)的過程在后臺進(jìn)行,用戶的界面以連續(xù)的方式響應(yīng)。Ajax技術(shù)特別適用于交互較多、頻繁讀數(shù)據(jù)、數(shù)據(jù)分類良好的Web應(yīng)用。使用Ajax技術(shù)有以下兩個優(yōu)勢[1]:(1)無刷新更新頁面給用戶更好的體驗;(2)Ajax技術(shù)可以將傳統(tǒng)的服務(wù)器工作轉(zhuǎn)嫁到客戶端,從而減輕服務(wù)器和帶寬的負(fù)擔(dān),節(jié)約空間和帶寬租用成本。
在各種管理系統(tǒng)的開發(fā)中,用戶信息驗證是一個必然環(huán)節(jié)。在B/S模式的系統(tǒng)中,用戶訪問量大,數(shù)據(jù)交換頻繁,這就要求服務(wù)器能夠快速響應(yīng)用戶請求才能適應(yīng)新的發(fā)展。為了使用戶感覺界面響應(yīng)連續(xù),在登錄界面設(shè)計中結(jié)合 Ajax技術(shù)[3],通過 JavaScript的方式,將前臺數(shù)據(jù)通過XMLHttp對象傳遞到后臺;后臺在接收到請求后,將需要的結(jié)果再傳回到前臺,這樣就可以實現(xiàn)不需要頁面的回發(fā),使整個過程在同一個頁面中完成,實現(xiàn)了頁面的無刷新。
圖1 系統(tǒng)登錄模塊流程圖
以登錄到畢業(yè)生管理系統(tǒng)為例,圖1為系統(tǒng)登錄模塊流程圖,其中登錄和注冊要與后臺數(shù)據(jù)庫進(jìn)行交互。為了使用戶體驗更好,在開發(fā)中采用了Ajax 技 術(shù)[4]。
首先是驗證信息,注冊用戶首先輸入學(xué)號和姓名,查看是否有該生,從圖2中可以看出頁面沒有刷新,數(shù)據(jù)得到驗證。
實現(xiàn)的主要代碼:
當(dāng)系統(tǒng)驗證該用戶存在時,允許用戶注冊登陸的用戶名和密碼,從信息驗證到用戶注冊,頁面依然沒有更新,界面如圖3所示。
實現(xiàn)的主要代碼:
為了進(jìn)一步測試系統(tǒng)中使用Ajax技術(shù)對Web視圖層的影響,在登錄界面中對使用Ajax技術(shù)前和使用了Ajax技術(shù)后的頁面做了實驗分析。實驗的主要目的是對比分析Jsp和Ajax分別實現(xiàn)Web系統(tǒng)視圖層時,系統(tǒng)響應(yīng)時間的差異。從而得到使用Ajax后系統(tǒng)響應(yīng)時間上的變化,以此證明系統(tǒng)中使用Ajax技術(shù)的優(yōu)勢。
實驗過程中,系統(tǒng)中Jsp和Ajax實現(xiàn)視圖層的算法與邏輯過程一致。實驗測試環(huán)境如表1所示。
表1 實驗環(huán)境配置
WebServer Stress Tool 7.0是經(jīng)典的網(wǎng)站壓力測試工具,可以使用該工具對實驗系統(tǒng)模擬不同條件下的壓力測試,得出試驗系統(tǒng)的性能參數(shù),供測試人員分析系統(tǒng)性能。為了驗證使用Ajax技術(shù)是否能提高系統(tǒng)響應(yīng)速度而對系統(tǒng)進(jìn)行了測試,測試條件約定測試時間為1min、用戶隨機訪問時間為0~10s,測試結(jié)果如表2所示。
表2 不同數(shù)量的用戶的登錄頁面壓力測試結(jié)果
從表2中的測試數(shù)據(jù)可以看出,當(dāng)用戶數(shù)量增多時,使用Ajax技術(shù)的頁面平均響應(yīng)時間低于未使用A-jax技術(shù)的頁面,也就是說在相同數(shù)量用戶訪問頁面時,使用Ajax技術(shù)后頁面的響應(yīng)速度更快,降低了用戶的等待時間。為了更加直觀地對比使用Ajax技術(shù)和未使用Ajax技術(shù)的網(wǎng)頁的平均響應(yīng)時間,做出了相同模擬用戶下頁面的平均響應(yīng)時間對比圖,如圖4所示。
測試結(jié)果表明,當(dāng)?shù)卿浻脩舨粩嘣黾訒r,Ajax界面比Jsp界面響應(yīng)時間更快。原因是Jsp頁面由HTML代碼和嵌入其中的 Java代碼組成,Ajax是將 JavaScript、XML、CSS以及瀏覽器和服務(wù)器之間的異步通信通道重新集合,形成一種新的Web技術(shù),因此,系統(tǒng)采用Ajax技術(shù)可以提高用戶響應(yīng)速度,加上Ajax的無刷新技術(shù),可以帶給用戶更好的體驗。
圖4 為相同模擬用戶下頁面的平均響應(yīng)時間對比圖
本文介紹了Ajax技術(shù),并在系統(tǒng)登錄中采用Ajax技術(shù)進(jìn)行了測試,結(jié)果表明系統(tǒng)中使用Ajax技術(shù)可以提高用戶響應(yīng)速度,加上Ajax的無刷新技術(shù),可以帶給用戶更好的體驗。
[1]曹衍龍,葉達(dá)峰.Ajax編程技術(shù)與實例[M].北京:人民郵電出版社,2007.
[2]RyanAsleson NathanielTSchutta.Ajax 基礎(chǔ)教程[M].北京:人民郵電出版社,2006.
[3]GEHFLAND J,GALBRAITH B,ALMAER D.Ajax修煉之道 —Web2.0 入 門[M].徐 鋒,胡 泳,譯.北 京:電 子 工 業(yè) 出 版社,2006:102-134.
[4]施偉偉,張蓓.征服Ajax:Web2.0快速入門與項目實踐(.NET)[M].北京:人民郵電出版社,2006:103-112.