文章首发地址

第一章 绪论

1.1课题背景

当今网络发展的十分迅猛，人们的生活节奏变化的也非常的快。在我们日常的生活中有很多非常智能的软件，除此之外新兴的智能软件也如雨后春笋般的出现，人们的生活方式也一点一点的被潜移默化的改变着，当今社会的这种生活方式也是一种更人性化的“懒人”模式，比如人们在出行的时候可以提前预定机票、火车票等票据，也可以在到达目的地之前提前预定要下榻的酒店，甚至饿了可以随时通过手机进行点餐。这种虽然模式对人们的生活质量有巨大的提升，但是人们过度的沉浸于享受生活，却忘记了在学校最根本的任务是学习，特别是对考试周之前的同学们来说，更不能因为别的事情耽误自己的复习计划。2020年的整个上半年一直到现在，一场没有硝烟的战争席卷了整个国家，很多人感染了新冠病毒，甚至很多人因此失去了生命。本次疫情对整个国家的影响非常大，很多人因此失去了工作，很多企业都面临倒闭，包括学校中的正常教学工作也会受到影响，为了贯彻国家的防疫政策，很多学校都采取了线上教学的方式。

1.2. 目的和意义

现在大家的生活方式正在被计算机的发展慢慢改变着，学习方式也逐渐由书本走向荧幕,我认为这并不是不能避免的,但说实话,现在的生活方式与以往相比有太大的改变，人们的娱乐方式不仅仅再是吃完饭围坐在一起看电视。由于近些年手机、平板电脑等设备的普及,互联网充满了活力,并且可以渗透进其余的各行各业,可以提升全面经济,对国家发展也有重大贡献。因此,国家大力推动,推动其向全国推广，但是由于越来越多得人选择上网而不是看书学习，很多学校的考研率或者升学率都有所降低。事实上很多人也不想让这种事情发生,但是仅依靠少数人的努力远远不够,将来会发生什么,我们难以预测。但是至少有一点我们要知道:我们必须做一些事情保证所有想要进行学习的同学有更多的方式，还可以制定自己的学习计划。所以，本文借助实现基于JSP的线上教育系统的这个契机，既可以详细的利用大学学的知识开发一个有价值有意义的网站，又可以帮助广大学生实现自己的升学梦。

1.3. 本文的结构

本文会按照在大学里学习的专业的软件工程学对于一个系统产生的所有流程去介绍整个基于JSP的线上教育系统的实现方式。

当然,本文将着力介绍基于JSP的线上教育系统的基本组成与结构,并详细说明该网站的设计方案、实现的方法、开发工具及其他相关的技术。另外,重点介绍了软件开发中的一些细节。系统在一定条件下对系统中的重要模块进行严格测试,验证了该系统的可用性与可靠度。接下来介绍我实现系统的过程与本文的结构：

首先在开发这个系统之前需要对整个项目进行立项及可行性分析，画出本系统的原型图及编写出可行性研究报告，通过这一系列分析才决定这个项目到底可不可行，能否进行开发。

1.4. 开发环境

1.4.1 JSP语言

JSP是Sun公司创建的一种动态网页技术，是一种面向对象编程的开发语言。经过十几年的发展，JSP的优点越来越显著，首先就是开源免费，一个语言如果是开源免费的就会更方便人们学习交流，让越来越多的程序员进入到JSP编程的领域。除此之外，JSP相比其他语言更快捷高效，性能也比较好，还是可以跨平台的语言。最最重要的就是它是面向对象的编程思想，可以以类和对象为核心解决各种问题。

1.4.2 HTML语言

本系统的前台使用的技术是HTML5，与它的前身HTML4相比有了一些功能上的优化，最关键的一点是增加了响应式的网页设计，也就是说会根据用户使用的不同的设备进行不同样式的显示，比如电脑端的浏览器与手机端的浏览器同时登陆本系统的前台页面显示的效果是不一样的，但都能完美的对内容进行呈现。

