尧图网页设计 
简介这是一套面向Java方向毕业设计与课程设计场景的在线考试系统完整源码包采用springbootmybatis后端、vue前端与mysql数据库组合适合计算机专业学生、指导教师及需要快速搭建考试平台的开发者参考。系统分前台与后台前台支持学生登录、查看考试信息、浏览历史记录与在线答题答题后自动评分后台提供管理员登录涵盖学生、教师、班级、试题、试卷、考试及记录管理等模块功能链路较为完整。压缩包共244个文件约8.67MB以47个java源码、19个vue组件、33个html页面、32个js脚本及29个scss样式为主另含sql数据库文件、说明文档与LW文档便于理解设计思路与数据结构。目前已有55人学习。整体目录清晰可直接导入eclipse或idea运行适合作为毕设参考、二次开发或课程作业模板。1. 在线考试系统源码拆解一套 SpringBootVueMySQL 的毕设到底能不能直接跑起来每年到毕设季问得最多的就是「有没有一套能直接跑的在线考试系统源码」。标题里这套springbootvuemysql说明文档LW的组合基本就是当下 Java 毕设最主流的形态后端 SpringBoot 提供接口前端 Vue 做学生答题和管理端MySQL 存题库、试卷、成绩再配一份说明文档和论文LW 通常指论文。它解决的核心问题是——让你不用从零设计表结构和权限模型直接拿到一套「学生登录考试、教师组卷阅卷、管理员管用户」的闭环。这套东西适合谁适合 Java 基础还行、但没做过完整前后端分离项目的同学也适合想拿它当脚手架改造成自己题目的开发者。但我要先把话说在前面源码能跑起来和能过答辩是两回事中间隔着环境版本、依赖冲突、数据库初始化这几道坎。下面我按「先看懂结构、再动手跑通、最后避坑」的顺序把这条路走一遍。2. 先看懂这套源码的技术分层SpringBoot 后端、Vue 前端、MySQL 数据层各管什么拿到一个 zip 别急着解压就npm install先花十分钟把目录结构和技术分层理清楚后面排错能省一半时间。在线考试系统这类项目业务逻辑其实高度集中在「考试」这个核心域上分层清楚了改需求就是改对应层。2.1 后端 SpringBoot 的典型包结构一套规范的 SpringBoot 在线考试系统后端包结构通常长这样src/main/java/com/example/exam ├── controller // 接口层接收前端请求 ├── service // 业务逻辑组卷、判分、统计 ├── mapper // MyBatis/MyBatis-Plus 数据访问 ├── entity // 数据库实体类 ├── dto / vo // 请求参数与返回视图对象 ├── config // 跨域、拦截器、MyBatis 配置 └── common // 统一返回结果、异常处理controller只做参数校验和调用 service真正的判分逻辑、随机组卷逻辑都在service。很多同学改需求时直接往 controller 里塞业务代码结果越改越乱这是第一个要避开的习惯。判分、组卷这类逻辑一旦写进 controller后面加个「错题重做」功能就得推倒重来。2.2 前端 Vue 的页面与路由划分Vue 端一般分两个入口学生端和教师/管理端。路由用vue-router区分常见结构是/login、/student/exam、/teacher/paper、/admin/user。学生端核心页面是答题页教师端核心是组卷页和阅卷页。答题页有个容易被忽略的点倒计时和答案暂存。考试中途刷新页面答案不能丢通常靠localStorage或定时向后端提交草稿。如果你拿到的源码答题页是纯前端状态管理、刷新即清空那答辩时老师一问「考生断网了怎么办」就答不上来这是需要你自己补的地方。2.3 MySQL 数据层的核心表设计在线考试系统的表不用多但几张核心表必须设计对表名作用关键字段user用户学生/教师/管理员id, username, password, rolequestion题库id, type, content, options, answer, scorepaper试卷id, title, total_score, durationpaper_question试卷-题目关联paper_id, question_id, order_numexam_record考试记录id, user_id, paper_id, score, submit_timeanswer_detail答题明细record_id, question_id, user_answer, is_correctpaper_question这张关联表是组卷的关键题目顺序、每题分值都挂在这里。很多源码把分值直接写死在question表里导致同一道题在不同试卷里没法给不同分值改需求时就卡住了。选型上建议分值存在关联表题目本身只存内容和标准答案。3. 本地跑通的最小路径从 MySQL 建库到 Vue 打包进 SpringBoot这一章是能抄作业的部分。目标很明确在你自己的机器上把后端接口跑起来、前端页面能访问、数据库能连上。我按顺序给命令和配置你照着改就行。3.1 MySQL 建库与初始化脚本执行先在 MySQL 里建库字符集用utf8mb4否则中文题干和选项会乱码CREATE DATABASE exam_system DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci; USE exam_system; -- 然后执行源码里提供的 exam_system.sql SOURCE /path/to/exam_system.sql;执行完用SHOW TABLES;确认表都建出来了。如果脚本里带DROP TABLE IF EXISTS注意别在已有数据的库上跑。初始化数据里通常有默认管理员账号密码多是 MD5 或 BCrypt 加密的登录不上时先看加密方式对不对。3.2 SpringBoot 的 application.yml 关键配置后端能不能连上库全看这个文件。核心就几项server: port: 8080 spring: datasource: url: jdbc:mysql://localhost:3306/exam_system?useUnicodetruecharacterEncodingutf8serverTimezoneAsia/Shanghai username: root password: 你的密码 driver-class-name: com.mysql.cj.jdbc.Driver mybatis-plus: mapper-locations: classpath:mapper/*.xml configuration: map-underscore-to-camel-case: trueserverTimezone一定要设不设的话 MySQL 8 会报时区错误。map-underscore-to-camel-case打开后数据库的user_name能自动映射到实体类的userName省一堆Results注解。如果你的 MySQL 是 5.7驱动类名可以保持com.mysql.cj.jdbc.Driver但连接串参数略有差异报错时优先看驱动版本和连接串是否匹配。3.3 Vue 前端依赖安装与开发模式启动前端目录里先看package.json的依赖和脚本cd exam-frontend npm install # 或 yarn install npm run serve # Vue CLI 项目Vite 项目是 npm run dev启动后默认在localhost:8080或5173。如果后端也占 8080 会冲突改前端端口或后端端口。前端请求后端的地址一般写在.env.development或src/utils/request.js的baseURL里确认它指向你后端实际端口。3.4 把 Vue 打包产物放进 SpringBoot 的 static 目录毕设答辩时经常要求「一个 jar 包就能跑」做法是把前端打包产物塞进后端cd exam-frontend npm run build # 产物在 dist 目录 # 把 dist 里的内容复制到后端 src/main/resources/static/复制完重新mvn package前端页面就能通过后端端口直接访问。注意 Vue Router 如果用 history 模式刷新子路由会 404需要在后端加一个转发到index.html的配置或者前端改用 hash 模式。这一步是「vue 打包放进 springboot 中」最常见的翻车点。4. 组卷、判分、防作弊在线考试系统三个核心功能的实现要点跑通只是第一步答辩老师真正会追问的是业务逻辑。这一章讲三个核心功能怎么实现、参数怎么设也是你改造源码时最该动的地方。4.1 随机组卷的抽题算法与参数组卷的本质是按题型和分值从题库抽题。常见做法是按题型分组每组随机取 N 道// 按题型抽题type 为题型count 为数量 ListQuestion singleChoice questionMapper.selectRandomByType(1, singleCount); ListQuestion multiChoice questionMapper.selectRandomByType(2, multiCount);对应的 SQL 用ORDER BY RAND() LIMIT #{count}。这里有个性能坑ORDER BY RAND()在题量上万时会全表扫描排序很慢。题量小无所谓题量大就改成先查 id 范围再随机取。参数上单选题、多选题、判断题的数量和分值建议做成可配置别写死在代码里否则老师让你「改成 20 道单选」你就得改代码重新编译。4.2 自动判分的逻辑与主观题处理客观题判分简单比对答案即可多选题要注意「少选得部分分、错选不得分」这类规则// 多选题判分完全正确满分漏选按比例错选零分 if (userAnswer.equals(stdAnswer)) { score fullScore; } else if (stdAnswer.contains(userAnswer) !userAnswer.isEmpty()) { score fullScore / 2; // 漏选给一半规则可按需调整 } else { score 0; }主观题简答、论述没法自动判通常进教师阅卷队列状态标记为「待批阅」。设计上要把exam_record的状态字段分清楚已提交待判、客观题已判、全部已判。很多源码把主观题也硬判成 0 分学生一看成绩就炸了这是必须改的。4.3 考试防作弊的几种落地手段防作弊是答辩加分项也是容易被问倒的地方。常见手段有切屏检测、禁止复制粘贴、限时自动交卷、同一账号禁止多端登录。切屏检测靠visibilitychange事件document.addEventListener(visibilitychange, () { if (document.hidden) { // 记录切屏次数超过阈值自动交卷 switchCount; if (switchCount 3) submitExam(); } });要清楚这些手段都只能「记录和威慑」前端代码用户能改真正可靠的是后端校验交卷时间不能超过开考时间加时长、同一账号的 token 唯一。答辩时如果你能说出「前端防作弊只是辅助核心靠后端时间校验」老师会觉得你想清楚了。5. 避坑与排查这套源码跑不起来时先查这几处这一章是我踩过的坑按「现象 → 原因 → 解决」写你遇到问题直接对号入座。现象一后端启动报Access denied for user rootlocalhost。原因application.yml里的数据库密码和你本地 MySQL 实际密码不一致或者 MySQL 根本没启动。 解决先用命令行mysql -u root -p确认能登录再核对配置文件密码。Windows 上还要确认 MySQL 服务在运行。现象二前端页面能打开但所有接口 404 或跨域报错。原因前端baseURL指向的端口和后端不一致或者后端没配跨域。 解决核对前端请求地址后端加全局跨域配置或在 controller 上加CrossOrigin。开发阶段跨域问题最常见别急着怀疑代码逻辑。现象三中文题干显示成乱码。原因数据库、连接串、表字段三处字符集不统一。 解决建库用utf8mb4连接串加characterEncodingutf8表字段确认是utf8mb4。三处都对了才不会乱码。现象四npm install卡住或报依赖冲突。原因Node 版本和项目依赖不匹配或用了淘宝旧镜像。 解决先node -v看版本Vue2 项目用 Node 14/16Vue3 项目用 Node 16。依赖冲突时删掉node_modules和package-lock.json重装。现象五打包成 jar 后前端页面白屏。原因Vue 打包的静态资源路径是绝对路径/放进 SpringBoot 后路径不对。 解决在vue.config.js里设publicPath: ./重新打包。history 模式还要配后端转发。6. 从能跑到能答辩把源码改成自己题目的三个技巧源码跑通只是及格线真正决定分数的是你能不能讲出「我改了什么、为什么这么改」。这一章给三个具体技巧都是我带人做毕设时验证过的。技巧一换一个具体场景让题目有辨识度。纯「在线考试系统」太泛改成「基于 SpringBoot 的驾考科目一模拟系统」或「高校计算机基础课在线测评系统」业务规则立刻具体了驾考有固定题库和 90 分及格线课程测评有章节和知识点维度。场景一换你的表结构、判分规则、统计维度都有了差异化答辩时不容易和同学撞车。技巧二加一个数据统计模块这是最容易出彩的地方。老师喜欢看「系统有没有分析能力」。加一个成绩分布统计、错题率排行、知识点掌握度雷达图用 ECharts 画出来工作量不大但视觉效果和业务深度都上去了。数据来源就是exam_record和answer_detail两张表按question_id分组算正确率即可。技巧三把配置项外置体现工程思维。考试时长、及格线、切屏次数上限这些参数别写死在代码里抽到application.yml或数据库配置表里。答辩时你可以说「这些参数运维可调不用重新发版」这是从「能跑」到「像个正经系统」的分水岭。最后说个我自己的习惯拿到任何一套毕设源码我都会先花半天只做一件事——把数据库表关系画在纸上标出每张表的主外键和业务含义。这一步做完后面改需求、答问题心里都有底。很多同学急着跑起来结果被问「你这张表为什么这么设计」时哑口无言。源码是别人的理解得变成你自己的。希望帮到你。本文还有配套的精品资源点击获取 SpringBoot+Vue+MySQL在线考试系统源码拆解与本地跑通实战
简介这是一套面向Java方向毕业设计与课程设计场景的在线考试系统完整源码包采用springbootmybatis后端、vue前端与mysql数据库组合适合计算机专业学生、指导教师及需要快速搭建考试平台的开发者参考。系统分前台与后台前台支持学生登录、查看考试信息、浏览历史记录与在线答题答题后自动评分后台提供管理员登录涵盖学生、教师、班级、试题、试卷、考试及记录管理等模块功能链路较为完整。压缩包共244个文件约8.67MB以47个java源码、19个vue组件、33个html页面、32个js脚本及29个scss样式为主另含sql数据库文件、说明文档与LW文档便于理解设计思路与数据结构。目前已有55人学习。整体目录清晰可直接导入eclipse或idea运行适合作为毕设参考、二次开发或课程作业模板。1. 在线考试系统源码拆解一套 SpringBootVueMySQL 的毕设到底能不能直接跑起来每年到毕设季问得最多的就是「有没有一套能直接跑的在线考试系统源码」。标题里这套springbootvuemysql说明文档LW的组合基本就是当下 Java 毕设最主流的形态后端 SpringBoot 提供接口前端 Vue 做学生答题和管理端MySQL 存题库、试卷、成绩再配一份说明文档和论文LW 通常指论文。它解决的核心问题是——让你不用从零设计表结构和权限模型直接拿到一套「学生登录考试、教师组卷阅卷、管理员管用户」的闭环。这套东西适合谁适合 Java 基础还行、但没做过完整前后端分离项目的同学也适合想拿它当脚手架改造成自己题目的开发者。但我要先把话说在前面源码能跑起来和能过答辩是两回事中间隔着环境版本、依赖冲突、数据库初始化这几道坎。下面我按「先看懂结构、再动手跑通、最后避坑」的顺序把这条路走一遍。2. 先看懂这套源码的技术分层SpringBoot 后端、Vue 前端、MySQL 数据层各管什么拿到一个 zip 别急着解压就npm install先花十分钟把目录结构和技术分层理清楚后面排错能省一半时间。在线考试系统这类项目业务逻辑其实高度集中在「考试」这个核心域上分层清楚了改需求就是改对应层。2.1 后端 SpringBoot 的典型包结构一套规范的 SpringBoot 在线考试系统后端包结构通常长这样src/main/java/com/example/exam ├── controller // 接口层接收前端请求 ├── service // 业务逻辑组卷、判分、统计 ├── mapper // MyBatis/MyBatis-Plus 数据访问 ├── entity // 数据库实体类 ├── dto / vo // 请求参数与返回视图对象 ├── config // 跨域、拦截器、MyBatis 配置 └── common // 统一返回结果、异常处理controller只做参数校验和调用 service真正的判分逻辑、随机组卷逻辑都在service。很多同学改需求时直接往 controller 里塞业务代码结果越改越乱这是第一个要避开的习惯。判分、组卷这类逻辑一旦写进 controller后面加个「错题重做」功能就得推倒重来。2.2 前端 Vue 的页面与路由划分Vue 端一般分两个入口学生端和教师/管理端。路由用vue-router区分常见结构是/login、/student/exam、/teacher/paper、/admin/user。学生端核心页面是答题页教师端核心是组卷页和阅卷页。答题页有个容易被忽略的点倒计时和答案暂存。考试中途刷新页面答案不能丢通常靠localStorage或定时向后端提交草稿。如果你拿到的源码答题页是纯前端状态管理、刷新即清空那答辩时老师一问「考生断网了怎么办」就答不上来这是需要你自己补的地方。2.3 MySQL 数据层的核心表设计在线考试系统的表不用多但几张核心表必须设计对表名作用关键字段user用户学生/教师/管理员id, username, password, rolequestion题库id, type, content, options, answer, scorepaper试卷id, title, total_score, durationpaper_question试卷-题目关联paper_id, question_id, order_numexam_record考试记录id, user_id, paper_id, score, submit_timeanswer_detail答题明细record_id, question_id, user_answer, is_correctpaper_question这张关联表是组卷的关键题目顺序、每题分值都挂在这里。很多源码把分值直接写死在question表里导致同一道题在不同试卷里没法给不同分值改需求时就卡住了。选型上建议分值存在关联表题目本身只存内容和标准答案。3. 本地跑通的最小路径从 MySQL 建库到 Vue 打包进 SpringBoot这一章是能抄作业的部分。目标很明确在你自己的机器上把后端接口跑起来、前端页面能访问、数据库能连上。我按顺序给命令和配置你照着改就行。3.1 MySQL 建库与初始化脚本执行先在 MySQL 里建库字符集用utf8mb4否则中文题干和选项会乱码CREATE DATABASE exam_system DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci; USE exam_system; -- 然后执行源码里提供的 exam_system.sql SOURCE /path/to/exam_system.sql;执行完用SHOW TABLES;确认表都建出来了。如果脚本里带DROP TABLE IF EXISTS注意别在已有数据的库上跑。初始化数据里通常有默认管理员账号密码多是 MD5 或 BCrypt 加密的登录不上时先看加密方式对不对。3.2 SpringBoot 的 application.yml 关键配置后端能不能连上库全看这个文件。核心就几项server: port: 8080 spring: datasource: url: jdbc:mysql://localhost:3306/exam_system?useUnicodetruecharacterEncodingutf8serverTimezoneAsia/Shanghai username: root password: 你的密码 driver-class-name: com.mysql.cj.jdbc.Driver mybatis-plus: mapper-locations: classpath:mapper/*.xml configuration: map-underscore-to-camel-case: trueserverTimezone一定要设不设的话 MySQL 8 会报时区错误。map-underscore-to-camel-case打开后数据库的user_name能自动映射到实体类的userName省一堆Results注解。如果你的 MySQL 是 5.7驱动类名可以保持com.mysql.cj.jdbc.Driver但连接串参数略有差异报错时优先看驱动版本和连接串是否匹配。3.3 Vue 前端依赖安装与开发模式启动前端目录里先看package.json的依赖和脚本cd exam-frontend npm install # 或 yarn install npm run serve # Vue CLI 项目Vite 项目是 npm run dev启动后默认在localhost:8080或5173。如果后端也占 8080 会冲突改前端端口或后端端口。前端请求后端的地址一般写在.env.development或src/utils/request.js的baseURL里确认它指向你后端实际端口。3.4 把 Vue 打包产物放进 SpringBoot 的 static 目录毕设答辩时经常要求「一个 jar 包就能跑」做法是把前端打包产物塞进后端cd exam-frontend npm run build # 产物在 dist 目录 # 把 dist 里的内容复制到后端 src/main/resources/static/复制完重新mvn package前端页面就能通过后端端口直接访问。注意 Vue Router 如果用 history 模式刷新子路由会 404需要在后端加一个转发到index.html的配置或者前端改用 hash 模式。这一步是「vue 打包放进 springboot 中」最常见的翻车点。4. 组卷、判分、防作弊在线考试系统三个核心功能的实现要点跑通只是第一步答辩老师真正会追问的是业务逻辑。这一章讲三个核心功能怎么实现、参数怎么设也是你改造源码时最该动的地方。4.1 随机组卷的抽题算法与参数组卷的本质是按题型和分值从题库抽题。常见做法是按题型分组每组随机取 N 道// 按题型抽题type 为题型count 为数量 ListQuestion singleChoice questionMapper.selectRandomByType(1, singleCount); ListQuestion multiChoice questionMapper.selectRandomByType(2, multiCount);对应的 SQL 用ORDER BY RAND() LIMIT #{count}。这里有个性能坑ORDER BY RAND()在题量上万时会全表扫描排序很慢。题量小无所谓题量大就改成先查 id 范围再随机取。参数上单选题、多选题、判断题的数量和分值建议做成可配置别写死在代码里否则老师让你「改成 20 道单选」你就得改代码重新编译。4.2 自动判分的逻辑与主观题处理客观题判分简单比对答案即可多选题要注意「少选得部分分、错选不得分」这类规则// 多选题判分完全正确满分漏选按比例错选零分 if (userAnswer.equals(stdAnswer)) { score fullScore; } else if (stdAnswer.contains(userAnswer) !userAnswer.isEmpty()) { score fullScore / 2; // 漏选给一半规则可按需调整 } else { score 0; }主观题简答、论述没法自动判通常进教师阅卷队列状态标记为「待批阅」。设计上要把exam_record的状态字段分清楚已提交待判、客观题已判、全部已判。很多源码把主观题也硬判成 0 分学生一看成绩就炸了这是必须改的。4.3 考试防作弊的几种落地手段防作弊是答辩加分项也是容易被问倒的地方。常见手段有切屏检测、禁止复制粘贴、限时自动交卷、同一账号禁止多端登录。切屏检测靠visibilitychange事件document.addEventListener(visibilitychange, () { if (document.hidden) { // 记录切屏次数超过阈值自动交卷 switchCount; if (switchCount 3) submitExam(); } });要清楚这些手段都只能「记录和威慑」前端代码用户能改真正可靠的是后端校验交卷时间不能超过开考时间加时长、同一账号的 token 唯一。答辩时如果你能说出「前端防作弊只是辅助核心靠后端时间校验」老师会觉得你想清楚了。5. 避坑与排查这套源码跑不起来时先查这几处这一章是我踩过的坑按「现象 → 原因 → 解决」写你遇到问题直接对号入座。现象一后端启动报Access denied for user rootlocalhost。原因application.yml里的数据库密码和你本地 MySQL 实际密码不一致或者 MySQL 根本没启动。 解决先用命令行mysql -u root -p确认能登录再核对配置文件密码。Windows 上还要确认 MySQL 服务在运行。现象二前端页面能打开但所有接口 404 或跨域报错。原因前端baseURL指向的端口和后端不一致或者后端没配跨域。 解决核对前端请求地址后端加全局跨域配置或在 controller 上加CrossOrigin。开发阶段跨域问题最常见别急着怀疑代码逻辑。现象三中文题干显示成乱码。原因数据库、连接串、表字段三处字符集不统一。 解决建库用utf8mb4连接串加characterEncodingutf8表字段确认是utf8mb4。三处都对了才不会乱码。现象四npm install卡住或报依赖冲突。原因Node 版本和项目依赖不匹配或用了淘宝旧镜像。 解决先node -v看版本Vue2 项目用 Node 14/16Vue3 项目用 Node 16。依赖冲突时删掉node_modules和package-lock.json重装。现象五打包成 jar 后前端页面白屏。原因Vue 打包的静态资源路径是绝对路径/放进 SpringBoot 后路径不对。 解决在vue.config.js里设publicPath: ./重新打包。history 模式还要配后端转发。6. 从能跑到能答辩把源码改成自己题目的三个技巧源码跑通只是及格线真正决定分数的是你能不能讲出「我改了什么、为什么这么改」。这一章给三个具体技巧都是我带人做毕设时验证过的。技巧一换一个具体场景让题目有辨识度。纯「在线考试系统」太泛改成「基于 SpringBoot 的驾考科目一模拟系统」或「高校计算机基础课在线测评系统」业务规则立刻具体了驾考有固定题库和 90 分及格线课程测评有章节和知识点维度。场景一换你的表结构、判分规则、统计维度都有了差异化答辩时不容易和同学撞车。技巧二加一个数据统计模块这是最容易出彩的地方。老师喜欢看「系统有没有分析能力」。加一个成绩分布统计、错题率排行、知识点掌握度雷达图用 ECharts 画出来工作量不大但视觉效果和业务深度都上去了。数据来源就是exam_record和answer_detail两张表按question_id分组算正确率即可。技巧三把配置项外置体现工程思维。考试时长、及格线、切屏次数上限这些参数别写死在代码里抽到application.yml或数据库配置表里。答辩时你可以说「这些参数运维可调不用重新发版」这是从「能跑」到「像个正经系统」的分水岭。最后说个我自己的习惯拿到任何一套毕设源码我都会先花半天只做一件事——把数据库表关系画在纸上标出每张表的主外键和业务含义。这一步做完后面改需求、答问题心里都有底。很多同学急着跑起来结果被问「你这张表为什么这么设计」时哑口无言。源码是别人的理解得变成你自己的。希望帮到你。本文还有配套的精品资源点击获取