基于JSP技术的在线考试系统的设计与实现

1、基于JSP技术的在线考试系统的设计与实现 -高成珍071202006摘要：随着Internet的迅速发展和广泛普及，数字化教学作为新型的办学模式已逐步走进了高校，它们具有对于教育、教学过程来说极为宝贵的特性，可以为新型办学模式的建构提供理想的环境。基于Web网络考试与无纸化办公一样已成为大势所趋。本文在分析了考试系统的各个环节后，利用当今流行的程序开发集成工具MyEclipse 开发基于JSP技术的在线考试系统。该考试系统采用JSP + Servlet + JDBC +SqlServer2000方式实现。关键词：JSP JDBC 在线考试 登录系统 MVC模式一、引言传统的考试方式是教师出题,

2、学生在指定的时间和地点答题,然后教师改卷的模式,教师负担重,考试成本高。随着Internet技术的发展使得考试的手段和方式发生了根本性的变化。Internet的开放性和分布性的特点以及基于Internet的巨大计算能力使得考试突破了时间和空间的限制，它不仅为老师减轻了评卷，监考之苦，也为学生提供了轻松的考试环境，便于学生发挥出最佳的水平并通过网上评卷能及时反馈学生的掌握情况。二、需求分析网络考试系统是以网络为载体，为学生提供考试服务，并能自动判卷为老师提供考试成绩作为教学参考的软件系统。本考试系统设计为在高校中使用，系统主要针对教学秘书（管理员）、任课教师及学生，能结合高校的院系、专业科目等考

3、试属性进行管理。主要包含三种登录角色即管理员、教师和学生。1、管理员可以进行系统维护，主要用来设置系统的一些初始化信息，如添加课程，教师，学生，班级，为老师分配课程等。维护包括添加、删除、修改三种基本的操作。管理员还兼有老师和学生的功能，可以查询有关学生和老师的相关信息是最大权限的用户，拥有系统的所有功能的权限。 2、教师教师登录系统后，教师可以从自己所教课程中选择一门进行考试试题录入，并可以对自己录入的试题进行修改和删除等操作，但不能修改其他老师关于同一门课程的相关试题。并可以添加所教课程的学生和查询自己所教班级学生的考试成绩信息。3、学生学生登录后可以参加考试，选择一门课程后，系统会自动的

4、抽出一套试题，开始考试后，系统进行倒计时，在规定的时间内考生如果没有交卷，系统会自动帮他交卷，并在考试结束、自动评卷后，学生能及时的查看到自己的考试成绩和答题情况，并可以查询自己以往的考试成绩信息。二、总体设计目前,用于生成动态网页较为流行的技术有Microsoft的ASP、Text的PHP和Sun 公司的JSP。ASP只能工作在微软的IIS和PWS服务器上,一些天生的缺陷使得它们的使用受到了一定的制约,PHP没有提供统一的数据库连接的接口标准而且它的运行环境相对复杂,同时PHP支持的平台也非常有限。而JSP是一种完全与平台无关的新技术,它集极高的运行效率,较短的开发周期,超强的扩展能力,完全

5、开放的技术标准等众多特性于一身,同时它能实现WEB 的动态内容与显示相分离。故本考试系统采用了JSP + Servlet + JDBC +SqlServer2000的方式实现,即MVC模式（Model+View+Controller）。其中SqlServer2000 用于数据存储, JDBC用于连接数据库并对数据库实现各种操作, Servlet作为控制器用于处理过程控制, JSP作为界面层用于页面显示部分。相对于传统的C/S（Client/Server客户端/服务器）模式的考试系统，B/S（Browser/Server浏览器/服务器）模式具有更高的安全性和便捷性，Web网络考试即可以在本地进行

