




版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
网络教学系统的设计实现随着网络的发展和社会上人们对教育越来越重视,一个全新的模式逐渐发展起来并不断完善,这就是网络教学模式。相比与传统的教学模式,网络教学模式具有很多的优点,他的教学方式和教学过程更具有时代意义,传统教学模式必须在固定的地点和相应的时间进行课程的推进,而网络教学不受两者的限制。除此之外,它还可以实现更个性化的教学,能够让学生更全面的发展和更广泛的狩猎知识。因此,世界各国对这种系统的开发投入的越来越多。网络教学的发展源于网络和传统教育的结合,真正的将教学的中心转移给学生,学生可以对自己拥有的课程任意支配,但也有一定的缺点,对于自制力水平差的学生,学习效率可能不如传统教学模式,但这是一个长期渐进的转变和适应的过程,网络教学的体系也在不断完善。网络教学;前后端分离;微服务;Vue;目录1绪论 11.1课题的背景 11.2国内外研究现状 11.3研究的主要内容 21.4系统开发的目的和意义 21.5论文结构概述 22相关技术 32.1SpringBoot 32.2Vue 32.3MyBatisPlus 32.4SpringCloud 33系统需求 33.1可行性分析 43.1.1社会可行性分析 43.1.2技术可行性分析 43.1.3时间可行性分析 43.1.4经济可行性分析 43.2功能需求分析 5(1)系统后台 (管理员使用) 5(2)系统前台(普通用户使用) 53.3面向对象分析 53.3.1系统后台用例关系 53.3.2系统前台用例关系 64系统设计 64.1概要设计 64.2详细设计 74.2.1注册模块详细设计 74.2.2登录模块详细设计 74.2.3个人中心模块详细设计 84.2.4搜索模块详细设计 94.2.5课程管理模块详细设计 94.2.6教师管理模块详细设计 10课程发布流程图 104.3数据库设计 114.3.1数据库概念设计 114.3.2数据库表结构设计 125系统实现 155.1系统平台搭建 155.1.1本地java环境 155.1.2本地Node环境 155.1.3服务器Mysql环境 155.1.4本地Redis环境 155.1.5本地Nginx环境 155.1.6Nacos注册中心 155.2注册登录模块 165.3微信登录模块 175.4用户搜索模块 185.5视频播放模块 195.6个人中心模块 205.7课程分类模块 215.8课程管理模块 225.9教师管理模块 226系统测试 236.1测试结果与总结 236.2测试结果与总结 246.3系统测试用例 24结束语 26参考文献 27PAGE5绪论课题的背景在新中国建立以来至今日,我们国家的教育从刚建国到现在发生了非常重大的变化,时代的进步,教育行业也有了新的改变。原本固定的实地教学模式在以网络为介质的催化剂作用下变得多样性,只要有网络,就能进行教学。在任何拥有网络课件的地点,学员可以不受固定时间的限制进行课程的学习。这种优势不单单适用于学生,对于那些已经工作,业务繁忙,没有固定的时间去线下学习的打工人而言,这种学习方式无疑是最受欢迎的。2020年的疫情,给人门带来和很大的灾难。但任何事情都有弊有利,全国各类学校按照教育部"听课不停学"的要求,疫情防控期间开展了网络教学。充分利用互联网的优势,各个学校因地制宜,开展多样化的网络教学。不单单是学校,各类培训机构等教育行业的网络教育也开展了起来。网络教学方式如雨后春笋一样爆发出来,在线直播课堂、网络点播教学、电视视频学习、网络集中辅导答疑,qq、微信、钉钉等软件进行互动,我们的教育从现代化向信息化转变[1]。国内外研究现状我国的网络基本已普及到全国各大中小城市,但现在网络教育资源并不是很丰富,再加上在教育水品并不高的广大农村地区。因此在未来,我国的网上教育平台的建设将有很大的前景。我国已有一些网络教学平台,如软酷网,咯大重点高校的在线教学平台等都为我们提供了良好的学习平台。但由于传统教学观念的束缚,远程教育并未得到很好的推广。因此,上面提到的政策的实施以及观念的转变显得尤为重要。当今国外网络教学发展得较国内更加迅速,除了普及广泛外,已经向更高层次的应用和标准化方面发展。美国100多家著名大学将运用InternetII进行现代远程教育,75%的美国高校将出示网络教育[2]。美国高校的现代远程教育选用了各种各样方式方法,选用数最多的是视频产品和根据Internet的信息科技,尤其是运用Internet的非同步教学、双重互动式的教学视频和单项式预录教学视频。英国的网络院校全是由很多有关的教育局或公司建立,而各网络院校中间又有十分普遍的联接,全部管理体系呈多孔结构,不管你要学什么专业知识和专业技能,到在网上都能寻找有关的材料和协助。不仅有专业对于教育信息化的、又有专业对于师资培训的、高等职业教育(成人继续教育、继续再教育和高等职业教育)的。在其中每一方面都牵涉到每门各种课程和整套的公共服务设施。全世界现有800多家高校根据Internet出示在网上学士学位课程内容,像哈福高校、麻省理工大学、牛津大学早已容许海外学员开展在网上申请注册、外地学习培训学士学位课程内容[3]。1996年英国群众中刮起致力于促进院校连接网络的“网络日”志愿服务活动,克林顿政府明确提出“教育信息化行動”纲要。该纲要强调:到2000年,全国各地的每个课室和每一个图书馆都联上信息内容高速路,每一个孩子都能在21新世纪的技术性文化艺术层面遭受文化教育。到迄今为止,一个遍布全国关键教育培训机构的网络已然产生,基本上全国各地全部的院校都能进行网络教育。在高等院校,网络教育所设立的文凭、学士学位课程内容已超出五万门,基本上遮盖了英国高等院校全部的课程和技术专业。研究的主要内容E网通网络教学系统,是一个可以在线观看视频的教学网站,分为前台用户系统和后台运营平台,主要根据用户的需求开发一些学院以及教育机构所需要的业务功能,使中学生在学校学习之余能够随时随地的进行学习。主要设置了账号注册登录、微信扫码登录、用户管理、教师管理、课程分类管理、课程管理等业务需求功能。系统开发的目的和意义中学生的学习成绩提升,是家长、老师和自身都希望的。网络发达程度没有非常高的时候,中学生去辅导班等培训机构进行课外线下辅导是非常常见的。但是,线下辅导由于各地区的发展程度不同,规模大小不同,讲师的水平不同,所以教学的质量有着非常大的差异,所以线下有一些试听课的开展,但即使这样,还是造成了大量的成本浪费。而现在网络发达了起来,只要学生拥有电脑和网络,就能点播学习自己在学校疏漏的知识或者提前预习新的课程。而基于网络开展的E网通网络教学系统则不同,为了让用户有更好的学习和提升自身的知识水平,实现个性化的东西,低价甚至开展一些免费的课程供学生点播,为广大的中学生提供性价比很高的资源。论文结构概述本章节介绍论文结构构成,总共有六个部分。对系统进行了从开始的技术意图到最后的设计与实现的描述,具体如下:第一部分对课题的产生背景进行了描述,E网通网络教学系统所致力要做的一个平台。第二部分是本系统对实现所需使用的技术进行说明介绍。第三部分是对本系统进行需求描述,包括对系统的可行性进行分析,对系统的功能需求进行进一步的详细分析,最终对系统所面向的对象进行描述。第四部分是对本网站进行设计,分为概要设计以及详细设计。第五部分是对系统的搭建及各个模块的实现和描述。第六部分是针对系统的各项功能进行测试,通过测试来查看系统所设计的功能是否有缺陷和漏洞。相关技术SpringBoot2014年4月,Pivotal研发团队提供的全新框架,它是对spring的进一步封装,其设计目的是用来简化应用的初始搭建以及开发过程,名为SpringBoot[4]。为了让开发者用的更加简易,通过封装、抽象、提供默认配置等方式对框架进行了大幅度完善。它的特点就是自动装配,在创建一个运行项目时候,springboot能够将所需要的配置信息和框架自动的封装起来,使用嵌入式的服务器程序,模块中的项目不需要进行打成war包,自动导入maven依赖,对快照版本、里程碑版本等版本进行控制,大量的自动配置,简化了开发,也可修改默认值,不用向ssm一样配置复杂的xml文件,无代码生成,但可以引入MybatisPlus用代码生成器直接生成底层代码,开箱即用,准生产环境的运行时应用监控,与云计算的天然集成[5]。VueVue是一个国内开源非常优秀并且实用的前端框架[5]。他的特点是可以非常荣容易的与其他库向结合,并且对于一种增量的开发,它采用了尤底层向上层的设计,拥有能够及时的关注用户课件的视图层的核心库,十分简单易学。目前的前端开发非常流行浏览器的渲染,驱动单个文件,单个页面能够应用的组件,这些内容vue都能有流畅的运行。由于之专注于视图层,所以开发很容易上手,方便和其他的api或者后端接口进行整合。并且不会产生冲突和兼容问题,能完美的运行单页面应用。MyBatisPlusMyBatis-Plus是一个Mybatis增强工具包,在MyBatis上扩充了其他功能没有改变其基本功能,简化CRUD操作,启动加载XML配置时注入单表SQL操作,为了简化开发提交效率而存在。具有无侵入、损耗小、内置分页插件并且支持多种数据库等特性。其核心功能有:代码自动生成器、crud接口、条件构造器、分页插件、Sequence主键、自定义ID生成器。SpringCloudSpringCloud是一个基于SpringBoot实现的微服务架构开发工具,它是一系列框架的有序集合。它不只是解决微服务的某一个问题,而是一个解决微服务架构实施的综合性解决框架,并且它整合了诸多被广泛实践和证明过的框架作为实施的基础部件,又在该体系基础上创建了一些非常优秀的边缘组件;系统需求软件需求指的是用户对这个软件的功能、性能、安全性、可靠性等方面的一种需求期望。一个软件的实现通常有一套规划的周期。前期要对系统进行可行性分析,确定可行后对详细的功能进行需求分析,对系统进行设计,以及中期的编码,测试,到最后的项目测试,上线达成一个完整的周期。而需求分析则占据了举足轻重的位置,对系统后续的实现有着铺垫的作用。可行性分析社会可行性分析基于在线教育的特点和优势,其越来越受到现代人的认可,很多人开始选择在线教育,特别是白领一族和大学生们,与此同时,各类新兴的网校及相关网站也不断涌现。这表示在线教育已经逐渐走进大众的生活并成为一种学习的主流趋势。据统计仅在2012年一年时间里,中国在线教育市场份额已经达到723亿元,在线教育用户呈规模性扩大[8]。各大中小学校通过建立在线教育网络和公共教学资源库,以加强学校、老师和学生之间的相互交流沟通,提高教学质量,建设精品课程,宣传学校的教育实力。技术可行性分析在我接触这一个全新领域时,我开始寻找大量的文献,以及去图书馆翻阅书籍,加上和周围同学们的相互讨论,我开始逐步深入了解springBoot技术和SpringCloud技术,但是毕竟是第一次接触,这对我来说是一个新的开始,也是一个全新的方向,但虽说如此,我对自己的要求还是比较的高,这样才能给我努力的方向,经过多番的努力,终于得到了回报,我可以做一个简单的案例,渐渐的对这个技术有了大概的了解。在我的导师王老师的指导,以及与周围同学的讨论中发现,宏观的去了解一个技术,这是掌握好这一项技术的首要基础。为了解决开发中的每一项重点难点,以及在技术的选择上,还有去进行考虑设计架构在现有的平台上。只有一个数据库可以去访问,这是一般的系统模块所实现的,但如果想去获取其他数据库数据,这就只能通过调用服务接口才可以,并且系统中的业务逻辑以及适配器,都有自己相对应的一系列组件,它们能供很多地方去使用,比如应用客户端。新系统的功能都是按系列去划分的,每一个系列都有其独特之道,根据自己的使用方向,去选择相对应的功能,比如登录管理,发布课程,后台配置等等,这就是用springBoot开发系统的独特之处。时间可行性分析本次的给予我去完成基于E网通网络教学系统的时间加起来是非常的充裕的,可以让我有充裕的精力去搜寻一些灵感,去开阔自己的思维,或者和周围的同事进行分析。综上所述个人觉得在时间层面这一个系统可以实现的。经济可行性分析本网站教学系统是基于vue网页模版,以及成熟且开源的库Node.js,只需要本地进行响应的配置安装,便可以开发,适当的图片UI设计在阿里巴巴上面也有开源库Iconfont,由于前端开发具有轻量级特点,对操作环境没有太大的要求,系统不需要很强的经济支持,无需投入太多精力。从而开发所需要的资金投入不会很大,所以实现此需求的成本是可以忽略不计的,软件开后中数据源以及产品源的提供,需要编辑进行处理。货源也各大厂商洽谈,前期可做免费的商品推广。在后期发展成熟后,可在完善系统货源,丰富提供商。系统只需要配置一台服务器,而阿里云服务器也被各大公司使用,新浪云服务器也应用与项目的开发,便可以通过域名方式被各个浏览器所访问,同时微信端也提供了开发者API可提供内置方法供用户方便使用。从经济上来分析是可行的。功能需求分析功能性需求分析是以用户身份来提出需求并对此展开系统所需实现的功能的一种分析方式。本文结合用户所需来实现主题的功能,主要功能如下:(1)系统后台 (管理员使用)管理员首先能够登录系统,只需要输入用户名和密码就能够跳转到E网通网络教学系统的后台管理页面;管理员能够操作教师,其中添加教师做为一个单独的页面用来填写基本的教师信息和上传头像,另外一个页面管理员能够对教师进行分页查询,并且可以通过名字的模糊查询和创建时间等信息搜索到讲师,并且符合条件的教师显示在页面的同时还可以进行修改和删除;管理员能够操作课程分类,课程分类的设置可以通过文件的上传然后进行解析插入到数据库,并在课程分类页面进行显示,并且可以通过关键字搜索到符合条件的课程类别;管理员能够对课程进行发布、课程修改、课程删除和课程的分页查询,在课程添加的时候,可以对课程的章节进行增删改,课程详细描述的编辑可以通过富文本编译器,课程的封面可以上传图片,在添加课程章节的时候,可以对课程的小节进行增删改,在课程添加小节的时候,可以对课程的视频进行添加和删除。(2)系统前台(用户使用)用户可以在本网站进行注册;用户可以登录,登录的时候可以选择默认登录和微信登录,用户使用默认登录的时候需要填写用户名和密码,微信登录的时候直接扫描微信二维码进行跳转;在登录到首页面之后,用户可以通过点击头像到个人中心查看自己的基本信息;用户可以在教师页面查看教师并进行搜索,并且可以点击教师的头像查看教师的详细信息;用户可以到课程页面通过点击分类信息索引符合条件的课程进行索引显示,并且可以点击课程进入课程详细页面,有课程的具体内容包括课程的章节和小节,点击小节种的视频可以跳转到视频页面进行学习。面向对象分析面向对象分析是考虑实际设计中的模块需求,将一个个需求想象成一个个对象,进行抽象的对象设计,来达到实现系统设计的目的[9]。普通的受众群体是这个系统的主要面向,每一个人可以在平台首页上面去根据自己的不同去注册之后然后选择登录,然后就可以用这个产品了。通过示例图以及分析,就能明白用户需要的各类课程和名师。系统后台用例关系实现了管理管理员模块,主要是对讲师信息的操作;课程分类管理模块,主要对课程分类进行管理;课程模块,用于课程的操作和发布。系统后台模块用例图如图3-1所示:图3-1系统后台模块用例图系统前台用例关系登录和注册功能,个人中心,首页数据显示,讲师列表+详情,课程列表+详情,视频在线播放系统前台用例图如图3-2所示:图3-2系统前台模块用例图系统设计概要设计本系统将分为以下几个模块:讲师模块、课程分类模块、课程模块、系统前台模块、视频上传模块,文件上传模块。每个模块之间使用Fegin进行调用,使用户对功能能够有一个明确的直观感受,概要的模块划分如图4-1所示:图4-1系统模块图详细设计注册模块详细设计进行用户注册步骤时,用户先将注册信息填到注册框里面,点击注册,会先查询数据库对用户的信息进行判断,如果没有用户的相同的用户名,就会在数据库中输入所插入的数据信息完成注册,跳转到登录页面。如果有相同的用户信息,就会有错误提示,并且让用户修改注册信息。大致的逻辑流程图如4-2所示:图4-2注册流程图登录模块详细设计用户登录模块应当包含操作用户相关的内容,点击登录,会将所输入的信息到数据库进行查询,看是否能够查询到输入的信息,如果查询到,就会完成登录进行跳转。另外该模块还包含微信登录的功能。微信登录功能需要注册企业开发者资质,但是因为没有企业证书进行注册,只好借用尚硅谷的一个注册好的微信id和密钥生成二维码。每次用户打开PC端登陆请求,系统返回一个唯一的uid,并将uid的信息绘制成二维码返回给用户。这里的uid一定是唯一的,否则就会造成你登陆了其他用户的账号或者其他用户登陆你的账号。用户使用登陆后的微信扫描该二维码的时候,会将这个id和手机上的微信账号及密码产生的token进行绑定,向服务器发送请求跳转到首页面[10]。大致的逻辑流程图如4-3所示:。图4-3登录流程图个人中心模块详细设计用户点击个人中心,会先对用户的登录信息进行判断,如果用户未登录,则会跳转到登录界面让用户登录,如果以登录,则会跳转到用户的个人中心。大致的逻辑流程图如4-4所示:图4-4个人中心流程图搜索模块详细设计用户只进入主页面之后,可以输入信息对课程或者教师进行分页显示,如果输入信息无误,符合条件的课程或者教师会在页面上进行分页展示。如REF_Ref481435953图4–5用户登录流程图所示:图STYLEREF1\s4–5用户搜索流程图课程管理模块详细设计管理员对课程进行添加的时候,会先对课程的基本信息进行编辑。其中包含具体的主讲教师,课程所属的一级分类和二级分类,和课程名称,课程封面等其余的一些课程的必须信息。编辑课程信息完毕之后,会对课程的大纲进行编辑,其中包含课程的章节和小节,每一个课程中可以包含多个章节,每一个章节中可以包含多个小节,小节的信息里面可以包含所需要上传的视频。视频上传的时候是将该视频上传到阿里云服务中的视频控制台服务器中。上传成功之后,会返回一个视频id和视频的解析码。在视频播放的时候。前端用户可以在点击视频的时候,获取到视频id和解析码对视频进行观看。大致的登录流程图如4-6所示:图STYLEREF1\s4–6课程发布流程图教师管理模块详细设计管理员对教师信息添加的时候比较简易,在选择教师所属的课程一级分类之后,再对教师的各项信息进行填写,其中包含教师的头像上传。头像上传的时候是将教师的头像以jpg的类型上传到阿里云oss平台。最终进行信息的添加。大致流程图如4-7所示:图STYLEREF1\s4–7课程发布流程图数据库设计数据库设计是在一个给定的应用环境(数据库管理系统),通过有效合理的逻辑设计和物理设计,有一个更好的数据库模式的结构模型,建立数据库和应用程序设计,满足各种信息需求的用户[11]。数据库概念设计功能概要设计是系统所需实现功能的概要设计,基于E-R图来描述。E-R图也称实体-联系图(EntityRelationshipDiagram)[12],提供实体类型与属性的相互关系,描述系统当中事件的概要模型。这是现在软件设计当中表示关系概念模型的一种有效方式。E-R图使用矩形框来表示事件当中的实体类型,椭圆形框则来表示实体类型所关联的对应属性,菱形框则表示实体类型与实体类型之间的关系。关系之间相连的两条线则是表示两个实体类型之间的关系,分别包括一对一(1:1)、一对多(1:n)、多对多(n:m)[13]。(1)管理员发布资源流程为多对多关系,可以发布任意的资源,ER图如下图4-8所示: 图4-8资源ER图(2)管理员添加教师一对多关系,任意的用户可以添加任意的留言,ER图如下图4-9所示:图4-9添加教师ER图(3)管理员发布课程为一对多关系,多个管理员可以发布多个课程,同时每一个课程可以发布很多章节,每一个章节可以分为很多小节,每一个小节可以拥有一个课程视频可以被多个用户所查看,同样是多对多关系,具体的ER图如下图4-10所示:图4-10课程发布ER图数据库表结构设计表结构是对数据库中表设计的展示,好的系统往往具有合理的数据库设计,遵循数据库表设计的范式,下面是本系统中具体的数据库设计表:(1)教师表(edu_teacher):代表教师的基本信息,教师的头像是存的是上传图片之后的url,如表4-1所示:表4-1用户表列名数据类型长度字段说明th_idnchar22教师idth_namenchar66教师名字th_intronchar600教师简历th_careerbigint600资历th_levelbigint11教师头衔th_avatarnchar255头像th_sortsmallint10教师排序th_is_deletetinyint1教师逻辑删除th_gmt_createdatetime教师创建时间th_gmt_modifieddatetime教师更新时间(2)课程章节表(edu_chapter):代表课程章节的详细信息,其中外键连接着课程id用来进行章节的存储,如表4-2所示:表4-2用户信息表列名数据类型长度字段说明chapter_idnchar22用户章节IDcourse_idnchar55课程IDcourse_titlenchar60章节名称course_sortbigint120显示排序course_gmt_createdatetime创建时间course_gmt_modifieddatetime更新时间(3)课程表(edu_course):代表课程的信息,包含课程一级分类和课程二级分类用来对课程的类型进行区分,如表4-3所示:表4-3身份表列名数据类型长度字段说明ke_idnchar21课程IDteacher_idnchar22课程讲师IDsubject_idnchar22课程专业IDsubject_parent_idnchar22课程专业父级IDke_titlenchar60课程标题ke_pricenchar9课程销售价格ke_lesson_numint9总课时ke_covervarchar300课程封面图片路ke_buy_countbigint12销售数量ke_view_countbigint12浏览数量ke_versionbigint18乐观锁ke_statusvarchar9课程状态ke_is_deletedtinyint2逻辑删除ke_gmt_createdatetime创建时间ke_gmt_modifieddatetime更新时间(4)课程类别表(edu_subject):储存了课程的一级二级分类,用来区分课程类型,如表4-4所示:表4-4留言表列名数据类型长度字段说明fl_idsmallint21课程类别IDfl_titlevarchar8类别名称fl_parent_idvarchar33父IDfl_sortvarchar2排序字段fl_gmt_createvarchar创建时间fl_gmt_modifiedint更新时间(5)课程视频表(edu_video):包含课程的视频章节小节,外键是课程id和章节id,并且每一个小节可以上传一个视频,如表4-5所示:表4-5资讯表列名数据类型长度字段说明vod_idvarchar18视频IDcourse_idvarchar16课程IDchapter_idvarchar20章节IDvod_titlevarchar20节点名称video_source_idvarchar80云端视频资源video_original_namevarchar80原始文件名称vod_sortint12排序字段vod_play_countint18播放次数vod_is_freetinyint1是否可以试听:vod_durationfloat视频时长(秒)vod_statusvarchar22Empty未上传vod_sizebigint22视频源文件大小vod_versionbigint22乐观锁vod_gmt_createdatetime创建时间vod_gmt_modifieddatetime更新时间(6)课程描述表(edu_course_description):包含四个字段,存储课程的详细描述,如表4-6所示:表4-6课程描述表列名数据类型长度字段说明ds_idvarchar12课程IDdescriptiontext600课程简介ds_gmt_createdatetime创建时间ds_gmt_modifieddatetime更新时间(7)轮播图表(edu_course_description):包含了轮播图的连接地址,如表4-7所示:表4-7轮播图表列名数据类型长度字段说明banner_idvarchar20IDbanner_titlevarchar20标题banner_image_urlvarchar20图片地址banner_link_urlvarchar60链接地址banner_sortvarchar120排序banner_is_deletedvarchar120逻辑删除banner_gmt_createdatetime22创建时间banner_gmt_modifieddatetime22更新时间(8)课程表(ucenter_member):代表用户的基本信息,在登录注册和查看个人中心的时候可以用来查询判断和插入,如表4-8所示:表4-8用户表列名数据类型长度字段说明usr_idvarchar21会员idusr_openidvarchar21微信openusr_mobilevarchar22手机号usr_passwordvarchar21密码usr_nicknamevarchar60昵称usr_sexdevimal10性别1女usr_ageint8年龄usr_avatarvarchar300用户头像usr_signbigint20用户签名usr_is_disabledbigint20是否禁用usr_is_deletedbigint30逻辑删除usr_gmt_createdatetime3创建时间usr_gmt_modifieddatetime3更新时间系统实现系统平台搭建本地java环境Java环境是先下载所需要版本的jdk,本系统使用的是jdk1.8,然后选用默认配置进行安装,最后在windows系统中对环境变量进行设置。查看是否安装成功用java-version命令执行。本地Node环境宏观上来说Node.js是一个运行在服务端的JavaScript,是一个采用时间驱动的服务端JS环境,并且基于可以非常快速执行的谷歌V8引擎,所以Node.js的执行效率也是非常的高,性能很好[14]。本系统的前端便采用的Node环境运行,前端通过发送请求接受传回来的Json数据与后端进行交互。安装的步骤非常简单,去官网下载Windows版本Node,打开安装版进行安装即可,然后可以使用命令node-v来查看Node版本。服务器Mysql环境服务器去官网上下载5.6版本进行安装,然后用SQLyog用具进行操作,再服务里面将Mysql服务开启并进行登录。本地Redis环境服务器去官网上下载2.6版本进行安装,然后用redis-serverredis.conf命令进行开启服务。本地Nginx环境Nginx.conf配置文件里面添加服务器访问路径用来请求分发,其中包含用户模块,后台模块,微信注册模块,轮播图模块,文件上传模块,视频上传模块的请求路径。Nacos注册中心首先需要搭建Nacos注册中心,将所以需要启动得模块注册到这里面来,以达到各个模块之间相互通信调用的目的。需要在启动类上加上@EnableDiscorveyClient注解来标识这是一个Nacos注册中心服务器[15],并且在配置文件中配置客户端的访问地址,端口后等。搭建成功后如图5-1所示:图5-1Nacos注册中心界面注册登录模块本系统的登陆模块属。根据登录要求用户把用户名与密码填写到输入框,若密码与帐号错误系统会给出相应提示,若是自己输入错误,可以点击左边的重置按钮,进行重新填写,若用户信息完全正确,点击确认后,在数据库中通过校验后,就会进入系统的主界面,点击退出“按钮”,则会退出系统。此外,为了用户的更好体验,左下角设计的有是否记住密码的选项框,方面用户下次免输入密码可以直接登录页面。登陆注册界面如图5-2所示:图5-2用户登录注册界面核心代码如下:classUMC{@AutowiredprivateUMSmS;@PostMapping("/login")QlU(@RequestBodyUMuM){Stringtoken=mS.login(uM);returnQ.ok().data("token",token);}@PostMapping("/register")QrU(@RequestBodyRVorVo){mS.register(rVo);returnQ.ok();}@GetMapping("/getMemberInfo")publicQgMI(HttpServletRequestrq){StringmId=JwtUtils.getMemberIdByJwtToken(rq);UMm=mS.getById(mId);returnQ.ok().data("userInfo",m);微信登录模块每次用户打开PC端登陆请求,系统返回一个唯一的uid,并将uid的信息绘制成二维码返回给用户。这里的uid一定是唯一的,否则就会造成你登陆了其他用户的账号或者其他用户登陆你的账号。用户使用登陆后的微信扫描该二维码的时候,会将这个id和手机上的微信账号及密码产生的token进行绑定,向服务器发送请求跳转到首页面。核心代码如下:Stringcallabck(Stringcd,Stringst){try{StringbaseATU="/sns/oauth2/access_token"+"?appid=%s"+"&secret=%s"+&code=%s"+"&grant_type=authorization_code";StringaTU=String.format(bATU,ConstantWxUtils.WX_OPEN_APP_ID,ConstantWxUtils.WX_OPEN_APP_SECRET,code);StringaTI=HttpClientUtils.get(aTUrl);HttpClientUtils.get(aTU);Gsongson=newGson();HashMapmAT=gson.fJson(aTI,HashMap.class);Stringa_t=(String)mAT.get("access_token");Stringoid=(String)mAT.get("oid");UMm=mS.getOIdM(oid);if(m==null){StringbUIU="/sns/userinfo"+"?access_token=%s"+"&openid=%s";StringuIU=String.format(bUIU,a_token,oid);StringuI=HttpClientUtils.get(uIU);HashMapuIM=gson.fJson(uI,HashMap.class);Stringnkn=(String)uIM.get("nkn");Stringhiurl=(String)uIM.get("hiu");//头像m=newUM();m.sOpenid(oid);m.sNickname(nkn);m.sAvatar(hiu);mS.save(m);}StringJT=JwtUtils.gJT(m.getId(),m.gNkn());return"redirect:http://localhost:3000?token="+JT;用户搜索模块用户在登录之后,教师和课程的封面和对应信息显示到了首页面上。用户可以选择课程或者名师跳转到相应的资源页面,并且用户可以选择相应的分类条件进行条件查询。例如课程界面,当用户选择一级分类例如语文,下面就会弹出相应的二级分类例如必修一,就会向服务器发送请求同时携带者分类信息等条件,在数据库中进行查询,最后会将数据返回给前端页面展示,搜索模块如图5-4所示:图5-4课程搜索界面核心代码如下:QpLCC(@PathVariable("c")longc,@PathVariable("l")longl,@RequestBody(required=false)CQcQ){Page<EC>cP=newPage<>(c,l);QueryWrapper<EC>wr=newQueryWrapper<>();Stringti=cQ.gT();Stringst=cQ.gS();if(!StringUtils.isEmpty(ti)){wrapper.like("ti",ti);}if(!StringUtils.isEmpty(st)){wr.eq("st",st);}cS.page(cP,wr);longto=cP.gTotal();List<EC>r=cP.getRecords();returnQ.ok().data("to",to).data("re",re);视频播放模块管理员在添加课程的时候,插入小节时可以对小节进行视频的添加,视频存放的地址是阿里云的oss控制台对应的服务器。在视频上传成功之后,会得到上传的视频id和凭证,可以通过视频的凭证对视频进行播放。在该模块中将视频的凭证和id存入了本地的数据库,在视频播放模块里查询数据库获取到视频凭证返回给前端。用户点击视频请求就会携带凭证进行访问,就可以视频的播放。视频播放模块如图5-5所示:图5-5视频播放界面核心代码如下:RgPA(@PathVariableStringid){try{DefaultAcsClientclient=InitObject.initVodClient(CotVodUtils.ACCESS_KEY_ID,CotVodUtils.ACCESS_KEY_SECRET)GetVideoPlayAuthRequestrequest=newGetVideoPlayAuthRequest();request.setVideoId(id);GVPARr=cl.gAR(request);StringpA=r.gPA();returnR.ok().data("pA",pA);}//视频上传获取凭证StringulVAly(MultipartFilefile){try{StringfN=file.getOF();Stringtitle=fN.sub(0,fN.lIO("."));InputStreamiS=f.getIS();UploadStreamRequestr=newUploadStreamR(ConstantVodUtils.ACCESS_KEY_ID,ConstantVodUtils.ACCESS_KEY_SECRET,title,fileName,inputStream);UVIuploader=newUploadVideoImpl();UploadStreamResponser=uploader.uS(request);if(response.iS()){returnresponse.getVId();个人中心模块在用户登录完界面之后,若需要修改自己的各项信息,点击个人中心的时候会发送请求先查询一次数据库,将用户的各项信息返回到页面上。用户可以对信息进行修改最终进行提交,最终将修改后的信息保存到数据库中。和人中心界面如图5-6所示:图5-6个人中心界面核心代码如下:QgetMIf(HttpServletRequestrq){StringmId=JwtUtils.getMemberIdByJwtToken(rq);//查询数据库获取用户信息UcenterMembermb=memberService.getById(mbId);returnQ.ok().data("uI",mb);}UMgetOIdM(Stringoid){QueryWrapper<UcenterMember>wrapper=newQueryWrapper<>();wrapper.eq("oid",oid);UMmb=baseMapper.selectOne(wrapper);returnmb;课程分类模块管理员可以通过查看课程分类区分课程的一级分类和二级分类。若课程的分类需要修改或者想重建新的分类。在增加课程列表里面可以通过上传excel文件对课程分类进行上传,阿里云的EasyExcle解析将文件解析成普通数据存入到数据库。课程分类管理界面如图5-7所示:图5-7课程分类模块界面核心代码如下:List<OneSubject>getAllSubject(){QueryWrapper<EduSubject>wrapperOne=newQueryWrapper<>();wrapperOne.eq("parent_id","0");List<EduSubject>oneSubjectList=baseMapper.selectList(wrapperOne);QueryWrapper<EduSubject>wrapperTwo=newQueryWrapper<>();wrapperTwo.ne("parent_id","0");List<EduSubject>twoSubjectsList=baseMapper.selectList(wrapperTwo);List<OneSubject>oneSubjects=newArrayList<>();for(inti=0;i<oneSubjectList.size();i++){EduSubjectsubject=oneSubjectList.get(i);Stringid=subject.getId();Stringtitle=subject.getTitle();OneSubjectoneSubject=newOneSubject();oneSubject.setId(id);oneSubject.setTitle(title);oneSubjects.add(oneSubject);List<TwoSubject>twoSubjects=newArrayList<>();for(inta=0;a<twoSubjectsList.size();a++){EduSubjectsubject1=twoSubjectsList.get(a);Stringid1=subject1.getId();StringparentId=subject1.getParentId();Stringtitle1=subject1.getTitle();if(parentId.equals(id)){TwoSubjecttwoSubject=newTwoSubject();twoSubject.setId(id1);twoSubject.setTitle(title1);twoSubjects.add(twoSubject);}}oneSubject.setTwoSubjects(twoSubjects);}returnoneSubjects;课程管理模块该模块包括课程的发布和课程的查询、修改和删除。其中发布的课程需要先对课程的基本信息进行添加,其中需要添加课程的一级分类和二级分类,课程的简历是用到了文本编译器进行编译。完成之后对课程的大纲进行编写,包含课程的课程的章节和小节,小节中可以上传视频。课程的查询可以查询到课程的所有信息,修改和删除也在课程列表页面,可以对课程进行增删改查。课程发布界面如图5-8所示:图5-8课程管理界面核心代码如下:StringsaveCourseInfo(CourseInfoVocourseInfoVo){EduCoursecourse=newEduCourse();BeanUtils.copyProperties(courseInfoVo,course);intinsert=baseMapper.insert(course);if(insert==0){thrownewGuliException(20001,"添加课程信息失败");}Stringcid=course.getId();EduCourseDescriptioneduCourseDescription=newEduCourseDescription();eduCourseDescription.setDescription(courseInfoVo.getDescription());eduCourseDescription.setId(cid);courseDescriptionService.save(eduCourseDescription);returncid;}教师管理模块教师模块中分为两个页面,其中教师列表可以对教师进行删除、修改、和条件查询,添加教师页面可以添加授课教师。条件查询会根据页面上的表单里面的信息发送查询请求,在并将当前页和每页查询的记录数携带给控制层,调用mybatisPlus里面封装好的方法进行条件查询,最终将结果返回。教师的添加中包含教师的头像上传,需要将教师的头像发送到阿里云的服务器中保存,将路径存入本地数据库,用户查看前端的时候会直接通过保存的url对资源进行访问,显示到相应的位置。教师列表界面如图5-9所示:图5-9教师管理模块界面核心代码如下:EduTeacherServiceteacherService;@GetMapping("findAll")publicRfindAllTeacher(){//service的方法查询所有操作List<EduTeacher>list=teacherService.list(null);returnR.ok().data("items",list);}@DeleteMapping("/{id}")RremoveTeacher(@ApiParam(name="id",value="讲师ID",required=true)@PathVariable("id")Stringid){booleanflag=teacherService.removeById(id);if(flag){returnR.ok();系统测试E网通网络教学系统开发后必须要经过测试的步骤,只有通过了测试才能正式使用。开发每个系统都需要经过测试的步骤,这是一个非常重要和必要的过程,以实现设计的必要阶段。测试结果与总结E网通网络教学系统测试方法主要是分为系统的白盒测试和系统的黑盒测试。白盒测试:白盒检测法是一种方法,即着重内部结构合理设计一套系统,作为主要基地制定案件也称为考验,考验结构或测试工具。正如我们作为一个具体设计程序,只有对其内部结构和测试的逻辑、某些逻辑、软件开发,为测试程序之前受到严格程序设计和设计最佳。黑盒测试:黑盒测试,正如我们进行功能测试,应被视为测试数据的系统,我们期待着程序测试结果,没有考虑到程序的内部结构和特征所依据的只是系统的规格制订以核查方式运作所有职能[21]。E网通网络教学系统通过黑盒测试,测试过程中主要是根据输入条件和输出条件的确定测试数据,来检查程序是否满足了用户的需求,是否能够正常运行。进行黑盒测试主要有下面几种方法:等价分类法、边界值分析法、猜错法、因果图法。6.2测试结果与总结为了测试系统软件的功能,为了使系统更完善,并在系统测试中,我们将尽量添加真实有效的数据,从而使系统的功能更加真实。系统测试时要做到对每个功能都进行测试,才能找出系统存在的问题。给出解决方案,最终系统可以正常运行。6.3系统测试用例测试描述:用户在登录时可以进行密码找回的操作,下面将进行模块的测试。如表6-1所示。表6-1模块测试模块名称模块测试功能特性已注册的用户登录系统测试目的验证是否全面,模块设计是否实现用例编号测试步骤输入数据预期结果测试结果DL001用户登录点击登录按钮跳转到页面成功DL002输入错误账号输入错误账号和密码,点击登录提示登录失败成功DL003输入正确账号输入正确账号和密码,点击登录提示登录成功成功DL004微信扫码点击微信按钮跳转到首页成功(2)前台资源功能测试描述:用户登录可以在系统中查看老师,查看课程,查看个人信息,视频点播,下面将进行前台资源模块的测试。如表6-2所示。表6-2前台资源模块测试模块名称前台资源测试功能特性已注册的用户登录系统测试目的验证E网通网络教学系统是否全面,教学模块功能是否实现用例编号测试步骤输入数据预期结果测试结果DL001查看个人中心点击个人中心显示个人信息成功DL002课程搜索点击一级分类,点击二级分类锁定到具体课程成功DL003查看教师点击教师查看显示照片个教师信息成功DL004视频播放选择小节点击视频视频播放成功本章探讨了功能和查看用户信息功能,并有证据表明,测试开发进程是非常富有成效的由于时间篇幅有限,不能一一进行文字描述,对于出现的一些小问题已经通过和老师的沟通
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 《挑战与机遇:未来教育发展趋势》课件
- 《痔疮并发症的防治》课件
- 《建筑施工安全》课件
- 网络法律故事阅读活动投稿流程指导课件
- 二年级语文下册 课文6 19大象的耳朵教学设计 新人教版
- 四川托普信息技术职业学院《俄语写作实践》2023-2024学年第二学期期末试卷
- 山西财贸职业技术学院《商务礼仪》2023-2024学年第二学期期末试卷
- 宜昌科技职业学院《信息理论与编码》2023-2024学年第二学期期末试卷
- 梧州学院《3Dmax进阶动画》2023-2024学年第二学期期末试卷
- 松原职业技术学院《语言专业第二外语法语》2023-2024学年第一学期期末试卷
- GB/T 25146-2010工业设备化学清洗质量验收规范
- GB/T 212-2008煤的工业分析方法
- GB/T 17390-2010潜油电泵拆卸报告的编写
- GB/T 10822-2003一般用途织物芯阻燃输送带
- 班主任工作坊活动方案
- 国开电大 管理概论 形考任务一(画组织结构图)
- 三自由度并联机器人结构设计
- 仓储装卸服务合同
- 式双钩五点安全带培训课件
- 名片设计 课件
- 钳工实操评分表(凹凸配合)
评论
0/150
提交评论