基于web的通用精品课程网站系统的设计与实现.doc

1、Design and Implementation of Common High-quality Course Website System Based on WebAbstract: The establishment of High-Quality Course is an important element of the teaching quality and teaching reform project. It is an very important measure to further reform the teaching methods and teaching facil

2、ity through educational informationization. The website establishment of High-Quality Course is the excellent courses learning platform and evaluation of the window. It is not only the interaction between teachers and students of the medium, but also the excellent course radiation carrier. So, the w

3、ebsite establishment of High-Quality Course is very important. This Quality Course Website is to comply with the requirements of the times,so it is designed. The development of this website is based on B / S structure, using JSP and SQL Server database programming language developed. In this article

4、, the significance of the system design and development tools are briefly introduced at first, then introduced the detailed analysis of system needs; then gives the required Course Website features, focusing on the Course Website Design ; Finally, I introduced the administrator of the login module,

5、news management module, the Forum module for detail,on-line testing and gives concrete steps to achieve; by test and analysis, the system is stable, reliable,friendly interface has certain practical value. Key words: high-quality curriculum website; resource sharing; Sql Server ;JSP 摘要I目录III1 绪论11.1

6、课题背景11.2 课题研究的现状11.3 主要研究内容12 需求分析12.1系统需求分析12.1.1 数据流分析22.1.2 功能需求分析22.2技术可行性分析22.3 非功能需求分析32.4 开发平台33 系统概要设计33.1 概述33.2 功能模块划分33.3 数据库设计43.3.1 逻辑设计43.3.2 表设计64 详细设计与实现84.1 核心技术简介84.1.1Ajax技术84.1.2 JSP技术94.1.3 CSS技术104.2 前台管理104.2.1 用户注册104.2.2 登陆模块114.2.2 新闻模块124.2.3 教学录像134.2.4 有问必答144.2.5 资料下载15

7、4.2.6 在线测试174.3 后台管理184.3.1 登陆模块184.3.2 用户管理204.3.3 新闻管理214.3.4教学资料管理244.3.4学习视频管理254.3.5修改密码264.3.6留言管理284.3.7题库管理295系统测试315.1测试的目的315.2测试的准则315.3测试的方法315.4单元功能测试实例316 总结与展望33参 考 文 献34致 谢35III常州大学本科生毕业设计（论文）1 绪论1.1课题背景以网络化、数字化、多媒体化和智能化为代表的现代信息技术正在改变着人们的工作、学习与生活方式，也给教育的内容和发展带来了新的发展空间。课程是教育的核心和灵魂，大学课

8、程则是大学培养目标与培养规格的具体化，是高等学校教学工作的重要依据，而精品课程更被上升为学校办学水平的重要标志。高校实施精品课程建设是一项深化教学改革、提高教学质量的系统工程。因此，高校建立一个自己的精品课程网站是十分必要的事情，这不仅是能使更多的人享用宝贵的教育资料源，同时也对于提升学校自身的知名度，提高学生自学能力，有相当大的帮助1。 1.2 课题研究的现状在世界范围内来看，有关精品课程网站研究一直都在进行并且不断取得进步，特别是西方发达国家，他们在精品课程的理论研究与实际运用方法积累了大量的经验，虽然中国国内在精品课程网站这一方面的研究起步较晚，但同样也取得了大量丰硕的成果。目前已有大约

9、750门国家级精品课程上网，为实施和推广精品课程、全面提高教学质量提供了样板。各省、市院校也建立了自己的富有特色的精品课程网站。这些优质的课程资源，已经为其他高校的教学工作起到了先锋模范的样板作用1。1.3 主要研究内容 本系统是基于Web体系的通用精品课程网站系统。该系统主要围绕新闻公告信息，用户注册，资料的查看下载，视频在线播放，在线测试，问题的提出和回复等一系列的问题进行展开。2 需求分析需求分析是在可行性研究的基础上将用户对系统的描述，通过开发人员的分析和概括抽象为一个完整的定义，并形成一系列文档的过程，旨在回答系统做些什么的问题，确保将来开发出来的软件产品能够真正满足用户的需求2。良

