基于ＡＪＡＸ技術(shù)的網(wǎng)上考試系統(tǒng)的改進(jìn)

文章編號：1672-5913(2008)06-0115-02

摘要：本文介紹了一個(gè)用AJAX技術(shù)改進(jìn)的網(wǎng)上考試系統(tǒng)，不但拉近了與傳統(tǒng)考試形式的距離，而且基本符合傳統(tǒng)考試系統(tǒng)的要求，具有一定的實(shí)用性。

關(guān)鍵詞：網(wǎng)上考試系統(tǒng); B/S模式;C/S模式;AJAX技術(shù);異步交互

中圖分類號：TP311

文獻(xiàn)標(biāo)識(shí)碼：B

引言

網(wǎng)上考試系統(tǒng)在目前高校進(jìn)行數(shù)字化校園建設(shè)中占有重要的地位。傳統(tǒng)考試形式中的一些特殊要求影響著網(wǎng)上考試系統(tǒng)的實(shí)施，能否設(shè)計(jì)出與傳統(tǒng)考試要求相匹配的軟件是一個(gè)嚴(yán)峻挑戰(zhàn)。

1現(xiàn)有網(wǎng)上考試系統(tǒng)的分析

現(xiàn)有的網(wǎng)上考試系統(tǒng)在設(shè)計(jì)時(shí)通常采用兩種模式。第一種模式通常采用C/S(客戶端/服務(wù)器)模式，特點(diǎn)是易恢復(fù)現(xiàn)場并能準(zhǔn)確計(jì)時(shí)。雖然這是網(wǎng)上考試系統(tǒng)兩個(gè)重要的要求，但這種模式的致命缺點(diǎn)是不易升級，且可移植性也較差，所以現(xiàn)在基本已不考慮。第二種模式稱作B/S(瀏覽器/服務(wù)器)模式，目前網(wǎng)上應(yīng)用程序設(shè)計(jì)常采用這種模式，不但具有良好的易維護(hù)、易升級性，還具有良好的易移植性。但由于現(xiàn)有大多數(shù)都是基于傳統(tǒng)Web的編程方法，所以還隱藏著一些問題。

1.1客戶端的響應(yīng)速度問題

當(dāng)每次客戶端(考生或監(jiān)考教師)按頁面要求輸入登錄信息后，傳統(tǒng)的Web應(yīng)用系統(tǒng)都將強(qiáng)制用戶進(jìn)行提交、等待直到重新顯示頁面為止，而且這種操作可能要進(jìn)行多次，每次都要經(jīng)過服務(wù)器觸發(fā)HTTP請求，再進(jìn)行業(yè)務(wù)邏輯處理后，才能把新的頁面送給客戶端。這就是傳統(tǒng)Web的客戶端用戶感覺到頁面響應(yīng)速度較慢的原因。

1.2現(xiàn)場數(shù)據(jù)處理問題

在網(wǎng)上考試過程中，有時(shí)會(huì)遇到斷電、死機(jī)、操作不當(dāng)?shù)纫馔馇闆r，這時(shí)需要考生或教師幫助學(xué)生進(jìn)行二次登錄，繼續(xù)答卷。另外有時(shí)監(jiān)考教師需要二次登錄對不能正常交卷的學(xué)生重新提交試卷，這時(shí)要求網(wǎng)上考試系統(tǒng)要很快恢復(fù)現(xiàn)場。過去的處理方法是：考生將所答試題的答案通過刷新頁面或提交試卷，將數(shù)據(jù)立即保存到服務(wù)器中去，這時(shí)即使發(fā)生意外導(dǎo)致考試中斷，也可以從服務(wù)器中重新獲取保存過的數(shù)據(jù)，幫助學(xué)生繼續(xù)考試，但這會(huì)致使考試頁面頻繁刷新，影響考生的答題速度。如何使得B/S程序結(jié)構(gòu)也完全擁有C/S程序結(jié)構(gòu)那樣對于歷史數(shù)據(jù)處理的靈活性呢？可以采用AJAX技術(shù)來解決這一問題。

1.3數(shù)據(jù)流量與瓶頸問題

在考生較多的現(xiàn)場，當(dāng)考生同時(shí)登錄考試頁面時(shí)，由于瞬間給后臺(tái)數(shù)據(jù)庫訪問造成較大壓力，考生感覺登錄較慢，這是因?yàn)樵谝欢◣捈s束下出現(xiàn)較大的并發(fā)訪問時(shí)，必然會(huì)降低訪問速度。對于這種“瓶頸”現(xiàn)象，過去通常有兩種解決方案：一是硬件投入增加帶寬，二是控制訪問量，即讓考生分組分場次考試。然而如何在提高訪問量的同時(shí)能夠節(jié)省帶寬，使訪問速度不至于明顯降低，成為網(wǎng)站建設(shè)者關(guān)注的重點(diǎn)。這個(gè)難點(diǎn)的解決方案也是AJAX技術(shù)。