本系统的布局方式有多种，比如最常见的DIV+CSS样式布局，还有在登录注册页面上使用的Table布局，以及进行图文信息显示的DL-DT-DD布局等。本系统的前台页面有很多的层叠样式表文件（也就是CSS文件），首先有个整体的样式文件，所有的页面的基础样式都引用该文件，再就是其他的页面都有一个属于自己的CSS文件，通过这些样式使所有页面都能很好的进行显示。

1.4.3 JavaScript及Vue的介绍

JavaScript技术简称JS，JS出现于1995年，在JS出现之前，表单验证的工作由服务器端进行，非常占用网络资源，所以效率很低。JS出现之后，表单验证由客户端的浏览器完成。当然目前JS的使用不仅仅是表单验证，而是服务于HTML网页，对网页进行一些动态的美化，比如网页的菜单折叠功能、网页图片的轮播功能等等。

VUE的核心设计方法就是MVVM，与传统的MVC类似，MVVM指的是Model（模型）-View（视图）-ViewModel（视图模型）。这种设计模式的特点就是可以将视图中的数据自动更新到视图模型中，而视图模型中的数据变化也会更新到模型中，实现数据的双向绑定。VUE的全称写作VUE.JS，可以极大程度上提高数据绑定的效率，还有灵活的组件系统，让网页元素可以进行复用。

1.4.4 My Sql数据库

MySql是开发Java、JSP项目最常用的关系型数据库，对于学生来说如果使用Oracle等大型数据库完全没有必要，因为大型数据库软件的价格非常昂贵，做此类小型项目还是比较适合用MySql这种可以免费使用的小型数据库，查询效率高，易于维护等特点都是选择使用此数据库的原因。

第二章 可行性分析

2.1. 业务流程可行性分析

网站前台：

(1)用户可以匿名浏览网站中的所有网络课程,但不能进行图片或文件的下载也不能进行收藏,更不能在每一个线上课程的页面中进行评论。

(2)用户的注册与登录: 学生或者老师用户需要按照学校的相关规定进行注册和登录，成功注册的用户即可使用本网站进行学习。

(3)视频课程查询：用户可以在网站中查看所有的视频课程信息。

(4)在线留言：为了更好地帮助用户提高上网体验，本网站增加了在线留言功能，用户可以通过此功能给系统提一些意见或者建议，帮助系统更好的升级和优化。

(5)视频开课分类检索：用户可以在网站通过不同的方式进行分类检索。

网站后台：

(1)用户信息管理模块:管理员可以通过此模块查看网站内的所有用户信息，除此之外还可以通过本功能进行用户的精确查找。

(2)站内新闻管理功能模块:管理员用户可以通过此功能对网站内的站内新闻信息进行维护和管理。

(3)课程信息管理模块:用户可以随时对网站中的课程信息加以管理维护。

(4)在线留言管理模块:管理员通过账号可以实时管理网站中的留言信息。