6、，也可以在异地进行，因此本系统采用B /S模式。主要采用了如下的开发工具：Web服务器中间件：Apache-Tomcat6.0Java JDK: J2SDK 1.5数据库：SqlServer2000集成开发工具：MyEclipse 7.0网页制作工具：DreamWeaver CS4浏览器：Internet Explore7.0其总体软件体系结构如下图所示： Internet ExplorerJavaBeanServletDBConnJSPSqlServer 2000 客户端 中间层 数据层 在线考试系统的软件体系结构图客户端通过浏览器向Tomcat服务器发送请求，无论是JSP，还是JavaBe

7、an、Servlet，当需要访问数据库时，都通过一个统一的接口组件DBConn来访问。这样的结构程序层次性比较清晰，比用纯JSP实现的程序可读性和可复用性都会更好。在线考试系统教师修改密码试题管理查询系统学生管理学生修改密码查询系统在线考试网上评卷各角色的功能图如下： 管理员教师管理课程管理学生管理查询系统为教师分配课程为班级开设课程班级管理修改密码在线考试系统各角色功能图虽然各个角色都有查询系统功能，但不同的角色的人查询的权限不同！当然各系统都有登陆模块四、详细设计41数据库设计41.1 ER图在线考试系统ER图具体分析如下图所示： 试题教师课程教师教师教师管理员教师 班级教师学生教师在线考

8、试系统ER图ER图中几点说明：一个教师可以较多门课程，一门课程也可以由多位老师来教，课程和老师之间是多对多的关系；同一专业不同方向的学生所在班级不同，所开设的课程也有所不同；一个老师可以教多个班级，一个班级由多位老师来教；一个班级每学期开设多门课程，一门课程可由多个班级来上，因此课程和班级之间也存在存在多对多的关系；41 2 数据库中表的设计：数据库逻辑结构设计中ER模型向关系模型转换的规则：一个实体类型转换成一个关系模式，实体的属性就是关系的属性，实体的码就是关系的码。一个1:1联系可以转化为一个独立的关系模式，也可以与联系的任意一端实体所对应的关系模式合并。一个1:n联系可以转换为一个独立

9、的关系模式，也可以与联系的n端实体所对应的关系模式合并。一个n:m联系转化为一个关系模式。与该联系相连的各实体的码以及联系本身的属性均转换为关系的属性，而关系的码为各实体码的组合。根据上述转换规则，可得到如下数据表：管理员表（Adminstrator）字段名类型说明备注AIDINT管理员ID号主键，自增，非空A_NameVARCHAR管理员姓名A_PsdVARCHAR管理员密码教师表（Teacher）字段名类型说明备注T_NOVARCHAR教工号主键，非空T_NameVARCHAR教师姓名T_PsdVARCHAR教师密码T_MajorVARCHAR教师专业课程表（Course）字段名类型说明备

10、注C_NOVARCHAR课程号主键，非空C_NameVARCHAR课程名教师课程关系表（Course_Teacher）字段名类型说明备注T_NOVARCHAE教工号外键，非空C_NOVARCHAE课程号外键，非空班级表（Class）字段名类型说明备注Class_NOVARCHAR班级号主键，非空Class_NameVARCHAR班级名Class_MajorVARCHAR所属专业班级课程表（Class_Course）字段名类型说明备注Class_NOVARCHAR班级号外键，非空C_NOVARCHAR课程号外键，非空试题表（Test01）（以选择题为例）字段名类型说明备注Test01_NOINT

11、题号主键，递增，非空Test01_ContentVARCHAR题干Test01_PointVARCHAR知识点Test01_ScoreVARCHAR分值Option_AVARCHAR选项AOption_BVARCHAR选项BOption_CVARCHAR选项COption_DVARCHAR选项DTest01_AnswerVARCHAR答案C_NOVARCHAR所属课程号说明：为了使系统评卷方便，准确，快速，本系统所包含的试题类型仅为单选，判断，填空。由于不同题型的试题选项个数不同，因此，将不同类型的试题放在不同的表中。学生表字段名类型说明备注S_NOVARCHAR学号主键，非空S_NameVA