2AJAX技術(shù)的優(yōu)勢

AJAX打破了使用頁面重載的慣例技術(shù)組合。它包括XHTML和CSS技術(shù)、DOM技術(shù)、XML和XSTL技術(shù)、XMLHttpRequestt對象及JavaScript技術(shù)等。使用了AJAX技術(shù)后，大大減輕了服務(wù)器的負(fù)擔(dān)并顯著提高了Web應(yīng)用程序的工作效率。另外使用AJAX還可以將傳統(tǒng)的Web界面轉(zhuǎn)化成交互性的AJAX應(yīng)用程序，使系統(tǒng)具有較強(qiáng)的可用性。

通過一段時(shí)間的實(shí)踐，我們看到了AJAX應(yīng)用程序的優(yōu)勢。通過異步模式提升了用戶的體驗(yàn)，優(yōu)化了瀏覽器和服務(wù)器之間的傳輸，減少了不必要的數(shù)據(jù)往返，同時(shí)也減少了網(wǎng)絡(luò)帶寬的占用。AJAX引擎在客戶端運(yùn)行時(shí)承擔(dān)了一部分本來由服務(wù)器承擔(dān)的工作，從而降低了大用戶量下的服務(wù)器負(fù)載。在同等網(wǎng)絡(luò)環(huán)境下，頁面響應(yīng)時(shí)間最高減少90％。

3對網(wǎng)上考試系統(tǒng)的改進(jìn)

針對網(wǎng)上考試系統(tǒng)頁面交互多、頻繁讀取服務(wù)器數(shù)據(jù)的特點(diǎn)，我們決定引入AJAX技術(shù)，利用AJAX技術(shù)的異步通訊能力來增強(qiáng)頁面的交互性，提高系統(tǒng)效率。

3.1解決客戶端的響應(yīng)速度問題

原系統(tǒng)影響客戶端速度大致有兩個(gè)地方：一是學(xué)生登錄系統(tǒng)時(shí)，二是學(xué)生在答題過程中進(jìn)行試題選擇或?qū)W生保存試卷與提交試卷時(shí)。AJAX技術(shù)可以讓客戶端用戶從“請求/響應(yīng)”的循環(huán)中解脫出來，用戶只需向服務(wù)器提交刷新頁面所需的部分?jǐn)?shù)據(jù)，而服務(wù)器響應(yīng)后刷新的也僅僅是頁面中需要更新的那部分?jǐn)?shù)據(jù)。以學(xué)生登錄網(wǎng)上考試系統(tǒng)頁面為例，圖1中展示的就是快速登錄網(wǎng)上考試系統(tǒng)的內(nèi)部工作流程圖。

其中index.html是用戶最初的請求文件；zhjwglxt.js是JavaScript腳本文件，它在客戶端載入index.html的時(shí)候被一同載入，負(fù)責(zé)在需要服務(wù)器功能時(shí)向服務(wù)器端發(fā)送異步請求；zhjwglxt.php是服務(wù)器端的PHP腳本文件，它被客戶端的zhjwglxt.js的JavaScript代碼調(diào)用。

3.2解決現(xiàn)場數(shù)據(jù)處理問題

網(wǎng)上考試系統(tǒng)的現(xiàn)場的數(shù)據(jù)主要包括試卷中各類試題的學(xué)生答案等。如何保存好網(wǎng)上考試中學(xué)生答卷時(shí)的現(xiàn)場數(shù)據(jù)是非常重要的，利用AJAX技術(shù)的解決方案如下：

(1) 用戶控件的自定義

根椐AJAX的基本原理，我們首先在系統(tǒng)中自定義一個(gè)用戶控件ExamAnswer，它的后臺(tái)邏輯代碼主要實(shí)現(xiàn)兩方面功能：一是把考生的現(xiàn)場試題答案實(shí)時(shí)存入服務(wù)器中，二是從服務(wù)器上讀取考試時(shí)間和學(xué)生交卷標(biāo)志來判斷考試是否結(jié)束。若考試未結(jié)束，則把服務(wù)器上的考試時(shí)間發(fā)給客戶端，在Web頁面的指定位置顯示考試時(shí)間已到或考生已交卷提示，并計(jì)算出客觀題得分存入服務(wù)器中。