10、好的需求分析将会是开发一套优秀软件的前提和基础，因为，需求分析完成的好坏将直接影响后期软件开发的质量。因此，首先需要对本课题做一个充足的需求分析3。对于本课题来说，主要从系统需求、技术需求、非功能性需求以及环境需求这几个方面入手。2.1系统需求分析系统需求是软件需求中核心部分，不管使用什么样的技术开发什么软件，首先必须保证所开发出来的软件是满足用户最基本的需要，也就是需要知道开发什么样的一套软件，它可以做什么4。通用精品课程网站系统从现状出发，主要从数据和功能两个方面来做系统需求分析。2.1.1 数据流分析 通用精品课程网站系统，从数据需求分析上来看，是个比较典型的模型：输入-变换-输出。输入

11、主要是一些基本信息，如新闻信息数据等等，系统需要将这些数据存入数据库，为后期的数据处理提供保证；系统首先得跟数据库进行交互，得到基础数据，接着，这部分还要更新数据存储；最后，是数据输出，作为信息系统，这部分主要是将经过变换处理过的数据从数据存储中取出来，并呈现给用户。2.1.2 功能需求分析根据前面的数据流分析，从功能上来看，主要有如下几点需求：（1）首先，通用精品课程网站系统要能对教学内容基本信息进行维护（如：增、删、改、查），这部分是整个系统的核心基础，因为一切工作都是建立在教学基本信息基础上的，这包括对教学课件、教学视频和评分测试的增删改查。（2）其次，本系统还需要有处理基本数据的能力。

12、在本系统中，需要对已经测试过的试卷进行相应的处理，最终得出测试结果。（3）接着，系统还需要提供用户查询入口，让用户能够查询到相关信息，如教学资料、新闻信息等等。（4）然后，系统还需要能够维护和管理基本信息，因为这是所有信息依赖的基础，如果没有了用户，那么一切数据将没有意义。（5）最后，本系统还需要设置不同角色的用户来保证系统的安全性。因为本系统需要对用户的基本信息进行管理和维护。2.2技术可行性分析 前文就功能和数据做了需求分析，但是，再好的设计，如果不考虑实际技术，不考虑是否能实现，那也只是空想，无法实现。因此，在理清前面系统所有需求的基础上，本系统中还需要对技术可行性进行进一步的深入分析研

13、究。 就本课题而言，根据前面的需求分析，可以了解到，从技术上来讲，通用精品课程网站系统细分到最后主要实现的就是对数据的增、删、改、查，将系统划分为若干单独处理的模块，每个模块又可以划分为一个或多个单元，每个单元又是负责对基本数据的维护，即一个或多个增删改查(CRUD)操作，这样，一切就一目了然了，十分清楚了。 对于具体使用怎样的技术，有必要在这里说明下，这也算是对技术进行一个可行性分析。 首先是编程语言的选择，从行业发展来看，JAVA、PHP、.NET都是不错的选择。 JAVA语言属于面向对象语言，具有良好的继承、封装和多台的特性，而且它十分灵活，拥有者丰富的API文档，这对开发人员来说，是个

14、很好的选择。此外，JAVA语言具有一次编译到处运行的特点，良好的可移植性为后期的测试运行带来了方便。因此，选择JAVA语言来进行开发，完全合理可行5。其次是数据库的选择，按照规模的大小，常见的数据库有Access、Mysql、SQL Server、Oracle、DB2。Access主要针对数据量不大的小型软件，Mysql与SQL Server可以满足中型项目的需求，而Oracle和DB2主要面向大型软件系统。考虑到通用精品课程网站系统数据量不是特别大以及自己对数据库SQL Server的熟悉，所以选择SQL Server基本能完成系统6-8。综上所述，采用J2EE技术来开发，SQL Serve

15、r做数据库支持来完成本课题基本可行。2.3 非功能需求分析 这部分主要针对通用精品课程网站系统就用户体验方面做些非功能性方面的需求分析。 首先是界面需求，不管系统功能怎么样，界面都要尽量设计的比较美观些，使得界面具有一定的友好性，至少让用户觉得这款软件看着舒服，第一印象很重要。 其次是用户习惯需求，开发出来的软件系统要符合用户的操作习惯，尽量做到简便、易于操作，不能让用户无从下手，不知道该如何使用，那样可能软件的质量就会打大折扣了。接下来的一个问题很重要，由于通用精品课程网站系统的用户比较多，用户使用的方便性将是一个值得考虑的问题。软件分为C/S跟B/S两种模式，C/S是客户端/服务端模式，要