12、RCHAR学生姓名S_PsdVARCHAR学生密码S_MajorVARCHAR学生专业S_ClassVARCHAR学生班级学生成绩表（Student_Score）字段名类型说明备注S_NOVARCHAR学号外键，非空C_NOVARCHAR课程号外键，非空MarkFLOAT成绩4.2 模块算法4.2.1登陆模块该模块包括index.jsp文件。如果用户要使用为注册用户提供的功能，用户只要输入用户名、密码、学者登陆类型（管理员、教师、学生）就可以了。若用户输入的以上两项与数据库中相应表保存的相符，则表明用户登录成功，可以开放全部前相应的模块；如果不符，则登录失败。模块执行流程如下图4-2-1所示。

13、原代码参见附录B。YesYesNoNoNo按照用户名查询NoYes提示密码错误登录信息录入接收登录信息用户名、密码为空？提示用户不存在已 登 录用户已存在吗口令正确吗？图4-2-1 用户登录模块执行流程提示用户名或密码不能为空注：在录入登陆信息是可以登陆类型，有教师。4.2.2 在线考试模块（学生使用） 该模块模块在以学生方式登陆后跳转：在此模块中包含查询成绩、考试、自动判卷等模块。进入在线考试系统。在线考试试是有时间限定的,学生要先登入自己的用户，用户可以查询成绩、修改密码，再进行在线考试。一旦开始在线考试后，系统就自动开始计时。时间到会自动交卷，然后进入判卷系统。考试过程中学生可以不按题目

14、顺序答题。具体流程如4-2-2所示返回NoNoYesNo学生登录进入考场自动交卷时间结束？考试退出考场自动阅卷显示成绩交卷？交卷？图4-2-2在线考试流程图查询成绩4.2.3 出题模块（教师使用）1试卷管理模块 教师登陆后，可以进行，学生管理，查询所有参考学生成绩，教师用户密码试卷管理模块主要是对试卷进行添加、删除、修改。添加了试卷后可以从题库中加入各种题型。1试卷管理功能模块图试 卷 管 理添 加 试 卷删 除 试 卷修 改 试 卷 2、题库管理模块2.1题库管理功能模块图题库管理包括判断题管理、填空题管理、选择题管理。授课教师可以通过题库管理对各种类型的试题进行添加、删除、修改以及查询。题

15、库管理功能模块图如图4-2所示，由于各种类型试题的管理功能均类似，这里仅以判断题管理为例进行介绍。判断题管理模块包括的操作有：添加判断题、删除判断题、修改判断题和查找判断题,有关判断题管理模块操作的主要源代码参见附录C。判断题管理多选题管理填空题管理题库管理图4-2-3-1 题库管理功能模块图 2判断题管理模块页面流程(图4-2-3-2)返回图4-2-3-2判断题管理页面流程typ.asp type_1.aspType-1-dell.aspPtype1.asp查找判断题学生信息管理模块学生管理模块主要是对学生进行查询、删除，可以对学生的成绩情况进行查看。学生信息管理模块图4.2.4 系统维护模

16、块（管理员模块）五、界面和代码设计由于时间关系，这一部分还未开发，在此省略。六、论文总结在线考试系统是网络教育的重要组成部分，随着Internet的迅速发展，基于Web的网络考试系统将是今后考试系统设计的必然趋势，本系统是基于JSP+Servlet+JDBC+SqlServer2000技术，采用B/S模式开发的网络考试系统，基本满足了在线考试的需求，可以充分发挥网络的优势，建立大型、安全、共享的题库和实现随时随地地考试，从而减轻教师的负担，提高课堂教学质量，具有较好的扩展性，跨平台性和可重用性。但是在本文所设计的考试系统中，对部分题型能很好地实现，比如选择题、填空题、判断题，但是对其他题型还有

