简介本资源是一套完整的微信小程序考试系统毕业设计项目面向计算机专业本科生及Java全栈初学者解决课程设计与毕设中常见的在线考试平台开发需求。项目采用前后端分离架构前端基于微信小程序原生开发含153个JS逻辑文件、124个Vue组件及72个WXML页面结构文件后端基于SSM框架SpringSpringMVCMyBatis含103个Java核心类与2个SQL建表脚本配合MySQL数据库实现用户管理、试卷生成、在线考试、成绩统计等全流程功能。压缩包共1107个文件总大小16.19MB涵盖SVG图标、PNG素材、WXSS样式、JSON配置及BAT一键部署脚本等目录结构规范支持本地快速配置运行。目前已有343人学习下载提供管理员与用户双角色完整交互流程、SSM整合配置细节、小程序登录态管理方案及常见排错提示是理解微信生态下教育类应用开发的优质实践案例。1. 这不是又一个“Hello World”小程序它是一套能真正在本地跑通、带完整后台管理的微信考试系统毕设工程你手头正卡在毕设开题阶段导师说“要体现前后端分离”“要有真实业务逻辑”但翻遍 GitHub 和 CSDN90% 的所谓“微信小程序考试系统”只有前端页面截图、没有后端源码、数据库脚本缺失、甚至app.js里还写着// TODO: 接口未实现——这种项目交上去答辩现场就是公开处刑。而这份【精品毕设推荐】-基于微信小程序的考试系统设计与实现.zip是少有的、从微信开发者工具启动小程序、到 IDEA 启动 SSM 后台、再到 Navicat 导入 MySQL 数据库三端全部可实操验证的闭环工程。它不是 Demo而是按真实教务场景建模支持管理员批量导入试题含单选/多选/判断、学生限时作答自动阅卷、错题回看成绩导出 Excel、试卷防切屏通过wx.onAppHide 时间戳校验、考试中禁止微信切换等硬性需求。适合计算机/软件工程专业本科生做毕业设计也适合作为 Java Web 课程设计的进阶实战载体——因为它的 SSM 层结构清晰、Mapper XML 写法规范、Controller 返回统一 JSON 格式比很多教学案例更贴近企业开发习惯。2. 从压缩包解压到三端联调一套标准流程走通整个系统链路2.1 解压即得完整工程结构看清文件归属与技术栈边界拿到.zip文件后不要急着双击运行。先用 7-Zip 或 WinRAR 解压到一个无中文、无空格的路径下例如D:\exam-system\这是后续所有操作的前提。解压后你会看到三个明确分区/weixin-miniprogram/目录微信小程序源码含app.js、pages/下的login/、exam/、result/等页面以及utils/request.js封装了所有 API 调用/ssm-backend/目录SSM 后台工程Eclipse 项目结构.project、.classpath存在含src/main/java/com/exam/下的 Controller、Service、Mapper 包以及src/main/resources/下的spring-mvc.xml、mybatis-config.xml、jdbc.properties/database/目录含exam_system.sql建库脚本以及init_data.sql初始化管理员账号admin/123456和样例试题。提示该工程未使用 Maven 管理依赖所有 JAR 包如spring-webmvc-4.3.25.RELEASE.jar、mybatis-3.4.6.jar、mysql-connector-java-5.1.47.jar已放在/ssm-backend/WebContent/WEB-INF/lib/下直接部署 Tomcat 即可无需额外下载。2.2 微信小程序端用开发者工具打开并配置合法域名进入/weixin-miniprogram/目录启动微信开发者工具稳定版 v1.05.2303020 及以上点击「新建项目」→ 选择该目录 → AppID 填暂不使用测试阶段无需认证→ 选择「不使用云服务」→ 创建。创建后关键一步是修改请求域名。打开utils/request.js找到第 12 行const BASE_URL http://localhost:8080/exam-system;这个地址必须与你后续启动的 Tomcat 地址严格一致。如果你改过 Tomcat 端口比如改成 8081这里必须同步修改。接着在开发者工具顶部菜单栏 →「详情」→「本地设置」→ 勾选「不校验合法域名、web-view业务域名、TLS 版本以及 HTTPS 证书」——这步必须勾选否则所有wx.request都会返回request:fail net::ERR_CONNECTION_REFUSED。2.3 SSM 后台端在 Eclipse 中导入并配置 Tomcat 运行环境打开 Eclipse建议 Neon 或 Oxygen 版本兼容老式.project结构菜单栏 → File → Import → Existing Projects into Workspace → 选择/ssm-backend/目录 → Finish。此时项目会报错常见原因是 JDK 版本不匹配。右键项目 → Properties → Java Build Path → Libraries → 双击JRE System Library→ 选择JDK 1.8该工程编译级别为 1.8用 JDK 11 会编译失败。接着配置 TomcatWindow → Preferences → Server → Runtime Environments → Add → Apache → Tomcat v8.5必须是 8.5.x因web.xml是 3.1 版本Tomcat 9 默认要求 4.0右键项目 → Run As → Run on Server → 选择刚配好的 Tomcat 8.5 → Finish。启动成功后浏览器访问http://localhost:8080/exam-system/login.jsp应看到登录页。若报 404请检查WebContent/WEB-INF/web.xml中welcome-file-list是否指向login.jsp该工程已正确配置。2.4 MySQL 数据库导入脚本并验证表结构完整性使用 Navicat 或命令行执行建库脚本# 命令行方式需提前安装 MySQL 5.7 mysql -u root -p CREATE DATABASE exam_system CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci; USE exam_system; SOURCE D:/exam-system/database/exam_system.sql; SOURCE D:/exam-system/database/init_data.sql;导入后重点检查三张核心表表名关键字段用途说明t_useruser_id,username,password,role1管理员, 2学生用户身份控制role字段驱动前端路由权限t_paperpaper_id,paper_name,start_time,end_time,duration分钟试卷元数据duration控制倒计时逻辑t_questionquestion_id,paper_id,type1单选,2多选,3判断,answer试题存储answer字段存标准答案如A,C或true注意t_question.answer是字符串类型非 JSON。多选题答案用英文逗号分隔前端解析时需split(,)这点在pages/exam/exam.js的checkAnswer()方法中有对应处理。2.5 三端联调用管理员账号登录后台再用学生账号在小程序答题浏览器访问http://localhost:8080/exam-system/login.jsp输入admin / 123456登录进入「试卷管理」→「新增试卷」填写名称、开始/结束时间、时长建议填 10 分钟用于测试保存进入「试题管理」→「批量导入」上传/database/sample_questions.xlsx压缩包内提供确认导入成功回到小程序开发者工具清除缓存菜单栏 → 工具 → 清除缓存 → 全部清除重新编译在小程序首页点击「学生登录」→ 输入student1 / 123456初始化数据中已存在→ 进入「我的考试」→ 找到刚创建的试卷 → 点击「开始考试」→ 完成 5 道题 → 提交 → 查看成绩页。此时后台数据库t_record表应新增一条记录score字段为计算后的分数submit_time为提交时间戳。这是整套系统数据流闭环的铁证。3. 避坑指南那些让毕设答辩前夜崩溃的 4 个真实血泪问题3.1 现象小程序编译成功但点击「登录」按钮无响应控制台报Cannot read property request of undefined原因utils/request.js第 5 行const app getApp()返回undefined根本原因是app.js中未正确注册全局globalData或onLaunch未触发。但本工程实际原因是微信开发者工具版本过低 v1.05.2303020导致wx.requestPromise 化失效而代码中使用了.then().catch()链式调用。解决升级微信开发者工具至最新稳定版或临时降级写法在login.js的doLogin()方法中将api.login(data).then(res { ... })改为传统回调api.login(data, (res) { if (res.code 200) { wx.setStorageSync(token, res.data.token); wx.switchTab({url: /pages/index/index}); } });注api.login函数第二参数即 success callback已在utils/api.js中预留3.2 现象后台 Tomcat 启动成功但访问http://localhost:8080/exam-system/login.jsp报 404且 Eclipse 控制台无 Spring 初始化日志原因Eclipse 未将项目正确部署到 Tomcat 的webapps目录。常见于未勾选「Deploy project as a WAR file」或「Auto-publish when resources change」被禁用。解决右键项目 → Properties → MyEclipse → Web → Context root 改为exam-system必须与 URL 路径一致右键项目 → MyEclipse → Add and Remove Project Deployments → 确保exam-system在右侧「Configured」列表中Window → Preferences → MyEclipse → Servers → Tomcat → Publishing → 勾选「Automatically publish when resources change」重启 Tomcat观察控制台是否输出INFO: Initializing Spring FrameworkServlet springmvc。3.3 现象学生提交试卷后后台t_record表无数据小程序提示「提交失败」原因t_paper表中start_time和end_time字段为DATETIME类型但初始化 SQL 中写的是2023-01-01缺时分秒MySQL 5.7 严格模式下会插入失败且 MyBatis 不抛异常静默失败。解决手动修正数据库中的时间字段。执行UPDATE t_paper SET start_time2023-01-01 09:00:00, end_time2023-01-01 09:10:00 WHERE paper_id1;更彻底的方案修改/database/exam_system.sql中t_paper表的start_time、end_time默认值为CURRENT_TIMESTAMP并在init_data.sql中补全时分秒。3.4 现象管理员在「用户管理」页面点击「删除用户」弹窗确认后无反应Network 面板显示DELETE http://localhost:8080/exam-system/user/123 405 (Method Not Allowed)原因Spring MVC 默认禁用 DELETE 请求出于安全考虑而前端api.deleteUser(id)发送的是 DELETE 方法但 Controller 中RequestMapping(value/user/{id}, methodRequestMethod.DELETE)未生效。解决在web.xml中添加 HiddenHttpMethodFilter 过滤器本工程已存在但可能被注释filter filter-namehiddenHttpMethodFilter/filter-name filter-classorg.springframework.web.filter.HiddenHttpMethodFilter/filter-class /filter filter-mapping filter-namehiddenHttpMethodFilter/filter-name url-pattern/*/url-pattern /filter-mapping同时前端需在 form 表单中添加_methodDELETE字段pages/user/user.js的deleteUser()方法中已用wx.request指定method: DELETE故只需确保后端 Filter 生效即可。4. 毕设加分项把「防作弊」从口号变成可演示的功能模块4.1 实现考试中禁止微信切换监听onAppHide并强制交卷微信小程序提供了wx.onAppHide()生命周期监听当用户按下 home 键、切换到其他小程序或微信聊天窗口时触发。本工程在pages/exam/exam.js的onLoad中已注册该监听onLoad: function () { const that this; wx.onAppHide(() { // 记录隐藏时间戳 that.setData({ hiddenTime: new Date().getTime() }); }); wx.onAppShow(() { const showTime new Date().getTime(); const hiddenTime that.data.hiddenTime || 0; // 若隐藏超 5 秒视为作弊自动交卷 if (showTime - hiddenTime 5000) { wx.showModal({ title: 警告, content: 检测到您离开考试界面超过5秒系统将自动提交试卷, showCancel: false, success: () that.submitExam() }); } }); }参数说明5000是容忍阈值毫秒可根据答辩要求调整为10001秒以体现严格性that.submitExam()是封装好的交卷方法包含答案收集、时间计算、接口提交全流程。4.2 实现试卷倒计时与时间校验前后端双重保障防篡改单纯前端倒计时易被调试工具修改。本工程采用「前端显示 后端校验」双保险前端exam.js中countDown()使用setInterval更新 UI但每次wx.request提交答案时附带当前时间戳submitTime: new Date().getTime()后台ExamController.submitPaper()方法中从HttpServletRequest获取客户端 IP 和submitTime并与服务器当前时间比对long clientTime Long.parseLong(request.getParameter(submitTime)); long serverTime System.currentTimeMillis(); long timeDiff Math.abs(serverTime - clientTime); if (timeDiff 30000) { // 允许误差30秒 return Result.fail(提交时间异常请检查设备时间); }这样即使学生用 F12 修改前端时间后端仍会拦截。答辩时可现场演示修改手机时间到未来 1 小时尝试提交必返回错误。4.3 实现错题回看与答案解析结构化存储提升专业感多数毕设只存t_question.answer但本工程在t_question表中额外增加了analysis文本字段用于存储答案解析。初始化数据中已填充样例question_idcontentansweranalysis1Java 中String是基本数据类型吗falseString是引用类型位于java.lang包底层由char[]实现前端在pages/result/result.js中当学生点击查看某题时调用getQuestionDetail(qid)接口返回content、answer、analysis三字段UI 层用wx:if{{item.analysis}}控制解析区域显隐。这种设计让答辩老师一眼看出这不是堆功能而是有教学逻辑支撑的系统。4.4 实现成绩导出 Excel用 Apache POI 输出可打印报告管理员在后台「考试管理」→「成绩统计」页面点击「导出 Excel」触发ReportController.exportScoreExcel()。该方法使用 Apache POI 4.1.2/ssm-backend/WebContent/WEB-INF/lib/poi-4.1.2.jar生成.xlsx文件XSSFWorkbook workbook new XSSFWorkbook(); XSSFSheet sheet workbook.createSheet(考试成绩); // 设置表头 XSSFRow header sheet.createRow(0); header.createCell(0).setCellValue(学号); header.createCell(1).setCellValue(姓名); header.createCell(2).setCellValue(试卷名称); header.createCell(3).setCellValue(得分); header.createCell(4).setCellValue(考试时间); // 填充数据... response.setContentType(application/vnd.openxmlformats-officedocument.spreadsheetml.sheet); response.setHeader(Content-Disposition, attachment; filenamescore_report.xlsx); workbook.write(response.getOutputStream());导出的 Excel 可直接打印字体为微软雅黑 10 号列宽自适应符合高校教务文档规范。答辩时展示导出效果比口头说“支持导出”有力十倍。5. 毕设答辩前最后一道工序定制化修改与可验证的交付物清单5.1 必改的 3 处标识让项目真正属于你导师最反感“拿来主义”。以下三处修改5 分钟完成却能让答辩老师认定这是你亲手打磨的项目修改系统名称与 Logo小程序端替换/weixin-miniprogram/app.json中name: XX大学在线考试系统XX 替换为你学校简称替换/weixin-miniprogram/images/logo.png为你校徽 PNG尺寸 120×120透明背景后台端修改/ssm-backend/WebContent/static/css/main.css中.header-title的content属性为XX大学考试平台。重置管理员密码并更新文档执行 SQLUPDATE t_user SET passworde10adc3949ba59abbe56e057f20f883e WHERE usernameadmin;123456的 MD5在你的毕设论文《系统测试》章节中明确写出“管理员初始账号admin / 123456密码已按学校信息安全规范哈希存储”。替换数据库连接信息修改/ssm-backend/src/main/resources/jdbc.propertiesjdbc.urljdbc:mysql://localhost:3306/exam_system?useUnicodetruecharacterEncodingutf8serverTimezoneGMT%2B8 jdbc.usernameroot jdbc.passwordyour_real_password # ← 改为你本机 MySQL 密码在论文《部署环境》章节注明“数据库部署于本地 MySQL 5.7.32字符集 utf8mb4时区 GMT8”。5.2 可验证的交付物清单答辩老师扫一眼就信服别再交一份“源码论文演示视频”的模糊包。按此清单整理每项都可当场验证交付物存放位置验证方式价值点可运行的最小系统包/dist/新建目录将/weixin-miniprogram/、/ssm-backend/、/database/三目录压缩为exam-system-final.zip解压后按本文第 2 章流程 5 分钟内跑通证明你理解整个技术链路非拼凑数据库 ER 图/docs/er-diagram.png用 PowerDesigner 或 MySQL Workbench 逆向工程生成标注主外键、关系线展示数据库设计能力非仅 CRUDAPI 接口文档/docs/api-docs.md按GET /exam/list、POST /exam/submit等格式列出 URL、参数、返回示例用curl命令体现工程化思维方便老师抽查测试压力测试报告/docs/load-test-report.txt用 JMeter 对/exam/submit接口做 50 并发测试记录平均响应时间 800ms证明系统非玩具有性能意识提示/docs/目录需你自己新建并填充。ER 图用 MySQL Workbench 打开exam_system.sql→ Database → Reverse Engineer → 一路 Next 即可生成API 文档直接复制utils/request.js中所有api.xxx()方法按规范补全压力测试报告用 JMeter 录制一次提交请求添加 50 个线程组运行后截图 Summary Report。从那以后我每次交付毕设都强制走一遍「三端联调 → 防作弊演示 → 导出 Excel → 更新交付清单」四步验证。不是为了应付老师而是当答辩现场老师突然说“你把刚才那个错题解析再点开一次”我能 3 秒内切到手机小程序手指稳稳点开——那一刻所有熬夜调试的凌晨都值了。希望帮到你。本文还有配套的精品资源点击获取