16、访问就必须在本机安装客户端软件，这给用户带来了很多不便。而B/S模式是基于浏览器的，只要打开浏览器输入网址就能访问，这样用户使用就方便多了，因此，本课题中，采用B/S模式来开发本系统。 最后，是稳定性需求，开发过程中尽量使用规范的代码来进行开发编写，一切按照标准来，这样可以确保系统具有良好的可移植性。2.4 开发平台根据前文的技术需求分析，通用精品课程网站系统采用的开发平台如下：（1） 开发环境为Windows 7 （2）开发工具：Myeclipse for spring8.6，JDK1.6（3）服务器：Tomcat6.0服务器（4）数据库：SQL Server 20053 系统概要设计3.1

17、 概述通用精品课程网站系统主要采用软件工程的设计思想来进行设计的，在概要设计部分，需要完成的任务是设计系统的实现方案以及确定程序的体系结构，即确定程序由哪些模块组成以及模块之间的相互关系。3.2 功能模块划分根据业务需求，从功能上来看，主要需要如下几个模块：（1）登陆模块，这时前台登陆，普通用户（学生）竟然系统的入口。（2）新闻模块，分为新闻添加、新闻管理和类别管理三部分，由管理员新闻的添加删除和分类，同时在前台让用户看到一些重要的公告。（3）用户注册，新用户（学生）可以由此注册，从而进入到网页内，拥有一些基本的操作权限。（4）教学模块，包括教学课件的查看和下载，以及教学视频的播放。（5）论坛

18、模块，无需登陆即可查看留言，登陆后才可发表留言，回复留言。为为有疑问的学生提供一个交流和互动的平台。留言发表时必须有发表者姓名、及内容。只有管理员有权利删除留言。（6）在线测试，用户登陆后可选择试卷，自行测试，只有普通管理员（老师）有权对试题进行增删改查，以及组卷。（7）后台管理，超级管理员只有在登陆后才能够进行新闻管理、留言管理、用户管理等，维护网站的正常运行。普通管理员（老师）只能对教学资料进行管理。普通管理员由超级管理员创建。密码或账户错误则不能登录。综上所述，通用精品课程网站系统需要有登陆模块、新闻模块、用户注册、教学模块、论坛模块、在线测试、后台管理维护这几个功能模块。系统功能结构如

19、图3.1所示。管理模块图3.1 系统功能结构3.3 数据库设计数据是软件的血液，一款没有血液的软件是没有生命的，同时，血液的好坏也将在一定程度上决定着软件性能的好坏，因此，对软件系统做数据库设计是一个必不可少的过程9。3.3.1 逻辑设计根据需求分析，本系统主要有用户（学生），普通管理员（老师），超级管理员，新闻公告，留言板，教学视频，教学课件，试卷等多个实体。为了更清楚地说明各个实体以及各实体间的关系，下面采用E-R图来形象的表示：管理留言板留言 n1n留言 观看1下载教学课件新闻学生nnnnnnn回复上传测试组卷出题nnn试卷题目教师教学视频n上传图3.2 实体关系图图 3.2详细展示了学

20、生以及教师实体与新闻实体、教学视频实体、教学课件实体、试卷实体和留言实体之间的关系以及各实体的相关属性。类别内容标题添加者 添加时间新闻ID图3.3 新闻实体属性图图 3.3是新闻实体的E-R图，学院有唯一标识id跟标题、类别、内容、添加者、添加时间六个属性。邮箱姓名性别密码用户名出生年月ID身份证用户（图3.4 用户实体属性图 图 3.4是用户（学生）实体的E-R图，实体有姓名、用户名、密码、性别、邮箱、出生年月、身份证几个属性。3.3.2 表设计通过逻辑设计，大致设计出了以下几个表，它们的字段信息如下：（1）管理员表(allusers)管理员表allusers记录了网站系统超级管理员的信息