17、所欠缺，无法覆盖所有题型。总之，需要改进的地方可能在使用过程中会显露更多，需要进一步努力完善。参考文献 1 吴其庆. JSP编程思想与实践M . 北京:冶金工业出版社, 2003 2 邓子云.张赐. JSP网路编程从基础到实践M . 北京:电子工业出版社, 2006 3 飞思科技产品研发中心. JSP应用开发详解M . 北京:电子工业出版社, 2000 4 刘晓华.陈亚强等编著.J2EE 应用开发详解.电子版.2000 年8 月. 5胡文生.基于JSP技术的在线考试系统的设计和实现 D 贵州商业高等专科学校2008 6张爱文。.基于JSP的在线考试系统的设计和实现 D 黑龙江工程学院2009.

18、5 7萨师煊。王珊。数据库系统概论 M 黑龙江工程学院2009.5附录资料：从 XML 生成可与 Ajax 共同使用的 JSON时下，非常流行使用 JavaScript 代码为数据驱动的 Web 应用程序添加互动性。若能将数据编码成 JavaScript Object Notation（JSON）的格式，您就可以更轻松地通过 JavaScript 语言使用它。通过本文，发掘使用 XSLT V2 从 XML 数据生成 JSON 的几种不同方法。几年前，许多开发人员很看好 XML、XSLT、Extensible HTML （XHTML）和其他一些基于标记的语言。现在，Asynchronous Ja

19、vaScript and XML（AJAX）成了新的热点，人们又将目光转向了使用 JavaScript 代码的数据驱动的富 Internet 应用程序。但是开发人员是否已经消除了 XML 和这一新技术之间的鸿沟呢？当然，您可以在 Web 客户机中使用 XML 解析器来读取数据，但这种做法会带来两个问题。第一，出于安全方面的原因，XML 数据只能从与此页面相同的那个域中读取。这虽然不是什么大的限制因素，但它的确会引起部署方面的问题，还会阻碍 DHTML 小部件的创建。第二，读取和解析 XML 会非常慢。另一种做法是让服务器执行 XML 的解析工作，方法是设置服务器，使之向浏览器发送以 JavaS

20、cript 代码或时下流行的 JavaScript Object Notation（JSON）编码的数据。本文将展示如下三种使用 XSLT V2 语言和 Saxon XSLT V2 处理器从 XML 数据生成 JSON 的技巧： 简单编码 通过函数调用加载数据 编码对象 JSON 简介要学习如何将数据编码成 JSON（它只是 JavaScript 的一个子集），最好的方法是从数据开始。清单 1 显示了书籍列表的一个示例 XML 数据集。清单 1. 基本的图形化图书馆 Code Generation in Action JackHerrington Manning PHP Hacks JackH

21、errington OReilly Podcasting Hacks JackHerrington OReilly 这个数据集很简单，只包含三本书，每本书都具有惟一的 ID、书名、作者姓名及出版商的名字。（没错，我只选择了我自己的书作为数据集，但能怨我吗？这些书实在是不可多得的节日和生日礼物。）清单 2 显示了这些数据在 JSON 中的效果。清单 2. JSON 中的示例数据集 id: 1, title: Code Generation in Action, first: Jack, last: Herrington, publisher: Manning , . 方括号 () 表明这是一个数

22、组。大括号 () 则表明这是一个散列表，该散列表由一组名称和值对组成。在本例中，我创建了一个散列表的数组 用来存储这类结构式数据的一种常见方法。另外一点值得注意的是字符串是通过单引号或双引号被编码的。所以，如果我想用单引号编码 OReilly，我就必须使用反斜杠对它进行转义：OReilly。 这让我编写的这个 XSLT 样式表更为有趣了一些。我并未在本例中放上任何日期，但您也可以通过如下两种方法来编码日期。第一种方法是将日期作为字符串，该字符串必须在后面被解析。第二种方法是将日期作为一个对象，比如：publishdate: new Date( 2006, 6, 16, 17, 45, 0 )这

