基于ＡＪＡＸ技術的網上考試系統的改進

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

摘要：本文介紹了一個用AJAX技術改進的網上考試系統，不但拉近了與傳統考試形式的距離，而且基本符合傳統考試系統的要求，具有一定的實用性。

關鍵詞：網上考試系統; B/S模式;C/S模式;AJAX技術;異步交互

中圖分類號：TP311

文獻標識碼：B

引言

網上考試系統在目前高校進行數字化校園建設中占有重要的地位。傳統考試形式中的一些特殊要求影響著網上考試系統的實施，能否設計出與傳統考試要求相匹配的軟件是一個嚴峻挑戰。

1現有網上考試系統的分析

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

1.1客戶端的響應速度問題

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

1.2現場數據處理問題

在網上考試過程中，有時會遇到斷電、死機、操作不當等意外情況，這時需要考生或教師幫助學生進行二次登錄，繼續答卷。另外有時監考教師需要二次登錄對不能正常交卷的學生重新提交試卷，這時要求網上考試系統要很快恢復現場。過去的處理方法是：考生將所答試題的答案通過刷新頁面或提交試卷，將數據立即保存到服務器中去，這時即使發生意外導致考試中斷，也可以從服務器中重新獲取保存過的數據，幫助學生繼續考試，但這會致使考試頁面頻繁刷新，影響考生的答題速度。如何使得B/S程序結構也完全擁有C/S程序結構那樣對于歷史數據處理的靈活性呢？可以采用AJAX技術來解決這一問題。

1.3數據流量與瓶頸問題

在考生較多的現場，當考生同時登錄考試頁面時，由于瞬間給后臺數據庫訪問造成較大壓力，考生感覺登錄較慢，這是因為在一定帶寬約束下出現較大的并發訪問時，必然會降低訪問速度。對于這種“瓶頸”現象，過去通常有兩種解決方案：一是硬件投入增加帶寬，二是控制訪問量，即讓考生分組分場次考試。然而如何在提高訪問量的同時能夠節省帶寬，使訪問速度不至于明顯降低，成為網站建設者關注的重點。這個難點的解決方案也是AJAX技術。

2AJAX技術的優勢

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

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

3對網上考試系統的改進

針對網上考試系統頁面交互多、頻繁讀取服務器數據的特點，我們決定引入AJAX技術，利用AJAX技術的異步通訊能力來增強頁面的交互性，提高系統效率。

3.1解決客戶端的響應速度問題

原系統影響客戶端速度大致有兩個地方：一是學生登錄系統時，二是學生在答題過程中進行試題選擇或學生保存試卷與提交試卷時。AJAX技術可以讓客戶端用戶從“請求/響應”的循環中解脫出來，用戶只需向服務器提交刷新頁面所需的部分數據，而服務器響應后刷新的也僅僅是頁面中需要更新的那部分數據。以學生登錄網上考試系統頁面為例，圖1中展示的就是快速登錄網上考試系統的內部工作流程圖。

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

3.2解決現場數據處理問題

網上考試系統的現場的數據主要包括試卷中各類試題的學生答案等。如何保存好網上考試中學生答卷時的現場數據是非常重要的，利用AJAX技術的解決方案如下：

(1) 用戶控件的自定義

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

(2) 答題系統的實現

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

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

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

3.3解決數據流量與瓶頸問題

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

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

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

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

4改進后的測試

網上考試系統在測試過程中，客戶端采用的是Internet Explore 6.0以上版本及FireFox 1.0以上版本，服務器端采用是Windows 2003和PHP+MySQL，網絡環境為服務器與客戶機都在局域網內，測試結果達到了預期效果。

參考文獻

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

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

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