21、和所有已注册的普通管理员信息，（如表3.1）表3.1 allusers表结构字段名字段描述数据类型约束ID用户编号INT(4)主键username用户名VARCHAR(50)唯一pwd用户密码VARCHAR(50)非空cx用户类型VARCHAR(50)非空add_time注册时间DATETIME唯一（2）资料下载表（ziliaoxiazai）资料下载表主要是针对资料下载的相关数据的操作。如表3.2所示。表3.2 ziliaoxiazai表结构字段名字段描述数据类型约束ID编号INT(4)主键bianhao资料编号VARCHAR(50)唯一mingcheng资料名称VARCHAR(300)非空l

22、eibie类别VARCHAR(50)非空kecheng课程VARCHAR(50)唯一jianjie简介VARCHAR(500)非空fujian复件VARCHAR(50)非空addtime添加时间DATETIME唯一（3）用户注册表（yonghuzhuce）用户注册表主要是针对用户注册模块的数据操作，是本设计的核心表，涉及到的属性主要是用户编号，姓名，用户名，密码，姓名，性别，出生年月，联系QQ，邮箱，电话，身份证，头像，地址，备注录入时间，审核等,如表3.3所示。表3.3yonghuzhuce表结构字段名字段描述数据类型约束ID用户编号INT(4)主键yonghuming用户名VARCHAR(

23、50)唯一mima密码VARCHAR(50)非空xingming姓名VARCHAR(50)非空xingbie性别VARCHAR(2)唯一chushengnianyue出生年月VARCHAR(50)非空QQ联系QQVARCHAR(50)非空youxiang邮箱VARCHAR(50)非空dianhua电话VARCHAR(50)非空shenfenzheng身份证VARCHAR(50)唯一touxiang头像VARCHAR(50)非空dizhi地址VARCHAR(300)非空beizhu备注VARCHAR(500)非空addtime注册时间DATETIME唯一issh审核VARCHAR(2)非空（4）

24、留言板表（liuyanban）留言板表主要是针对有问必答模块的数据操作，学生留言和教师回复的内容都存储在这个表中如表3.4所示。表3.4 liuyanban表结构字段名字段描述数据类型约束ID用户编号INT(4)主键cheng用户名VARCHAR(50)唯一xingbie用户密码VARCHAR(2)非空QQ用户类型VARCHAR(50)非空youxiang注册邮箱VARCHAR(50)唯一dianhua电话VARCHAR(50)非空neirong内容VARCHAR(500)非空addtime注册时间DATETIME唯一huifuneirong回复内容VARCHAR(500)非空4 详细设计与实

25、现根据软件工程的思想，在详细设计阶段，本课题需要解决的问题是如何具体地实现这个系统。 4.1 核心技术简介在本系统中，使用了一些比较流行的框架结构和技术：Ajax、JSP、CSS，这是本系统的核心技术,在具体实现功能模块前，有必要对这些技术做一些简要的说明与介绍。 4.1.1Ajax技术10Ajax即 Asynchronous JavaScript and XML,简单地说是异步javascript和XML，可以使网站异步的执行数据。Ajax主要通过XmlHttpRequest对象来实现与服务器的异步交互性，借助DOM来实现局部刷新，异步性和局部性使得用户体验连续，不会中断。XMLHttpRe

26、quest是ajax的核心机制，它是在IE5中首先引入的，是一种支持异步请求的技术,它的属性有： onreadystatechange 每次状态改变所触发事件的事件处理程序。 responseText 从服务器进程返回数据的字符串形式。 responseXML 从服务器进程返回的DOM兼容的文档数据对象。 status 从服务器返回的数字代码，比如常见的404（未找到）和200（已就绪） status Text伴随状态码的字符串信息 readyState 对象状态值，0未初始化 1正在加载 2加载完毕 3交互4完成。运行机制：（1）创建XmlHttpRequest对象如果是IE浏览器则使用：x

27、mlHttp = new ActiveXObject(Microsoft.XMLHTTP);如果是其他浏览器则：xmlHttp = new XMLHttpRequest(); var xmlHttp; function createXMLHttp()if(window.XMLHttpRequest)xmlHttp = new XMLHttpRequest();elsexmlHttp = new ActiveXObject(Microsoft.XMLHTTP); （2）发出XmlHttpRequest请求设置回调函数，一旦相应，它会自动执行（Callback是定义回调函数的函数名）xmlHttp