23、段代码将 publishdate 的值设置为6/16/2006 5:45:00 p.m.。简单编码接下来我将陆续介绍 JSON 编码的几种技巧。第一种也是其中最简单的一种，此样式表如 清单 3 所示。清单 3. simple.xsl 样式表 var g_books = 1, id: ,name: ,first: ,last: ,publisher: ;要理解此样式表，不妨先来看一下 清单 4 所示的输出。清单 4. simple.xsl 的输出var g_books = id: 1,name: Code Generation in Action,first: Jack,last: Herrin

24、gton,publisher: Manning, id: 2,name: PHP Hacks,first: Jack,last: Herrington,publisher: OReilly, id: 3,name: Podcasting Hacks,first: Jack,last: Herrington,publisher: OReilly;这里，我将名为 g_books 的变量设置为一个包含三个散列表的数组，每个散列表包含关于该书的信息。再回过头来看看 清单 3，您会发现第一个模板匹配 / 路径，它也是首先应用到输入数据集的模板，该模板使用 for-each 循环来遍历每本书。之后，它使用

25、 标记来将文本从该数据输出到 JavaScript 输出代码。对于字符串，我使用名为 js:escape() 的定制函数，它在模板之前定义。该函数使用一个正则表达式将一个单引号标记更改为带有反斜杠的单引号标记。最后一个重要的元素是 标记，它告知处理器要输出的是文本而不是 XML。要检验此过程是否可以正常工作，我加入了一个 simple .html 文件，该文件引用我在 simple.js 保存的 XSL 样式表的输出。这个 HTML 文件如 清单 5 所示。清单 5. simple.html 文件Simple JS loaderdocument.write( Found +g_books.le

26、ngth+ books );.html 文件使用 标记简单地加载已编码了的 JavaScript 代码。之后，第二个 标记将数组的长度写出到浏览器页面，如 图 1 所示。图 1. simple.html 的输出好了！数据文件包含三本书，相应的 JavaScript 文件也包含三本书。它真的可以工作！通过函数加载上述第一个示例很简单，而且在大多数情况下可以发挥其作用，但它存在一些问题。第一个问题是对于数据何时被加载没有任何提示。如果数据是像页面那样被静态加载的，这不成问题。但是如果页面动态创建了一个 标记来按需加载数据，那么就很有必要知道 标记是何时完成的。实现此功能的最好的方法是让编码了的数据

27、调用一个 JavaScript 函数，而不是只设置数据。这个概念很重要，所以我将花一些时间来介绍一下为什么您必须要通过动态生成的 标记来加载数据。页面加载后，从服务器获得数据是 Web 2.0 的核心功能。一种方法是使用 AJAX 机制通过到服务器的调用来加载 XML。然而，出于安全性的原因，AJAX 机制只限于从单一域获取数据。这在大多数情况下都没有问题，但有时，您可能需要 JavaScript 代码运行在他人的页面上（例如，Google Maps）。在这种情况下从服务器获得数据的惟一方法是通过动态加载 标记。获悉 标记何时加载的最好的方法是让 标记返回的脚本调用函数而不是简单地加载数据。清

28、单 6 显示了在函数调用中编码的数据。清单 6. Function1.jsAddBooks( id: 1,name: Code Generation in Action,first: Jack,last: Herrington,publisher: Manning, id: 2,name: PHP Hacks,first: Jack,last: Herrington,publisher: OReilly, id: 3,name: Podcasting Hacks,first: Jack,last: Herrington,publisher: OReilly );清单 7 给出了相应的 .htm

29、l 文件。清单 7. Function1.htmlFunction 1 JS loadervar g_books = ;function AddBooks( books ) g_books = books; drawbooks( g_books );稍后将详细介绍 drawbooks 函数。这里重要的是了解一下页面如何定义 AddBooks 函数，该函数随后会由 function1.js 文件中的脚本调用。该 AddBooks 函数负责处理数据。而且被调用的 AddBooks 函数会向页面指示 标记被正确加载，并已加载完成。要创建 function1.js 文件，我只对样式表稍微做了一点修改，