(2) 答題系統(tǒng)的實(shí)現(xiàn)

以學(xué)生答題過程為例。首先定義一個(gè)ExamHelp.js，當(dāng)學(xué)生成功抽取試題后，系統(tǒng)會(huì)將試題顯示到考生試題頁面的指定位置上，而系統(tǒng)對于考試中不同的題型采用不同的方法進(jìn)行保存。通常情況下，考題一般分為主觀題和客觀題兩種形式。

如果是客觀題，比如單選題，保存考生答案的方法是：每個(gè)單選題的備選答案都有一個(gè)選項(xiàng)按鈕，當(dāng)考生單擊鼠標(biāo)左鍵選擇某項(xiàng)時(shí)，觸發(fā)該單選按鈕OnClick事件，隨即調(diào)用ExamHelp.js腳本文件中定義的Update函數(shù)，將當(dāng)前題號和答案作為參數(shù)一起傳遞給后臺(tái)的Answer.php模塊，將答案存入到服務(wù)器試題的答案表中。

如果是填空題，則在每道題后面加入一個(gè)文本框供考生輸入答案，當(dāng)輸入焦點(diǎn)離開文本框時(shí)即觸發(fā)文本框的相關(guān)事件去調(diào)用Update函數(shù)，將題號和文本框中的內(nèi)容(即答案)一起傳給后臺(tái)的Answer.php模塊，也同樣存入服務(wù)器試題答案表中。其他題型的顯示和答案的保存與此相仿。在考生答題頁面的服務(wù)器端，只需把抽取的試題從服務(wù)器的數(shù)據(jù)庫中取出即可。

3.3解決數(shù)據(jù)流量與瓶頸問題

對于流量瓶頸問題，AJAX的解決方法是利用AJAX類的方法完全把加載解析XML的操作放到客戶端進(jìn)行，只對網(wǎng)頁進(jìn)行局部刷新，無需重新傳送不變的內(nèi)容，這樣就大大減少了傳送的數(shù)據(jù)量，從而大大提高了用戶瀏覽數(shù)據(jù)的速度。實(shí)驗(yàn)證明，可以用以下公式來計(jì)算AJAX技術(shù)節(jié)省的帶寬：

(交互次數(shù)*(刷頁交互流量一AJAX交互量)一(AJAX版首次加增加量))/(刷頁*交互次數(shù)+首次加載頁面大小)

根據(jù)上述公式我們可以得出以下的結(jié)論：AJAX技術(shù)的交互只刷新部分?jǐn)?shù)據(jù)，需要的帶寬為2~3K，而傳統(tǒng)整頁刷新模式需要20~30K左右的帶寬。交互次數(shù)越多，AJAX應(yīng)用的帶寬節(jié)省效果越明顯。我們使用網(wǎng)絡(luò)流量測試工具對考試系統(tǒng)傳輸過程進(jìn)行測試，結(jié)果表明考試抽卷過程使用傳統(tǒng)方式數(shù)據(jù)流量為32K，使用AJAX方式只有17K；答題過程使用傳統(tǒng)方式每次提交產(chǎn)生的數(shù)據(jù)交互量為26K，使用AJAX方式為2.3K。試驗(yàn)表明，AJAX技術(shù)總計(jì)節(jié)省數(shù)據(jù)流量可以達(dá)到50%以上。

但是并不是所有的Web頁面都適合使用AJAX技術(shù)，例如在一些Web頁面中如果使用Session進(jìn)行參數(shù)傳遞時(shí)，使用AJAX技術(shù)就容易出錯(cuò)，這些都需要開發(fā)人員特別注意。

4改進(jìn)后的測試

網(wǎng)上考試系統(tǒng)在測試過程中，客戶端采用的是Internet Explore 6.0以上版本及FireFox 1.0以上版本，服務(wù)器端采用是Windows 2003和PHP+MySQL，網(wǎng)絡(luò)環(huán)境為服務(wù)器與客戶機(jī)都在局域網(wǎng)內(nèi)，測試結(jié)果達(dá)到了預(yù)期效果。

參考文獻(xiàn)

[1] 曹衍龍，葉達(dá)峰. Ajax編程技術(shù)與實(shí)例[M]. 北京:人民郵電出版社，2007:5-15.

[2] 王德民等譯. Ajax與PHP Web開發(fā)[M]. 北京:人民郵電出版社，2007:1-22.

[3] (澳) Luke Welling， Laura Thomson著. 武欣，邵煜等譯. PHP和MySQL Web開發(fā)[M]. 北京:機(jī)械工業(yè)出版社，2006:115-157.