基于springboot的学生考试管理系统的设计与实现

第一章绪论1.1.选题的背景与意义1.1.1选题背景在因特网茁壮成长的当下，互联网已经家喻户晓，人类社会融入大数据时代，大数据和人工智能逐渐成为推动社会飞速前进的强大动力。我们可以在网上简便地获取数不胜数的信息。除了企业、政府的日常工作需要网络协助，教育机构也是需要网络支撑来完善教育模式。在线教育方式已经成为当今教育领域重要前进方向，线上考试是在线教育的一个关键组成，也慢慢变成一个重要的研究领域[1]。我国作为一个教育大国，考试模式在整个教育环节中有着无可替代的位置，在线考试、网上面试等全新的选拔人才的方式得到普遍使用。然而，我国的考试模式还有待更好改善，线上考试的方式在目前教育环境下不普及。就当前国内的学校而言，大部分考试仍采用传统笔试模式，线上考试的实际运用只在少数网上报名和国家级重大考试，至今我国也没有线上考试计划蓝图。线上考试系统作为现代教育的重要成员，是提高我国教学水平的重要保障[2]。因特网技术的飞速前进带动考试的技术手段和模式产生历史性的转折，因特网的便捷性、广泛性和强大的计算能力促使考试摆脱了时间和空间的约束。大数据时代下，考试系统的新模式开始成为人们研究的焦点。在传统考试模式的衬托下，线上考试具有更多的优势，它容纳传统考试过程中的试卷组织、发放、回收、统计、批改等每个步骤，从根本上解决了人为直接干预考试的问题，即节省时间，释放出更多的人力、财力和物力，还优化考试的科学性和公平性。线上考试系统的出现是由于目前教育形式信息化和教育信息化建设的实施，主要为了采取学校拥有的网络资源实现在线考试的模式致力于弥补笔试考试模式的缺陷[3]。信息化线上考试模式作为网上远程教育的关键性成员，在国外发达地区已经得到广泛的运用，人们选修课程、做作业和考试都是借助网络来实现的。尤其是在互联网服务广泛运用之下，低成本高效率的线上考试，无论是技术上还是应用上都已经趋于成熟[4]。1.1.2研究意义线上考试系统提高了考试的可靠性、有效性、客观性，降低了考试成本，响应了大数据时代的号召，最终发展为一种无可替代的考试模式。基于线上考试是在考试模式上发生了震天撼地的改变，所以也会随之带来不可阻挡的问题，比如在缺失考场老师监考的环境下，怎样保证考试结果的真实性。这就需要借助于在线考试的自动组卷、自动批卷来解决了。光依靠监视不能从根本上解决考试的真实性，需从考试本身的问题入手[5]。我国传统考试的试卷都是由老师亲手制作，这样往往经常会造成试卷整体难度、知识覆盖面、试卷题量失衡，但是线下考试的公正性、真实性是毫无疑问的。使用计算机建立数据库并合理科学地不定期的管理试卷题库，加上自动组卷解决手工组卷所带来不必要的问题，减低成本、提高效率，信息化考试管理系统的优势越来越突出[6]。线上考试通过网络来实现，传统的笔试考试模式必须要有提前准备的考场和监考老师。但这些对于线上考试而言不是关键因素，所以在线考试能够降低成本以及人力、物力、财力。此外，借助于网络信息管理的考试系统自动批卷的强大功能，这从很大程度上减少了批卷人的工作量。学生参加考试不需要聚集在考场，而是可以通过电脑或手机等其他电子设备在任何地点参加考试[7]。市场上有其他自动考试系统，大部分都有自动评分系统，使用这些系统出的题目导致试卷过于整齐划一，或者知识点分配不当，最后还是要从出好的题库中选取已经成型的题目，对题库依赖性极高，试题的设计还要靠手动制造，费时费力。还有只有组卷，没有自动评分的系统[8]。在线考试、管理服务、自动组卷、自动批卷有机结合才能够最大化发挥线上考试系统的作用。1.2.选题的研究现状互联网带来的信息化让考试的载体发生了本质的变化，考试从传统的笔试到如今的线上考试。我国近年来也有诸多教育平台，百度传课、慕课网、腾讯课程、网易云课程等，各大教育平台除了讲师授课、学习视频、作业测试外，还有不同的考试系统[9]。线上考试在近几年，在国内外都取得了令人瞩目的成就。与传统的C/S模式相比，当今流行的B/S模式结合SSH开源框架设计具有灵活便捷，占用内存小的优势[10]；还有基于Web的LAMP体系，Linux为操作系统，Apache为服务器，MySQL为数据库，PHP为开发技术，具有强大的功能[11]；基于SpringBoot和JPA的在线考试，采用UML为语言，Layui作前端框架，Ajax提高系统的使用体感[12]。在我国，多数考试系统是都Browser/Web/DataBase的三层结构。在B/S中，用户一般会在网上发布一个由浏览器发送的要求，然后由服务器来完成对该消息的处理。而如今的浏览器可以让这个过程变得简单，通过使用Web浏览器，可以在服务器中直接存取数据库，而其它的资料查询、处理、结果回馈等则是使用WebServer来处理。该系统具有较低的设备配置、使用简便、易于维修等特点。软件开发人员可以简化应用、缩短开发时间，并且系统冗余程度低，易于维修和可扩展[13]。例如美国，考试就是通过网络进行的，其中有Microsoft的MCSE（MCSE）、GMAT（MBA）、托福（GRE）、美国（GRE）等多种考试方式，并将其用于实战考试。美国的网络测试体系具有科学性、正确性、效率性；抑制作弊现象、对考生进行动态的管理，和灵活的测试制度等诸多优点在教育领域大放异彩[14]。国外有种自适应化的考试系统，该系统可以自动地、交互地识别出各个学生的能力，并且测试学生在某个特定的专业上的表现，而非对分数进行对比。运用一种灵活的测验技巧，可以使考生在遇到比自己水平更困难的题目时，不会产生分心或失去动力，可以更好的测试他们的能力。系统的优势是测试所用的总时长减少、测试的管理更加灵活、能够自行规划、重复和评估过程。特别是在个人的教学中，该系统可以更有效率地识别出学生的“专业领域”[15]。通过查阅有关的资料，找到一种组卷算法进行了剖析。考虑到一人一题的特点，再加上office的特点，每个题目都是一个知识点，为了保证公平性，设置了一个相对稳定的题库。每一个知识点都要有一个标准，把考试的内容输入到系统中，然后利用平均的方法来计算出不同的难度。将这些组合状态输入到一个动态阵列中，再从难度清单中抽取一种新的困难，并根据该组合的困难程度，从知识点中选择一种新的组合。从给定困难域中随机抽取问题，通过将问题与问题来源进行结合，在若干次随机化后产生的问题更具随机性，并增加了问题的多样性[16]。此外，还有自动批卷系统。采用office的记录技术，从电脑试题中抽取Word和Excel中各个知识的特征，利用VBA组件技术，在计算机试题中完成Word和Excel的修改。记录每个知识要点的宏代码，获取相应知识的属性名称和相应的属性，再根据考试内容的标准答案，与之前获取的属性做对比，从而可以使每一张试卷自动化批卷。VBA组件技术可以很好地完成日常的教学和学生考试工作，避免了老师在手动批阅试卷等方面的繁琐，节约了大量的时间[17]。1.3.本文的研究内容本文主要研究和实现一种在线考试管理系统，前端选择vue框架，其灵活的API和轻型的渐进架构非常适合这种简便页面的系统；后端采取SpringBoot+MySQL，考虑到系统需要多种关系表、SpringBoot内置Tomcat、简化maven配置、具有Spring优秀的框架等优势，所以选择两者结合[18]。本文的研究重点是如何实现学生、教师、管理员各自的功能，前端页面设计，数据库设计，后端的数据传递设计；难点是如何实现考试功能、自动组卷、自动批卷。本文旨在为学生提供便于操作、便于维护、通用性强、可适应多种科目的测验与评估需求的通用型考试测验系统。为老师的考评搭建了一个评价平台；创造了学生在网上自主学习的环境；为各类课程的在线测试提供了一个平台[19]。因此，这一次系统开发，充分反映了当前的教育信息化发展的潮流，充分反映了网络技术和信息技术的应用。网络考试是一种有效的手段，可以有效地解决当前的教育教学中的测试问题，也是实现教育和教学的有效手段，也促使传统教学中的考试模式走向网络化方向[20]。1.4.本论文的结构安排第一章是绪论，对系统背景、研究意义、国内外有关的研究状况和本文的研究内容进行介绍。第二章是系统相关技术介绍，阐述了选择该技术的理由，分析相关技术的优势。第三章是系统分析与设计，对系统的具体实施，包括需求、技术选择、体系架构的构建、业务模型设计、模块设计、数据库设计，分析三种基本模型、建立数据表、梳理各个表之间的逻辑关系。第四章是系统实现，从登录功能、考试功能、组卷功能、用户管理功能、成绩查询功能进行介绍。第五章是系统测试及部署，主要阐述了系统的测试和配置。对功能进行测试，从用户登录运行、学生在线考试、教师自动组卷、学生成绩查询功能进行测试，并对系统在当地部署进行介绍。第六章为小结，对本文进行了总体概括，并对本文的研究结果进行了总结，分析不足之处以及对研究内容的展望。第二章系统相关技术介绍通过上文对系统各方面的分析、思考、总结。本章介绍系统的相关技术，系统采用SpringBoot进行实现，以SpringBoot和MySQL数据库为后端开发，Tomcat为服务器，vue作为前端开发技术的总体技术路线。2.1.Java介绍Java是Sun公司面向对象编程的新一代编程语言，它尤其适用于互联网应用，Java的出现和普及是当前互联网发展的必然趋势。java是一种性能优良的语言，具有语言简单、面向对象、分布式呈现、结构中立、可移植、性能优异、多线程、动态、安全、稳健的优点，尤其适用于互联网环境下应用系统的开发。SpringFramework是一个在Java平台上开放的开放源码应用程序，它为用户提供了丰富的Web架构。本课题使用IDEA编程，在代码自动提示、代码分析等方面具有很好的功能。2.2.Tomcat介绍Tomcat服务器是一种自由免费开源的Web程序服务器，是一种轻型的服务器。广泛用于中小规模及同时存取的使用者较少的情况下，具有强大的性能、适合多种应用、具有处理HTML页面的能力、同时也是Servlet的容器。Tomcat是Apache服务器的一个扩展，但是在本地它是独立运行的。本考试系统属于小型的系统，而且大部分的时候都不会被广泛且同时的使用。2.3.MySQL介绍MySQL是一种把数据存储到多张表格中的关系式数据库，它可以加快处理的效率，提高灵活性。MySQL为普通用户和中小企业所提供的能力是足够的，并且因为它是开源的，所以它可以极大地减少成本。SQL是MySQL中最常见的一种规范的语言，它可以用来存取数据库。它优化了SQL查询、为java语言提供了API、支持Window操作系统、可以作为一个独立的程序、拥有庞大的数据库。考试管理系统是一个将各种数据在各种表格之间进行直接传递、添加、删除、修改的流程的系统，系统后端采用SpringBoot+MySQL极大提高系统性能。2.4.MyBatis介绍MyBatis是一个出色的持久性架构，支持SQL定制化，以及先进的映射。可以用sql来实现对数据库的全部操作，提供xml标签，支持编写动态sql，和MySQL互补，更易维护。本系统是前后端分离，需要MyBatis服务数据库。2.5.Vue介绍vue是一个渐进的架构。建立使用者介面，方便与第三方库结合，而核心则专注于图层，适于建立简单的应用程序。它拥有非常灵活的API、轻型的结构、双向的数据锁、以及强大的组件等。vue易于其他项目整合，通过简单的API实现数据响应和组合的视图组件展现。2.6.SpringBoot介绍SpringBoot拥有Spring优秀的框架，最主要是SpringBoot简化了Spring应用的配置。内置Tomcat、能够创建独立的spring程序、简化maven配置、对编程没有限制等良好的性能使得SpringBoot在诸多应用领域蓬荜生辉。2.7.本章小结通过相关技术的介绍，确定本系统的基本架构以及呈现模式。前端vue+后端SpringBoot为整个项目框架，后端项目SpringBoot+MySQL介于MyBatis和前端打通，实现数据交互，最后通过vue组件展示页面。第三章系统分析与设计继上文系统相关技术介绍和技术路线的确定，本部分主要从系统的需求分析、架构、功能、数据库等方面展开细致的论述。3.1.需求分析3.1.1需求概述在线考试系统功能模块主要为三个部分：一个是面向学生端，包括账号登录、查看考试信息、参加考试、留言评论等功能。第二个是针对教师端，主要是账号登录和教师服务。第三部分是管理员，拥有教师功能以及权限管理。3.1.2研究目标实现一个考试管理系统；该系统主要包括身份验证、在线考试、信息编辑、成绩查询等功能；该系统必须以互联网为基础。（1）该系统主要面向管理员类用户、教师类用户和学生类用户。不同使用者可以使用不同的功能。管理员使用者拥有管理员功能；教师使用者拥有教师功能；学生使用者拥有学生功能。（2）系统主要目标是实现学生在线考试、教师服务管理。（3）及时更新考题，考题类型包含三种题型。通过系统管理员或教师来进行题库的更新，学生不可以管理题库。（4）实现系统网络化。3.1.3功能描述学生端模块登录功能：学生使用账号、密码登录。考试功能：学生可以在我的考试板块里，选择或搜索所需科目进行考试，查看试题信息、开始考试、选择题号、标记题号、提交试卷。成绩查询功能：学生可以在成绩板块进行成绩查看。留言功能：学生可以在留言板块进行留言评论。教师端模块登录功能：老师必须要有账号和密码才能登录，账号密码由管理员统一管理。考试管理功能：功能介绍、考试查询、编辑或删除考试信息。题库管理功能：功能介绍、题库查询、编辑题库、在线组卷。成绩查询功能：对学生成绩进行查询。学生管理功能：编辑、删除学生信息。管理员模块登录功能：管理员必须要有账号和密码才能登录系统。教师管理功能：管理员除了有教师的功能外，还可以编辑、删除教师信息。3.1.4登录与授权用户登录功能目的是为了控制使用者进出系统入口，只有那些达到了安全标准的人，方可使用。3.1.5性能需求（1）系统通过登录验证，来确保系统的安全性，防止非法用户进入系统，造成系统破坏；（2）系统可以被多用户使用；（3）对于小数据量的数据记录要在短时间内实现各种操作和传送数据信息；（4）系统响应速度快，不能有延迟，防止建立关系列表错误；（5）对输入输出的数据必须有相应的格式类型、数值范围及精度说明；（6）系统上手简单，不过于复杂，适用于绝大多数用户；（7）框架清晰，简洁大方，不能出现生字，怪子；（8）系统要符合法律条文，不应含有违法信息。3.1.6技术可行性分析目前的资源是否能够支持系统的研究和实现。人力、环境、设备、技术等，能够达到本工程的执行需求，如不符合，则要采取相应的补救办法，并最终决定该工程的技术可行性。（1）导师具有丰富的实践知识和良好的教学技能，并且学生有足够的时间和能力来进行学习。（2）项目将采用IDEA进行开发，软件稳定，应用范围广，主要应用vue、MyBatis、maven、MySQL、SpringBoot等。（3）目前，本课题所要求的软件、网络环境均已实现。（4）可利用的资源能够满足工程的需要，具有技术上的可行性。3.1.7用户使用可行性分析从在线考试系统的使用人员来看，可大致分为3类：（1）学生；（2）老师；（3）管理员；使用者的素质比较高，大多数都是学生，在校老师，在校领导等，因此可以很方便地使用系统。它具有良好的人机交互和简单的运行方式，能够很好地适应用户对系统的需求。3.1.8其他需求分析开放性：具有优秀的可扩展性和可移植性，系统遵循主流标准和协议。可用性：系统应功能齐全，操作简单便捷。规范性：系统应该符合主流系统的标准，界面、快捷键、语言、基本操作流程、交互等系统设置。3.1.9资料调研用户访谈调研，访谈是指在调研人与使用者进行面谈时，以获得使用者的实际需要的调研方式。采用招聘访问或走访访问的方式，可以方便、直观地获得多方面的信息。访谈准备：(1)用户职业背景；(2)现有管理系统环境的问题；(3)选择该系统的理由；(4)用户想要的功能，对系统的期望。3.1.10预期目标（1）系统使用人性化的人机交互，具有良好的用户界面、方便快捷的系统操作。（2）实现了管理员和老师独立管理考试、题库和学生等功能。（3）实现了学生在线考试，成绩查询等功能。（4）系统可维护性和可用性最大化。（5）实现系统自动组卷、自动批卷。3.2.架构设计3.2.1系统层次图系统层次是指在使用者介面与数据资料层的连结，而非单纯的连结，而是透过使用者的具体需要加以细致的归类。该体系由人员管理、考试管理、试题库管理、试卷管理和成绩管理五大部分组成。各子单元按照需要进行单元间的划分，以保证整个单元的完整。考试管理系统的系统层次图如图3-1所示：图3-1系统层次图3.2.2系统结构图系统结构图是一种用于对结构设计进行说明的方法。该图反映了一个体系（或函数）的层次划分、各组件间的联系、各组件间的数据、控制流程等的传输。系统结构图如图3-2所示：图3-2系统结构图3.2.3系统流程图系统流程图是一种传统描述系统的基本方法，它是系统的基本结构，通过流程图可以清楚的看到整个系统的运行状态。在这个体系中，考题和使用者都是基本数据信息，在数据层面上，支持了整个系统的运行。考试数据库和用户信息数据库是整个数据库的最基本部分。其中，试题库的内容包括试题库表、试卷信息表等与试题有关的资料。用户包括三种用户信息表，这些信息的作用是确定使用者的信息和所拥有的权利。系统流程图如图3-3所示：图3-3系统流程图3.3.业务模型设计3.3.1业务模型指导思想本系统的功能设计遵循使用者的观点，既要满足使用者的实际需要，又要满足使用者的合理要求。系统在满足用户要求、不改变整体系统的前提下，能够对其进行二次开发。3.3.2数据流程图数据流程图是指把数据独立抽取、用图表形式表示的系统的过程。从该模型中可以清晰地看到数据在系统流程中的流向和存储情况。数据流程图如图3-4所示：图3-4数据流程图3.3.3系统前后台结构功能图前台主要是在线考试，学生浏览主页面、查看考试信息、选择考试科目、学生在线考试、学生成绩查询与其他同学互动留言，如图3-5所示：图3-5前台结构功能图后台主要是为教师端和管理员服务，包括教师登录、考试管理、学生管理、题库管理、管理员登录、教师管理，如图3-6所示：图3-6后台结构功能图3.4.模块设计（1）学生模块：学生进行登录，登录成功后就可以对首页浏览，也可以直接开始考试、查看成绩或者留言，考试结束后继续浏览页面或退出系统，结束。流程图如下：图3-7学生功能模块（2）教师模块：教师进行登录，登录成功后可以对首页浏览，也可以直接对学生信息、学生成绩、数据库管理、考试信息进行操作，之后可以继续选择浏览页面或退出系统，结束。流程图如下：图3-8教师功能模块（3）管理员模块：管理员进行登录，登录成功后可以对首页浏览，也可以直接对教师信息进行管理，同时也有教师功能服务，之后可以继续浏览页面或退出系统，结束。流程图如下：图3-9管理员功能模块（4）添加信息模块：使用者根据自身权限和功能添加信息。流程图如下：图3-10添加信息模块（5）删除信息模块：使用者根据自身功能，实现信息删除，教师对学生、题库的管理，管理员对教师的管理等。流程图如下：图3-11删除信息模块3.5.数据库设计3.5.1模型分析建立数据模型数据对象：学生，教师，管理员。属性：共同属性：账号，密码。学生：姓名，性别，电话号码及其他个人信息。教师：姓名，性别，职称，院系，身份证号码，电话号码。管理员：权限。联系：学生和教师是多对一的关系，教师和管理员是多对一的关系，学生和管理员也是多对一的关系。根据数据模型的属性及联系构建系统E-R图，如图3-12所示：图3-12E-R图建立行为模型（1）学生服务；（2）教师服务；（3）管理员服务。建立功能模型实现简单的考试管理系统，学生不仅可以考试，还能够发言；教师和管理员共同服务此系统，还有管理员不定时的管理，维护，更新系统。图3-13学生功能模型3.5.2数据表的建立系统中，在登录或测试过程中，都需要对本地MySQL数据库进行存取和修改。因此，在数据库设计中，合理、有效的数据库设计可以保证系统运行更加平稳、快速。为加快数据库的存取，本系统使用数据集合的方法来存取数据库，使数据库的数据资料能被临时储存在已建好的数据库中，增加存取数据的快捷性，尤其适合一个需要多人使用的系统。从学生、教师、管理员的数据模型、行为模型、和功能模型分析，创建数据表。如下面三张表所示，每位用户都有自己的账号和密码进行系统登录，以及对应的相关属性。管理员的账号、密码、名字不能为空，拥有最高权限，数据库中的“admin”表拥有管理员的相关信息，如下表3-1中的信息：表3-1“admin”表教师的信息管理是由管理员设置，主要包括账号、密码、名字和其余附加信息，数据库中“teacher”表如下表3-2中的信息：学生的信息管理是由管理员和教师共同设置，主要包括账号、密码、名3.5.3数据库的逻辑实现多个测试模块都是在网页上进行数据库的操作，数据库设计非常重要，并且采用了一个统一的数据库来进行设计和维护，需要在不同表格之间实现各种功能，实现对应的业务逻辑。各个数据表间的业务逻图3-16数据表的逻辑流程3.6.本章小结从需求概述、功能模块、登录与授权、性能需求、技术可行性、用户使用可行性、资料调研、技术路线选取多角度分析和设计一个功能齐全、操作简易的考试管理系统。通过数据、行为、功能模型的建立，以及数据表三种用户基本信息的构建，梳理关键数据表之间的逻辑实现。在数据库的管理中，对这些表格进行了细致的设计。第四章系统实现通过前几章的论述，本章是对前面论述的总结并运用于实践，进行考试管理系统的实现。主要从系统的页面设计，功能实现两方面讲解。整个系统有视图层，控制层，业务逻辑层，数据持久层4部分构成，vue负责视图层，SpringBoot负责控制层和业务逻辑层，MyBatis负责数据持久层，最后还有一个MySQL数据库。4.1.登录功能1path:'/',2name:'login',3component:()=>import('@/components/common/login')vue前端页面显示以动态路route中组件的形式展现，一个页面可以由多个组件嵌套构成，即界面加弹窗、界面加界面的样式。浏览器访问系统，用浏览器搜索localhost：8088。第1行代码表示该路径为默认路径，访问成功后会跳转到第2行代码所指定的页面，即访问系统默认到登录页面，第3行代码表示目标组件所在位置。达到登录页面，可以通过点击事件和键盘事件在文本框里输入账号和密码，点击“登录”按钮进行登录。4login(){5console.log("登录操作执行");6this.$axios({7url:`/api/login`,8method:'post',9data:{10...this.formLabelAlign11}“登录”按钮的点击事件由click来监听，@click="login()"，当用户点击按钮时，就会调用“login()”方法。login()方法根据9到11行代码获取的用户信息，通过第6行的axios的http请求访问第7行api的接口。12@PostMapping("/login")13publicApiResultlogin(@RequestBodyLoginlogin){14Integerusername=login.getUsername();15Stringpassword=login.getPassword();16AdminadminRes=loginService.adminLogin(username,password);17if(adminRes!=null){18returnApiResultHandler.buildApiResult(200,"请求成功",adminRes);19}20returnApiResultHandler.buildApiResult(400,"请求失败",null);21}后端的controller层通过第12行代码的接口接受请求，14、15行为前端输入的账号、密码，以管理员为例，然后通过16行代码访问业务逻辑层的loginSevice中adminLogin方法获得的数据，17到21行是对返回结果的处理。22@Override23publicAdminadminLogin(Integerusername,Stringpassword){24returnloginMapper.adminLogin(username,password);25}23行代码是adminLogin方法，24行是service层获得DAO层返回的信息。26@Select("selectadminId,adminName,sex,tel,email,cardId,rolefromadminwhereadminId=#{username}andpwd=#{password}")27publicAdminadminLogin(Integerusername,Stringpassword);数据持久层依据业务逻辑层发送的“id”和“psw”通过26行的sql语句进行数据库信息查找。如果找到对应的管理员，就会将该管理员的信息全部返回给service层，即第16行代码中“adminRes”为管理员的信息；如果没有找到对应的管理员，则会通过第20行返回一个“null”。service层通过17到19行或20行返回给前端请求api的页面一个“adminRes”或“null”。28switch(resData.role)29case"0":30this.$cookies.set("cname",resData.adminName)31this.$cookies.set("cid",resData.adminId)32this.$cookies.set("role",0)33this.$router.push({path:'/index'})第28行代码表示“resData”为后端发送的“adminRes”或“null”。通过判断“resData”是否为空，若为空，前端会弹出提示框“用户名或密码错误”；若不为空，通过28行获取用户信息中的“role”属性，29行判断“role”的值为“0”、“1”、“2”，若为“0”，则通过30到32行拉取对应管理员的信息，最后以33行路由跳转到符合“id”的管理员页面。教师和学生原理相同，教师“role”=1，学生“role”=2。4.2.考试功能1this.$axios(`/api/paper/${paperId}`).then(res=>{2this.topic={...res.data}3letkeys=Object.keys(this.topic)4keys.forEach(e=>{5letdata=this.topic[e]6this.topicCount.push(data.length)7letcurrentScore=08for(leti=0;i<data.length;i++){9currentScore+=data[i].score10}11this.score.push(currentScore)通过学生的账号和密码输入，前端会接收“role”=2，系统会跳转到path:'/student'。学生系统主页还包括其他的组件，即主页面包含子页面。“student/index”是学生主页面，主页面还包括“myExam”、“startExam”、“manager”、“examMsg”、“message”等其他组件。path:"/"表示“myExam”组件默认随着学生主页面“index”一起展现，其他组件则需要对应的点击事件才能进行页面跳转，原理与上文登录的流程相同。整个系统页面的形成都是由vue框架、element-ui组件构成。第1行代码表示请求试卷信息，3到5行把试卷的信息以数组的形式存储，7到9行算出抽取试卷的总分。学生点击一门考试跳转到“examMsg”试卷详情页面，再通过“toAnswer”点击事件跳转到path:"/answer"考试页面。12publicApiResultfindById(@PathVariable("examCode")IntegerexamCode){13System.out.println("根据ID查找");14ExamManageres=examManageService.findById(examCode);15if(res==null){16returnApiResultHandler.buildApiResult(10000,"考试编号不存在",null);17}18returnApiResultHandler.buildApiResult(200,"请求成功！",res);}到达考试页面，通过created()方法初始化页面信息，获取学生、考试、时间信息展示在系统页面。通过14行代码实现试卷信息的获取，若没有找到对应试卷则提示16行的“考试编号不存在。4.3.批卷功能根据学生主页面所点击考试的“试卷编号”，通过axios的http请求“试卷编号”的api获取该编号试卷的信息，获取后端的“试卷信息”，再通过axios请求以考试信息中的“试题号”去获取题库中对应题号的“题目信息”，把获取到的试题信息中的答案以数组的形式储存。1letlen=this.topicCount[1]2letfather=[]3for(leti=0;i<len;i++){4letchildren=[null,null,null,null]5father.push(children)要用1到2行的二维数保存上面获取到试题中填空题的答案，最后要初始化试题信息，即展示第一题题目信息和第一题作答信息。用vue中的语法框架把type=1、2的试题以题目加点击选项和输入框的形式展现，因为是选择题，所以点击事件为change事件，填空题为键盘事件，通过事件把学生答案保存到数组。学生作完卷后，可以提交试卷，通过点击事件调用commit()方法，系统会根据学生所做答案与之前试卷信息中的答案一一对比，计算总分。以选择题为例：6topic1Answer.forEach((element,index)=>{7letright=null8if(element!=null){9switch(element){10case1:11right="A"12break//省略其余3个case13}通过“结束考试”点击事件，实现系统的自动批卷。选择题会根据点击事件所选的1、2、3、4保存到数组，对应到试题答案的A、B、C、D。把学生通过change事件保存的答案与正确答案比较，最后以正确答案个数乘以分值累加得出该题型的总分，以上是选择题的自动批卷，填空题、判断题类似。但填空题不是switch()方法，要使用includes()，即所写答案必须包含于正确答案，系统才会判定为正确；否则答案错误。4.4.组卷功能教师在“添加题库”板块，可以选择所需试卷，通过手动添加题目或以组卷的方式给试卷组织试题。在“在线组卷页面”，教师可以根据需求给试卷设置参数，即“难度”、三种题型的“数量”。填写好参数要求后，通过点击事件“立刻组卷”引用create()方法实现组卷。1List<Integer>changeNumbers=multiQuestionService.findBySubject(item.getSubject(),changeNumber);2if(changeNumbers==null){3returnApiResultHandler.buildApiResult(400,"选择题数据库获取失败",null);}4for(Integernumber:changeNumbers){5PaperManagepaperManage=newPaperManage(paperId,1,number);6intindex=paperService.add(paperManage);7if(index==0)8returnApiResultHandler.buildApiResult(400,"选择题组卷保存失败",null);}通过发送http请求给item控制层，controller层根据前端的几个参数分别向三种题型的service层请求方法，若返回信息为空，则组卷失败；否则就把所获试题信息存入“papermanage”表中，提供给学生端在线考试。9@Override10publicList<Integer>findBySubject(Stringsubject,IntegerpageNo){11returnmultiQuestionMapper.findBySubject(subject,pageNo);12}第30行代码表示service层接收DAO层的返回所求信息。第11行指选择题service层请求DAO层以“findBySubject”查找返回信息。13@Select("selectquestionIdfrommulti_questionwheresubject=#{subject}orderbyrand()desclimit#{pageNo}")14List<Integer>findBySubject(Stringsubject,IntegerpageNo);DAO层响应service层，以13行sql语句按科目寻找目标试题，并“orderbyrand()desclimit”方法限制，“rand()”方法是从数据库随机不重复的抽取，比如以“计算机网络”为“subject”通过multiquestionmapper的sql按“pageNo”的数量抽取，最后返回给service层不同顺序的题目组合信息。4.5.用户管理功能用户管理分为教师端和管理员端2种管理。教师只能管理学生，管理员既可管理学生，也可管理教师。教师到达学生管理页面，页面初始化获取学生信息。教师可以选择“编辑”和“删除”学生信息，点击事件“编辑”调用“checkGrade”方法。方法请求“student”控制层：1@GetMapping("/student/{studentId}")2publicApiResultfindById(@PathVariable("studentId")IntegerstudentId){3Studentres=studentService.findById(studentId);4if(res!=null){5returnApiResultHandler.buildApiResult(200,"请求成功",res);6}else{7returnApiResultHandler.buildApiResult(404,"查询的用户不存在",null);8}9}第1行代码表示controller层接收http请求，第3行为service层返回的学生信息，4到9行判断学生信息是否存在。10@Override11publicStudentfindById(IntegerstudentId){12returnstudentMapper.findById(studentId);13}第12行表示service层接收DAO层所查找的结果。14@Select("select*fromstudentwherestudentId=#{studentId}")15StudentfindById(IntegerstudentId);数据持久层通过sql语句以“studentId”查找学生全部信息。教师通过“编辑”事件获取到了学生信息，更改完信息后，通过“submit”事件完成对学生信息的更新。更新的信息传递与查找相同，这里以DAO层为例，代码如下：16@Update("updatestudentsetstudentName=#{studentName},grade=#{grade},major=#{major},clazz=#{clazz},"+"institute=#{institute},tel=#{tel},email=#{email},pwd=#{pwd},cardId=#{cardId},sex=#{sex},role=#{role}"+"wherestudentId=#{studentId}")17intupdate(Studentstudent);4.6.成绩查询功能教师选择“成绩查询”中的“学生成绩查询”可以查看学生的考试信息，通过“查看成绩”的点击事件可以跳转到“学生成绩折线图”，以echarts组件为核心，x轴为考试次数，y轴为分数。教师端通过组件实现学生成绩可视化，学生端则是通过“我的分数”板块直接查询考试分数，“score”表中的数据是由自动批卷累加所得分数获得。4.7.系统功能展现图4-2学生页面考试科目及相关信息通过分页查询展示在学生端首页。图4-3考试页面图4-4在线组卷每个试题都有独立的“id”，教师选择试卷，再通过“number”、“level”以rand()方法实现自动组卷。图4-5用户管理教师通过键盘和点击事件对学生信息进行修改和添加，以DAO层的sql的add、delete、update方法实现对学生信息的管理。图4-6成绩查询用户在系统前端通过点击事件向后端发送http请求，数据从视图层传到控制层，再请求服务层的业务逻辑方法，通过数据持久层的sql语句操作数据库，最后返回数据或者结束。系统执行流程如下结构图所示：图4-7系统执行流程4.8.本章小结系统登录功能实现学生、教师、管理员3种不同用户的登录；学生在线考试，系统实现自动批卷；教师端还可以通过参数选择实现自动组卷；还有其他的功能，教师对学生信息、试题信息的编辑，管理员对教师信息的编辑等等类似的功能组成一个完整的考试管理系统。5.系统测试与部署经过上章对系统的实现。本章开始对系统关键功能展开测试，从用户登录、页面操作、各用户的具体功能实现展示进行测试、分析测试结果，以及如何把系统部署在本地运行。5.1.系统测试5.1.1登录功能测试使用系统之前需要进行登录，使用各自账号密码完成登录，之后就可以使用系统功能。在前端主页面，填写信息，通过“登录”的点击事件向后端传递信息请求。图5-1登录页面在填写框中输入“20154084”和“123456”，通过点击事件响应后端的登录功能，DAO层通过sql的全局查找，找到对应的“id”和“password”返回“data！=null”，然后根据学生信息中的“role=2”，系统成功由登录页面跳转到学生“大咸鱼”主页面；在填写框中输入“20081001”和“123456”，通过点击事件响应后端的登录功能，返回“role=1”，系统成功由登录页面跳转到教师“Mr张”主页面；在填写框中输入“9527”和“123456”，通过点击事件响应后端的登录功能，返回“role=0”，系统成功由登录页面跳转到管理员主页面；使用数据库拥有的账号和密码才能登录成功，否则会提示“用户名或密码错误”。随便输入“23245”和“12345”，全局查找没有搜索到所填信息，返回“data=null”，前端收到“data=null”，显示提示信息“用户名或密码错误”。图5-3不同用户登录5.1.2考试功能测试在完成正确的的登录之后，会进入系统主页面，学生、教师、管理员三类不同主页面。学生登录成功后，可以从“我的试卷”、“我的练习”、“我的分数”、“给我留言”几个板块选择，也可以直接点击科目考试，最后点击退出系统。以“大咸鱼”同学的账号的首页第一门考试《计算机网络》为测试对象。图5-4学生考试页面选择题第1到10题全部选择“A”，判断题45到50题全部选择“T”，点击“结束考试”提前交卷，系统将所选答案保存到数组，与页面信息获取到的答案一一对比，通过count计数器累加算出最后总分为“8”；以同份试卷再做一次测试，这次选择题1到10全部选择“B”，判断题45到50题全部选择“F”，点击“结束考试”，获取最后分数为“16”。查看数据库中试题答案分析，自动批卷的结果是正确的。学生考试信息会保存在数据库中的“score”表中，“我的分数”页面获取表中信息。学生在线考试功能和自动批卷功能成功实现。图5-5“score”表信息5.1.3组卷功能测试以“Mr张”账号为测试对象，首先通过“添加考试”新建2门试卷，在“在线考试”页面为新建的2门考试设置相同的参数，即难度“一般”、选择题“5”、填空题“5”、判断题“5”，通过“立刻组卷”的点击事件，让DAO层调用rand()方法抽取对应“subject”、“level”的fillquestion、judgequestion、multiquestion三个试题数据库各5个题目，即后端完成2次条件相同的组卷；返回“大咸鱼”同学的账号进行确认。图5-6组卷实现同一门科目在2次参数相同的条件下进行组卷，试卷1的选择题1“交换机”与试卷2的选择题1“G（x）”不同，试卷1的选择题2“DNS”与试卷2的选择题2“帧类型”不同，填空题和判断题以此类推，试卷1和试卷2是不同考卷。在线自动组卷功能成功实现。5.1.4用户管理功能测试以“Mr张”账号为测试对象，首先通过“学生管理”中“添加学生”加入一名学生“李伟”及相关信息，通过“立刻创建”点击事件，让DAO层执行insert的sql语句，添加学生信息到数据库中。图5-7添加学生在教师的“学生管理”和数据库中都可以看出学生“李伟”成功添加。在“学生管理”页面有“编辑”和“删除”学生信息，选择把“李伟”同学的性别由男改成女，班级由2改成1，点击确认，DAO层执行update语句。页面的学生信息和数据库中学生属性全部变化，用户管理功能实现。图5-8学生信息编辑5.1.5成绩查询功能测试以“大咸鱼”同学为学生端测试对象，让同学再进行一次“计算机网络”考试，提交试卷，获取分数为10分，“score”表中新增一条分数数据。登录“Mr张”账号，点击“成绩查询”，选择“大咸鱼”的“查询详情”，获取到最新的成绩折线图，与原先的成绩图进行对比，折线延长，考试次数由10加到11次，16分后面多了一个10分。学生成绩可视化功能实现。图5-9成绩折线图5.2.系统部署基于SpringBoot+vue考试管理系统，本地部署MySQL。通过在后端项目运行“main”下的“perties”，启动后端，后台项目启动与本地数据库连接，前台通过npmrundev指令将项目放到服务器上，在浏览器中搜写localhost：8088，点击跳转，若成功到达系统的登录页面并且可以进行登录，则项目运行成功。图5-10后台项目运行图5-11前台项目启动图5-12前后端分离5.3.本章小结通过测试目标的完成，可以确认系统实现了用户登录，在线考试，用户管理，自动组卷等功能，但由于数据库本身数据的稀少，所以需要扩大数据库，尝试做更多的实验去测试系统的功能可行性，技术可行性。前后端分离，前端负责view层；后端负责controller层、mapper层、service层；后台错误不会直接反映到前台，互不干扰。6.1设计成果成功设计出了一种前后端分离考试管理系统，可以切换3种账号操作系统，能够在线考试、成绩查询、自动组卷、自动批卷等考试功能服务，也可以管理用户信息，具有一定现实价值；有能力者或是想要学习之人可以以此系统去更深一步优化和创造。6.2展望虽然实现了基本的考试系统，但