28、.onreadystatechange = Callback;定义想要执行的异步请求xmlHttp.open(POST,content.htm);设置发送的参数（不发送则写null）xmlHttp.send(null);（3）定义回调函数function Callback()if(xmlHttp.readyState=4)/调用完成if(xmlHttp.status=200)/Http状态码操作正常var text = xmlHttp.responseText;document.getElementById(msg).innerHTML = text;本系统中，主要使用Ajax技术在进行异步信

29、息的验证，如重名验证，采用Ajax技术后，大大提高了用户体验，用户再也不用像之前需要在客户端通过打开一个新的页面了发送用户请求进行验证，方便，快捷。 4.1.2 JSP技术11-16JSP(Java Server Pages)是由Sun Microsystems公司倡导、许多公司参与一起建立的一种动态网页技术标准。JSP技术使用Java编程语言编写类XML的tags和scriptlets，来封装产生动态网页的处理逻辑。网页还能通过tags和scriptlets访问存在于服务端的资源的应用逻辑。JSP将网页逻辑与网页设计和显示分离，支持可重用的基于组件的设计，使基于Web的应用程序的开发变得迅速

30、和容易。JSP与Java Servlet一样，是在服务器端执行的，通常返回该客户端的就是一个HTML文本，因此客户端只要有浏览器就能浏览。JSP页面由HTML代码和嵌入其中的Java代码所组成。服务器在页面被客户端请求以后对这些Java代码进行处理，然后将生成的HTML页面返回给客户端的浏览器。Java Servlet 是JSP的技术基础，而且大型的Web应用程序的开发需要Java Servlet和JSP配合才能完成。JSP具备了Java技术的简单易用，完全的面向对象，具有平台无关性且安全可靠，主要面向因特网的所有特点。自JSP推出后，众多大公司都支持JSP技术的服务器，如IBM、Oracle

31、、Bea公司等，所以JSP迅速成为商业应用的服务器端语言。JSP的优势如下：（1）一次编写，到处运行。在这一点上Java比PHP更出色，除了系统之外，代码不用做任何更改。（2）系统的多平台支持。基本上可以在所有平台上的任意环境中开发，在任意环境中进行系统部署，在任意环境中扩展。相比ASP/PHP的局限性是显而易见的。（3）强大的可伸缩性。从只有一个小的Jar文件就可以运行Servlet/JSP，到由多台服务器进行集群和负载均衡，到多台Application进行事务处理，消息处理，一台服务器到无数台服务器，Java显示了一个巨大的生命力。（4）多样化和功能强大的开发工具支持。这一点与ASP很像，

32、Java已经有了许多非常优秀的开发工具，而且许多可以免费得到，并且其中许多已经可以顺利的运行于多种平台之下。 4.1.3 CSS技术17-20CSS(层叠样式表)是用来进行网页风格设计的，它简化并扩展了HTML中的各种标记，使得各个标记的属性更具有一般性和通用性，大大提高了HTML开发的效率。在制作网页时采用CSS技术，可以有效地对页面的布局，字体，颜色，背景和其他效果实现更加精确的控制，只要对相应的代码作一些简单的修改，就可以改变同一页面的不同部分，或者页数不同的网页的外观和格式。CSS是Cascading Style Sheet的缩写，可以译成“层叠样式表”或“级联样式表”。CSS中，Ca

33、scading是“层叠”的意思，也就是说在同一个Web文档中可以有多个样式表存在，这些样式表根据所在的位置，拥有不同的优先级，优先级越高，就会在最后显示时被采用。从样式表插入的形式看可以分为3种。（1）内联式样式表；（2）嵌入式样式表； （3）外部式样式表。4.2 前台管理 普通用户在前台显示的首页登陆，登陆后会得到一些权限，如查看新闻公告，下载教学资料，在线测试等4.2.1 用户注册 按规定输入所有信息后才能有权限接受超级管理员审核，审核通过方可登录。这里介绍一下表单验证； JSP是HTML嵌入Java代码构成，所以验证表单的时候一般通过JavaScript来判断，比如常见的请输入用户名，请