30、如 清单 8 所示。清单 8. function1.xsl 样式表AddBooks( 1, id: ,name: ,first: ,last: ,publisher: );这里，我调用了一个函数，而不是简单地设置一个变量。这就是我所做的惟一更改。回到页面，我使用了 drawbooks 函数来构建书的表格，这样我就能够确认数据被正确编码和正确显示。此函数是在 drawbooks.js 内定义的，如 清单 9 所示。清单 9. Drawbooks.jsfunction drawbooks( books ) var elTable = document.createElement( table );

31、 for( var b in books ) var elTR = elTable.insertRow( -1 ); var elTD1 = elTR.insertCell( -1 ); elTD1.appendChild( document.createTextNode( booksb.id ) ); var elTD2 = elTR.insertCell( -1 ); elTD2.appendChild( document.createTextNode( ) ); var elTD3 = elTR.insertCell( -1 ); elTD3.appendChil

32、d( document.createTextNode( booksb.first ) ); var elTD4 = elTR.insertCell( -1 ); elTD4.appendChild( document.createTextNode( booksb.last ) ); var elTD5 = elTR.insertCell( -1 ); elTD5.appendChild( document.createTextNode( booksb.publisher ) ); document.body.appendChild( elTable );这个简单函数创建了一个表格节点，然后循环

33、访问书的列表并为每本书创建一行，为每个数据元素分配一个单元格。此页面上的代码的结果如 图 2 所示。图 2. function1.html 的结果现在我就可以查看一下此页面的输出并确认来自原始 .xml 文件的一切均已被正确转换成 JavaScript 代码，且数据被发送到 AddData 函数并被正确添加到页面。细化函数调用技术我很喜欢函数调用这一技术，但我并不赞同将所有图书数据都放入一个块中。另一种方式是为每条记录采用一个调用，如 清单 10 所示。清单 10. Function2.jsAddBook( id: 1,name: Code Generation in Action,first

34、: Jack,last: Herrington,publisher: Manning );AddBook( id: 2,name: PHP Hacks,first: Jack,last: Herrington,publisher: OReilly );.对 .html 页面只需做少许修改，如 清单 11 所示。清单 11. Function2.html.var g_books = ;function AddBook( book ) g_books.push( book ); .这里更改了 XSLT，以使函数调用驻留在 for-each 循环体内。清单 12 显示了更新后的样式表。清单 12.

35、function2.xsl.AddBook( id: ,name: ,first: ,last: ,publisher: );.对这个给定示例来说，这种更改看起来有些随意。但如果原始的 XML 数据集有多种数据类型，要为每种类型分配一个单独的函数调用会使 XSL 和页面上的 JavaScript 代码更为简单、更易于维护。编码对象对小的页面来讲，使用 JavaScript 函数没有问题。但对于大型项目，就需要使用 JavaScript 语言的一些面向对象特性。是的，JavaScript 语言可以处理对象而且可以处理得很好。清单 13 显示了如何创建带有数据的对象。清单 13. Object1.

36、jsg_books.push( new Book( id: 1,name: Code Generation in Action,first: Jack,last: Herrington,publisher: Manning ) );g_books.push( new Book( id: 2,name: PHP Hacks,first: Jack,last: Herrington,publisher: OReilly ) );在本例中，我只简单地向名为 g_books 的数组添加了 Book 对象。JavaScript 的对象创建与 Java、C# 或 C+ 编程语言的对象创建十分相似。都是一个

37、 new 操作符后跟一个类名。参数放到随后的括号内。在本例中，我传入了一个带值的单一散列表，并将其分割成单独的一些参数。创建此对象的代码如 清单 14 所示。清单 14. Object1.xslg_books.push( new Book( id: ,name: ,first: ,last: ,publisher: ) );此页面内最值得注意的是定义 Book 类的那部分代码。清单 15 显示了该页面。清单 15. object1.html.var g_books = ;function Book( data ) for( var d in data ) thisd = datad; .Book 类的构造函数循环访问散列表的所有数据。对于每个键，会在对象上创建一个具有对象名称和数据的实例变量。不需要对 drawbooks 函数做任何