AJA技术提升WEB考试系统论文

时间:2022-03-04 08:18:00

AJA技术提升WEB考试系统论文

一、引言

Ajax是AsynchronousjavascriptandXML(以及DHTML等)的缩写。它由几种技术组合而成,包括:基于XHTML和CSS标准的表示;使用DocumentObjectModel进行动态显示和交互;使用XMLHttpRequest与服务器进行异步通信;使用javascript进行绑定。

传统的Web应用程序强制用户进入提交、等待、重新显示的模式,即用户的界面操作触发HTTP请求,服务器在接收到请求之后进行业务逻辑处理,比如保存数据,然后向客户端返回一个HTML页面。但服务器处理数据的时候,用户处于等待的状态,每一步操作都需要等待,使得Web用户界面在响应灵敏性方面大打折扣。而Ajax带给用户完全不同的浏览感受。传统的动态网页技术被隐藏到Ajax的后台。用户所看到的只是一个静态页面,不需要在提交页面后等待或者主动刷新网页。动态程序反馈的结果被直接无刷新地显示在这个页面上。因此利用Ajax开发的Web应用程序能够提供响应极其灵敏的Web用户界面,使得应用过程很自然,操作很流畅,并消除了页面刷新所带来的闪烁。

二、系统的设计与实现

(一)系统设计

在用户登录进考试系统时,将登录时间按用户ID存入session变量中,以便对每个用户实现计时。

用户登录后,利用Ajax技术在后台实现计时功能,由javascript定时向服务器查询考试时间并实时显示在用户的WEB页面上。考试时间可在JSP的配置文件中给出,计时器到规定时间后如用户还未提交试卷,则由系统自动提交。

用户考试过程中,利用Ajax技术由JavaScr-ipt代码在后台为用户定时存盘,一旦系统出现故障,再次进入考试系统时,可根据保存的信息在故障点处继续进行考试,原来考试的信息可以从服务器端一次性加载。

试卷的形式可以采用一页一题的方式,也可采用一页多题的方式。用户在答题时,系统在后台为用户预先从服务器端读取下一段的试题,当用户需要下一段试题时,可以很快从客户端直接加载,而不需要用户等待服务器端的数据,实现无闪烁、无延迟的效果。

Ajax采用的是一种沙箱安全模型,Ajax代码(具体而言即XMLHttpRequest对象)只能对所在的同一个域发送请求,在本地机器上运行的代码只能对本地机器上的服务器端脚本发送请求。虽然上述功能的实现都是基于客户端脚本,对于用户来说是可见的,但是Ajax的沙箱安全模型保证了只有来自考试服务器端的客户端脚本才可以与服务器通信,同时服务器端也只接受有访问信息的客户端的请求(通过session等技术)。所以该改进方案保证了考试系统的准确性。

(二)系统的实现

1、XMLHttpRequest对象。目前主流浏览器均支持XMLHttpRequest对象,但不同的浏览器对该对象的声明各不相同,为了使得系统具有通用性,要对不同情况加以区分。本文将该功能直接写在xmlhttp.js文件中,具体实现请参考文献。XMLHttpRequest对象的各种方法和属性请参考MSXML5.0SDK或其他相关文档。

2、时间控制系统的实现。首先在服务器数据库的考生表中设置“答卷时间”字段,用于记录考生剩余考试时间。该字段值在考试过程中会以每分钟减一的频率被改写,并在半分钟之内回显给考生,当该字段值减为零或以下时系统自动交卷,结束考试。在计时器的设计上,以.NET系统自带的Timers.Timer组件为基础进行了自定义设计。在Global.asax文件中生成并启动自定义计时器,由调用者订阅其发出的一分钟一次的事件,并将自身注册为监听Global.timed的监听者。这样,Global.timed每次触发事件时,注册者相应函数内的时间更新功能就会被执行,从而达到考生表中“答卷时间”字段值每分钟自动减一的功能。由于NET中的Timers.Timer组件是基于服务器的,并为在多线程环境中用于辅助线程而设计的,服务器计时器可以在线程间移动来处理引发的Elapsed事件,这样就可以比Windows计时器更精确地按时引发事件。在客户端向服务器端请求时间时,要根据XMLHttpRequest对象的HTTP状态码来操作;在服务器端,必须将“Cache-Control”头设为“no-Cache”来保证每次取得的数据都不是从缓存中得到的。下面是计时器的一段示例代码。

客户端:

<scriptlanguage="javascript"src="xmlhttp.js"></script>

<scriptlanguage="javascript">

functionclockFun(){

varurl="TestTime.jsp";

xmlhttp.open

("get",url,true);//lxmlhttp对象在xmlhttp.js中声明;

xmlhttp.onreadystatechange=function(){//指定服务器返回信息时客户端的处理程序

if(xmlhttp.readyState==4){

if(xmlhttp.status==200){//http的状态码

document.getElementById("clock").innerHTML=xmlhttp.responseText;}}}

xmlhttp.send(null);}//发送请求到http服务器

functiontimer(){//计时器

window.setInterval(''''clockFun()'''',1000);}

</script>

服务器端(TestTime.jsp)

Calendar

beginTestTime=CalendargetInstance();

beginTestTime.set(……);//省略号处为登录时间;

long

beginTime=beginTestTime.getTimeInMillis();

long

nowTime=Calendar.getInstance().

get''''TimeInMillis();//获取当前时间

response.setHeader("Cache-Control","no-cache");//数据不缓存

longhasTime=nowTime-beginTime;

//如用倒计时,此处要用总时长来减去此值;

response.getWriter().write((newLong(hasTime/60000)).toString}+":"+(newLong((hasTime%60000)/1000)).toString});//以文本方式返回时间response.getWriter().flush();

3、试卷的定时存盘和预读试卷数据的实现。这两种功能的实现也采用Ajax技术,只是由于请求的数据量比计时器的数据量大,所以请求时采用“POST”方法。同时要求数据以xml格式返回,在客户端利用DOM的强大功能来实现对数据的操作。用“POST”,方法请求数据时客户端要添加Request头,xmlhttp.setRequestHeader("Content-type","applicatior/x-www-form-urlencoded");服务器端以xml格式返回数据时要设置Response响应头response..setContentType("text/xml"};这样返回客户端的数据才能以xml格式返回。

(三)系统测试

该系统测试的客户端为InternetExplore6.0和FireFox1.0,服务器端为Windows2003和RedHatAS4+JDK1.5+Tomcat5.5.9,网络环境为服务器在教育网内,客户机在局域网内和远程电信网。系统在局域网内部和广域网上的测试均达到了预期效果。

三、结束语

本文利用Ajax技术改进现有的网上考试系统,实现了在线考试的B/S系统,使其达到了C/S系统所具有的功能,同时兼备了B/S系统固有的优势,即能实现用户的网上在线考试的功能,又不需要用户安装额外的客户端软件。新的考试系统具有准确计时、快捷、安全、方便等优点,从根本上改变了原有网上考试系统的多种弊端。