34、输入密码，请输入姓名等。而表单提交的方式有get和post两种方法，出于安全起见，选取post方式因为安全；;如图4.1所示图4.1用户注册界面定义一个check()函数用来验证表单form1的元素，如果输入的用户名，密码，姓名的value值为空，则返回错误，document.form1.yonghuming.focus()指的是光标返回当前文本框。这个功能的核心代码块是：function check()if(document.form1.yonghuming.value=)alert(请输入用户名);document.form1.yonghuming.focus();return false

35、;if(document.form1.mima.value=)alert(请输入密码);document.form1.mima.focus();return false;if(document.form1.xingming.value=)alert(请输入姓名);document.form1.xingming.focus();return false;4.2.2 登陆模块注册过后，接下来回到首页登陆，等管理员审核后，输入已注册的用户名。如图4.2所示图4.2用户登陆界面对于用户名和密码是要验证的，验证是否存在此用户名，以及密码是否正确，主要代码如下：String uid=new String(

36、request.getParameter(username).getBytes(8859_1);String pwd=new String(request.getParameter(pwd1).getBytes(8859_1);String sql=;String cx=new String(request.getParameter(cx).getBytes(8859_1);sql=select * from yonghuzhuce where yonghuming=+uid+ and mima=+pwd+ and issh=是;ResultSet RS_result=connDbBean.e

37、xecuteQuery(sql); if(!RS_result.next()out.print(alert(你输入的用户不存在或密码错误，或帐号未经审核,请重新登录!);window.history.go(-1););else session.setAttribute(username,uid); session.setAttribute(cx,cx); response.sendRedirect(index.jsp); RS_result.close(); 4.2.2新闻模块新闻模块主要是用来显示一些新闻公告，给用户查看，同时也类型进行区分，而用户可以通过标题进行模糊查询。如图4.3所示图4

38、.3 新闻浏览界面图4.4 新闻查询界面通过使用RS_result.next()方法遍历数据库表中的数据，然后选择要在前台显示的内容，如标题。主要代码如下：String sql=;sql=select top 7 id,biaoti,addtime from xinwentongzhi order by id desc;String id=;String biaoti=;String addtime=;int i=0;ResultSet RS_result=connDbBean.executeQuery(sql);while(RS_result.next()i=i+1;id=RS_result

39、.getString(id);biaoti=RS_result.getString(biaoti); addtime=RS_result.getString(addtime);% a href=gg_detail.jsp?id= 4.2.3教学录像当用户（学生）登陆后，则有权在线观看教学视频，用户可根据视频的基本信息来决定，观看自己需要学习的视频。如图4.5所示图4.5 视频播放界面通过使用Object标签来实现视频的播放，主要代码如下：if ( houzhui.equals(.mid) | houzhui.equals(.wma) | houzhui.equals(.wmv)| houzhu

40、i.equals(.flv)| houzhui.equals(.mp4)| houzhui.equals(.avi) ) param name=Filename value=embed type=text/html codebase= flename=mp src= width=500/object4.2.4有问必答 用户登陆这个界面时，如果有问题，可以提出问题，写下来，然后管理员会进行回复。如图4.6所示图4.6 留言界面 定义一个checklyb()函数用来验证表单form1的元素，如果输入的内容等值为空，则返回错误，document.form1.内容.focus()指的是光标返回当前文本

41、框。这个功能的核心代码块是： function checklyb()if(document.formlyb.cheng.value=) alert(请输入昵称);document.formlyb.cheng.focus();return false; if(document.formlyb.neirong.value=) alert(请输入留言内容); document.formlyb.neirong.focus(); return false; 4.2.5资料下载对于已经登陆的用户（学生）才有权利查看，下载资料，同时学生也可以查询自己需要的资料来下载。如图4.7所示图4.7 资料下载界面 当

42、用户点击下载时，便可下载教学文件。主要代码如下： String sql=select * from ziliaoxiazai where id=+id; String bianhao=;String mingcheng=;String leibie=;String kecheng=;String jianjie=;String fujian=; ResultSet RS_result=connDbBean.executeQuery(sql); while(RS_result.next()bianhao=RS_result.getString(bianhao);mingcheng=RS_result.getString(mingcheng);leibie=RS_result.get