(5教学视频管理模块:管理员通过账号可以实时管理网站中的教学视频。

2.2. 经济可行性

一个网站的经济可行性是指除去开发这个网站的成本后，还能否获得利润。除此之外还要看本网站是否有市场发展潜力和市场价值,本人开发这个系统一方面是因为要证明自己在学校四年的学习后可以制作出一个专业的网站，还有一个原因就是希望增强用户的体验度。对于本系统来说，开发的成本几乎为零，因为这是个人开发的项目，用到的也都是基础的编程方面的知识，所以从经济可行性方面来考虑，本系统是可行的。

2.3. 技术可行性

本系统的开发使用的是个人电脑，不需要使用阿里云或百度云主机，个人电脑的硬件足够支撑本系统的运行，所以硬件方面是没有问题的。

软件方面来考虑的话，本系统与其他的JSP项目一样，开发工具都是使用的MyEclipse编程软件和MySQL数据库，因此在技术上是可行的。

2.4. 运行可行性

在当今这个计算机技术高度发达的时代,不管是大人亦或是小朋友都会使用电脑或者手机上网,不管是用自己家里的个人电脑还是用公司的公用电脑。大家现在都已经很习惯在网上进行购物，所以基于JSP的学校查分网站的操作对所有用户来说都是不成问题的,而且经过对界面的设计之后，本系统对使用者来说非常友好。此网站管理员是开发项目的开发者,所以管理起来也更不在话下。经过上述分析,操作方面是可行的。

第三章 需求分析

3.1网络课程分享推广历史与现状

在每个人的学生时期，在语文课上可以学习唯美的唐诗宋词，在历史课上可以学习中华民族从古至今的发展，在思想政治教育课上可以学习革命先烈不畏强权的抗争精神……

但是如果当一个人上了大学之后就开始变得不学习了，也没有想要复习的计划，哪怕报名了考研最终也会放弃。最大的原因就是想要学习的课程没有一个良好的传播介质和途径。

3.2功能需求分析

经过对各大视频学习网站（如腾讯课堂、哔哩哔哩）及生活中对线上教育的研究,我认为基于SSM的线上教育网站应具有以下几个功能:

(1)具有年轻时尚感的设计风格与大方简洁的操作界面。

(2)用户可以在网站平台上查看视频课程和作业信息。

(3)具有对线上课程的教材观看、作业下载的功能。

(4)具有可以分类搜索教学视频等详细信息的功能。

(5)具有给网站客户在线留言的功能。

(6)具有进行学习资料下载的功能。

3.3非功能需求分析

1.系统性能分析

一个系统的性能是非常重要的，比如一个网站同时有200人访问和购买，网站是否能承载，再比如有大量数据进行刷新和新增时数据库能否正常的进行数据操作。本网站虽然是个小型的管理系统，但是通过性能优化，完全可以做到承载500人以上的同时访问，通过对数据库中的一些常用对象的设计可以最大化的将查询效率提高。

2.系统可扩展性

一个系统的可扩展性主要是看能否在当前版本的基础上添加新的功能进行升级，本教室消杀管理系统提供了很多接口可以进行版本的迭代。

3.系统安全

大家以往的认知里，就算别人得到了自己的个人信息也不会对自己有任何的影响，但其实当今这个社会信息安全非常重要。有一些居心叵测的人会通过你遗漏在别处的个人信息得到你的姓名、电话甚至住址和工作单位，并以此进行电信诈骗。所以教室消杀管理系统安全是非常重要的，本系统做了很多安全方面的设计，比如防SQL注入的设计，可以有效的保护用户的个人账户安全。

4.系统稳定

一个系统的稳定性主要取决于网站和数据库的数据连接，必须保证数据库与页面的数据保存长期且稳定的一致。

第四章 总体设计

4.1.系统模块总体设计

基于SSM的线上教育网站是前后台类型的系统，前台和后台独立存在但又相辅相成，前后台访问的是同一个数据库，但是所访问的数据库对象不同。

前台：

(1) 用户可以在不登录的情况下访问本系统，但是不能进行教学视频的学习或收藏，也不能对自己的个人信息进行修改。

(2)用户注册与登录:用户们如果想在网站录入自己的个人信息,需要经过一系列的有验证信息的注册,注册成功并登录后,用户可以查看所有的线上课程。

(3)个人中心：用户可以在首页面进行对自己个人信息的查看，以及可以查看自己的历史数据。

(4)在线留言：用户可以在网站首页进行在线留言，管理员看到后会及时进行回复。

(5)视频开课分类搜索：用户可以在网站上进行多种形式的搜索。

后台：

(1)用户个人信息管理系统:在此系统中维护和新建的用户个人信息,比如说当一个用户的密码被遗漏了,经过对密码提示出现问题的验证就可以直接进行密码的修改。

(2)线上课程管理功能模块:管理人员可以有效地维护网络课程。

(3)教学视频管理模块:管理员可以随时对网站中的教学视频加以管理维护。

(4)作业管理模块:管理员通过账号可以实时管理网站中的作业信息。

4.2.数据库总体设计

数据库的设计对一个系统来说是非常重要的，经常会出现做一个项目时已经开始编码了但是数据库还没有进行创建的情况。对本系统来说，应该是先创建数据库再进行编码，在创建数据库之前首先要对系统的数据进行分析，只有按照功能的需求分析进行数据的分析才可以保证在编码时不需要再去担心数据库的问题。

（1）对于本系统来说，想要使用系统里的功能是要先进行注册登录的，所以本系统设计的第一个表就是用户表，里面要包含用户的一些基本信息如用户的编号，用户的用户名及密码等。

（2）本系统有多张表是进行信息保存的，如学习视频表和作业表等，这些表有一个共同的特点就是列比较多，维护起来很麻烦且容易出错，所以此类表在设计本系统的数据库时被分为了两张表，使用主外键进行连接，一个是基本信息表，另外一个是详细信息表，查询相关数据时需要用到连接查询。

（3）用户表在用户进行了个人信息修改之后需要进行更新，保持网页中的数据与数据库中用户表的数据相同是很重要的。

（4）学习资料下载完成后，需要学习资料表中有一个列来反映学习资料下载的次数，每当用户下载过一次就在原有的基础上加一。

（5）除了用户表之外还需要一个管理员表，因为网站内的用户及数据较多，一个管理员肯定无法满足数据维护的需要，所以既然有多个管理员就需要有一张管理员表存储系统内的管理员信息。

4.3.数据库详细设计

下面详细介绍下本系统的几张数据表：

1.线上课程表

表4-3　t_jk（线上课程表）

序号	名称	别名	类型	长度（字符）
1	course _id	课程ID	Int	4
2	course _bianhao	课程编号	Varchar	50
3	course _date	课程添加日期	varchar	50
4	course _zhuangtai	信息状态	varchar	50

2．课程明细信息表

 

表4-4　t_details（课程明细表）

序号	名称	别名	类型	长度（字符）
1	mx_id	明细编号	Int	4
2	course _id	课程编号	Int	4
3	mx _nr	课程简介	Int	4
4	mx _pingjia	课程评价	Int	4

3．用户信息表

表4-5　t_user（用户信息表）

序号	名称	别名	类型	长度（字符）
1	user_id	用户ID	Int	4
2	user_name	用户名	Varchar	50
3	user_pw	用户密码	Varchar	50
4	user_realname	真实姓名	Varchar	50
5	user_address	住址	Varchar	50
6	user_sex	性别	Varchar	50
7	user_tel	联系电话	Varchar	50
8	user_email	用户邮箱	Varchar	50
9	user_qq	用户QQ	Varchar	50

4.管理员信息表

表4-6　t_admin（管理员信息表）

序号	名称	别名	类型	长度（字符）
1	userId	管理员ID	int	4
2	userName	管理员名称	Varchar	50
3	userPw	管理员密码	Varchar	50

第五章 详细设计与实现

5.1.运行环境

1．硬件环境

硬件环境配置：

处理器：I7-10200H

内存：8G DDR4

硬盘:：512G SSD

显卡：GTX1650Ti

2．软件环境

系统：Windows 10

数据库：MySQL数据库

开发工具：MyEclipse

服务器： LocalHost服务器。

5.2.开发工具及技术介绍

MyEclipse是广大程序员或者在校大学生们编写Java或JSP项目时最常用的工具，它最大的特点就是非常成熟和稳定，易于维护，还可以用来进行编写代码、编译文件、系统部署和测试等。

MySql是开发Java、JSP项目最常用的关系型数据库，对于学生来说如果使用Oracle等大型数据库完全没有必要，因为大型数据库软件的价格非常昂贵，做此类小型项目还是比较适合用MySql这种可以免费使用的小型数据库，查询效率高，易于维护等特点都是选择使用此数据库的原因。

5.3.系统界面设计

前台页面的设计：

基于SSM的线上教育系统的首页面采用了最简单的上中下结构，头部为导航菜单。中间部分的左侧可以进行用户的注册登录以及线上课程浏览、推荐教学视频展示，右侧为站内公告和新闻的界面。网站尾部是版权信息级作者联系方式等。具体实现效果如下图所示：

2.用户登录注册模块的设计与实现：

本系统的用户注册页面是由十几个详细的个人信息组成的表单，用到了很多的JS验证，比如非空验证，比较验证等，只有满足了所有的格式要求之后才可以成功的进行注册。用户登录页面如下图所示：

3.视频列表查看模块的设计与实现：

为了方便用户在逛网站时点击网站内的网络课程进行查看,本网站的课程信息查看提供了两种搜索方式:第一种为按照名称进行搜索,第二种比较常用,是按照排行榜进行搜索,比如按照课程的浏览量或收藏量去浏览。具体实现效果如下图所示：

4.签到功能的设计与实现：

在本系统中可以进行签到，关于课程的信息无需输入且不能更改，自己需要输入的信息是签到时间、学号及姓名等，点击保存即可完成签到。

5.新闻通知的设计与实现：

通过新闻功能可以让学生在学习之余关心国家大事，新闻列表可以查看所有的新闻信息，还可以进行查询，点击某一条新闻还可以进行详情查看。

后台页面的设计：

1. 后台首页面的设计：

基于SSM的线上教育系统的后台首页面也采用了最简单的左右结构，左部为导航菜单。中间部分为本系统的一些重要参数的提示，如当前日期、浏览器版本等。后台首页面具体效果如下：

1. 学生用户信息维护模块的设计：

通过用户信息管理模块管理员可以查看系统内所有已经注册过的用户信息，除此之外还可以进行多条件的查询，如通过编号+姓名。页面具体效果如下：

1. 教师信息的管理模块设计：

通过教师信息管理可以对课程的信息进行添加、修改和删除，每次在网页中做了相应的操作后，数据库会及时的更新，管理员在后台也可以及时看到最新的数据，然后对数据进行处理。页面具体效果如下：

1. 站内新闻管理模块设计：

站内新闻主要显示网站的下午信息，比如网站的介绍、对用户的通知等。管理员还根据网站的需求作出功能优化，这样也可以吸引更多没有注册的用户在网站进行注册。页面具体效果如下：

1. 视频开课管理模块设计：

教师用户登录自己的后台账号后可以管理视频开课信息，可以进行视频课的新增，除此之外可以进行批量导入和导出Excel模板，除此之外还可以对视频课信息进行编辑和审批。

第六章 系统测试与性能分析

6.1.软件测试的概念

在大多数人的印象中，软件测试就是找到系统中的Bug，就像在玩游戏时出现的一些非常不合理的设计，大家都能知道这是出现Bug了，但软件测试不仅仅是测试一些功能上的问题，因为程序员在编程的时候会同时运行自己的代码，如果遇到很明显的问题是会修改代码的，所以软件测试绝不是仅仅对功能或代码的测试，而是通过对比需求分析的设计查看每个功能都是否实现。

从程序员的角度来说，软件测试可以帮助自己将问题尽可能多的找出来，提高自己代码的质量。从用户的角度来说，软件测试可以在系统投入使用之前将有可能出现的功能缺陷一一的发现，从而提高用户的体验。

6.2.本系统的软件测试

1.搜索视频课程的测试

在搜索的文本框中输入名字进行搜索，先输入存在的信息比如计算机基础，如果进行搜索后可以显示出对应的学习资料或学习视频则说明搜索网络课程模块没有缺陷。

2信息添加模块的测试

在学习视频或学习资料等信息的添加页面上点击添加按钮进行添加，添加后需要登录管理员的账户查看是否后台数据库中新增了用户的添加记录，如果数据库中的订单表新增了用户的添加信息，则说明信息添加模块没有缺陷。

3.用户注册模块的测试

用户注册的功能测试主要是测试表单验证的准确性（在这里主要以用户名密码和确认密码举例子）已经注册过的用户是可以直接登陆的。测试用例及测试结果如下所示：

测试用例	用户名	密码	权限	测试结果
1	admin	admin	超级管理员	进入管理员界面
2	11	11	超级管理员	进入管理员界面
3	33	33	超级管理员	进入管理员界面
4	admin	1	超级管理员	用户名或密码错误

测试用例	用户名	密码	权限	测试结果
1	yh001	yh001	用户	进入用户界面
2	yh002		用户	请输入密码
3		yh002	用户	请输入用户名
4	yh003	yh003	用户	进入用户界面

4.站内新闻模块的测试

首先将数据库里站内新闻表的数据进行清空，然后同时打开页面前台的站内新闻功能，此时页面上是没有数据的。然后数据库中每增加一条数据，就去页面上进行刷新，看对应的数据有没有出现，如果数据库的数据和页面的数据是同步的说明此功能无缺陷。

源码领取