考试报名系统-项目学习资料分享

一、项目概述

1.1 项目背景

随着线上教育、各类资格考试、校内课程考核规模不断扩大，传统线下手工报名、纸质登记准考证、人工统计成绩、线下通知考试信息的模式存在效率低下、数据易丢失、查询繁琐、师生沟通渠道缺失等痛点。为实现考试全流程线上数字化管理，降低教务人员人工成本，打通管理员、教师、学生三类角色的业务流程，开发考试报名系统，完成考试信息发布、学生在线报名、报名审核、准考证生成下载、成绩录入查询、资讯推送、论坛交流一体化线上平台。

1.2 项目目标

1. 角色分层权限管控：区分管理员、教师、学生三种身份，不同身份拥有独立操作菜单与数据访问权限；

2. 前台展示模块：首页系统简介、考试信息检索、新闻资讯浏览、论坛帖子查看发布；

3. 后台全业务管理：学生 / 教师用户管理、考试信息维护、考试报名审核、准考证管理、成绩管理、论坛内容管控、系统基础配置；

4. 配套功能：多条件模糊查询、图片上传（考试封面、用户头像）、准考证文件下载、帖子置顶 / 评论管理、批量审核报名、数据增删改查分页；

5. 业务闭环：教师发布考试→学生查看并报名→管理员审核报名单→审核通过生成准考证→教师录入考试成绩→师生可查询成绩，搭配资讯与论坛辅助沟通。

1.3 系统用户角色

角色	权限描述
管理员	最高权限，管理全部数据：学生、教师、考试、报名、准考证、成绩、论坛、系统设置，可批量操作、审核报名、删除违规帖子、置顶帖子
教师	注册账号、发布维护自身考试信息、录入学生考试成绩、在论坛发布学习帖子、查看本班学生报名与准考证信息
学生	浏览前台考试 / 资讯 / 论坛、在线报名考试、查看个人报名状态、下载准考证、查询个人成绩、发布论坛帖子交流

二、整体技术架构

本项目采用前后端分离架构：SpringBoot 后端 + Vue2/Vue3 前端 + MySQL 数据库，分层解耦，便于维护、迭代与部署。

2.1 后端技术栈（SpringBoot）

1. 核心框架：SpringBoot 2.7.x

   • 自动配置，简化 SSM 繁琐 XML 配置，内置 Tomcat 容器，一键启动项目；

   • SpringMVC 负责请求接收、路由分发、参数校验、视图数据返回；

   • SpringIOC 容器实现依赖注入，统一管理 Service、Mapper、Controller 组件。

2. 持久层框架：MyBatis + MyBatis-Plus

   • MyBatis：自定义复杂多条件联表 SQL，支持多字段模糊查询、分页查询；

   • MyBatis-Plus：封装 CRUD 基础操作，提供分页插件、批量删除、条件构造器，大幅减少重复 SQL 编写；

3. 数据库：MySQL 8.0 关系型数据库存储全部业务数据，支持事务，保障报名审核、成绩修改等操作数据一致性；

4. 安全认证：JWT Token + 拦截器 用户登录成功后颁发 JWT 令牌，前端存储在 LocalStorage，每次请求携带 Token；后端拦截器校验 Token 有效性、过期时间、角色权限，未登录 / 权限不足直接拦截跳转登录页；

5. 文件上传工具：Hutool + 本地文件存储 实现用户头像、考试封面图片上传，自动生成唯一文件名防止覆盖，返回图片访问路径；支持准考证文件生成与下载流处理；

6. 工具类：Hutool、FastJSON、Validation

   • Hutool：日期处理、文件操作、字符串工具、UUID 生成；

   • FastJSON：JSON 序列化与反序列化，前后端数据交互；

   • Validation：接口入参非空、长度、格式校验，提前拦截非法请求；

7. 分页组件：MyBatis-Plus 分页插件 所有列表页面（考试、报名、论坛、学生、成绩）统一分页，支持每页条数自定义、页码跳转；

8. 日志框架：SLF4J + Logback 记录系统操作日志、异常日志，便于线上问题排查。

2.2 前端技术栈（Vue）

1. 核心框架：Vue3 + Vue CLI / Vite 响应式双向绑定，组件化开发，页面复用、代码解耦；搭配 Vue Router 实现前台页面、后台管理页面路由切换；

2. 路由：Vue Router 区分前台游客路由（首页、考试信息、资讯、论坛、登录注册）与后台管理路由；路由守卫校验登录状态，未登录用户禁止访问后台页面；

3. 状态管理：Vuex / Pinia 全局存储登录用户信息、角色权限，页面间共享用户身份、菜单权限；

4. UI 组件库：Element Plus（Vue3）/ Element UI（Vue2） 页面全部基于 Element 组件实现：导航栏、分页表格、弹窗新增 / 修改、搜索输入框、单选框（角色选择）、图片上传组件、按钮、卡片、下拉菜单、开关（帖子置顶）；

5. 网络请求：Axios 封装统一请求拦截器：自动携带 Token、统一处理 401 未登录、500 服务异常、弹窗提示错误信息；封装响应拦截器统一解析后端返回数据；

6. 样式工具：SCSS + Flex 布局 全局公共样式抽取，适配大屏管理端页面，前台轮播 Banner、卡片自适应布局；

7. 页面功能组件

   • 轮播图组件：首页、考试、资讯页面顶部图书轮播 Banner；

   • 表格组件：后台所有数据列表，支持多选批量删除、批量审核；

   • 文件下载组件：准考证一键下载；

   • 图片预览上传组件：考试封面、用户头像上传预览；

   • 富文本框（拓展）：论坛帖子、新闻资讯内容编辑。

2.3 开发 & 部署工具

• 开发工具：IDEA（后端）、VS Code（前端）、Navicat（数据库可视化）、Postman（接口调试）；

• 构建工具：Maven（后端打包）、NPM/Yarn（前端打包）；

• 部署环境：JDK1.8+/MySQL8.0、Nginx（前端静态资源反向代理）、Jar 包服务器部署；

• 版本管理：Git。

2.4 架构分层（后端标准分层）

1. Controller 控制层：接收前端 HTTP 请求，接收参数，调用业务层，统一返回 Result 封装类；

2. Service 业务层：编写核心业务逻辑，事务控制，数据组装，调用 Mapper 持久层；

3. Mapper 持久层：MyBatis/MP 操作数据库，单表 CRUD、自定义联表查询；

4. Entity 实体层：数据库表实体类，对应 MySQL 数据表字段；

5. DTO/VO 数据传输层：DTO 接收前端提交参数，VO 封装返回前端展示数据（避免返回敏感字段如密码）；

6. Common 公共层：全局异常处理器、JWT 工具、统一返回结果类、分页工具、文件工具、常量类；

7. Config 配置层：MyBatis-Plus 分页配置、WebMvc 配置（拦截器、跨域）、跨域配置、文件上传配置。

三、系统功能模块详细设计

系统整体分为前台游客 / 登录用户模块、后台管理员 / 教师管理模块两大板块。

3.1 前台展示模块（无需登录可浏览，登录后可操作）

3.1.1 首页模块

对应截图第一张页面

1. 顶部导航栏：首页、考试信息、新闻资讯、论坛管理、后台管理、登录 / 注册按钮；

2. 轮播 Banner：图书主题轮播图，左右切换；

3. 系统简介板块：图文卡片展示系统介绍文本；

4. 功能：页面静态展示，跳转其他导航菜单。

3.1.2 考试信息模块

对应截图第二张页面

1. 多条件搜索栏：考试编号、科目名称、考试时间、教师姓名多字段联合模糊查询；

2. 考试卡片列表：展示考场实拍图片，分页展示全部公开考试；

3. 功能：点击卡片查看考试详情，登录学生可发起考试报名申请。

3.1.3 新闻资讯模块

对应截图第三张页面

1. 标题单条件搜索框；

2. 资讯图文卡片：左侧配图、右侧资讯正文，分页展示；

3. 功能：浏览全部考试相关通知、毕业季、学习干货资讯。

3.1.4 论坛管理（前台论坛）

对应截图第四张页面

1. 帖子标题检索框；

2. 发布帖子按钮（登录后可用，游客隐藏）；

3. 帖子列表：展示帖子标题、发布人用户名、发布时间；

4. 功能：查看帖子详情、评论帖子、登录用户新增帖子。

3.1.5 登录 / 注册模块

对应截图第五张页面

1. 登录表单：用户名输入框、密码输入框、角色单选（管理员 / 学生 / 教师）；

2. 注册入口：教师注册按钮，学生账号由管理员后台新增；

3. 登录逻辑：校验账号密码 + 角色匹配，登录成功颁发 JWT，跳转对应后台页面；

4. 前端校验：非空校验，后端校验账号状态、密码正确性。

3.2 后台管理模块（登录后根据角色展示对应菜单）

后台统一布局：左侧侧边菜单栏、顶部面包屑导航栏、右上角登录用户 + 退出登录按钮，主体表格 / 表单区域。

3.2.1 系统首页

对应截图第六张页面

1. 欢迎页面，展示系统名称；

2. 左侧菜单栏：根据登录角色动态渲染权限菜单（学生登录仅展示个人中心，教师展示考试 / 成绩 / 论坛，管理员展示全部菜单）。

3.2.2 论坛管理（管理员后台）

对应截图第七张页面

1. 搜索：按帖子标题检索；

2. 批量操作：批量新增、批量删除选中帖子；

3. 列表字段：序号、帖子标题、发布用户名、帖子状态、是否置顶、置顶时间；

4. 操作按钮：查看帖子、修改帖子、删除帖子、查看帖子全部评论；

5. 置顶开关：Element 开关组件，一键置顶 / 取消置顶帖子；

6. 权限：仅管理员可删除、置顶帖子，教师仅能管理自己发布的帖子。

3.2.3 考试报名管理

对应截图第八张页面

1. 搜索条件：科目名称、报名是否支付 / 审核通过筛选；

2. 批量操作：新增报名、批量删除、批量审核报名单；

3. 列表字段：考试编号、科目、考试时间地点、报名费用、监考教师、学生学号姓名、手机号、头像、是否支付、审核回复；

4. 业务功能：管理员审核学生报名申请，审核通过后系统自动生成对应准考证数据；区分已支付 / 未支付报名状态。

3.2.4 考试信息管理

对应截图第九张页面

1. 多条件搜索：考试编号、科目、时间、教师姓名；

2. 批量新增 / 删除考试信息；

3. 列表字段：考试编号、科目名称、时间、地点、报名费、注意事项、授课教师、考试封面图片；

4. 操作：查看详情、修改考试信息、删除考试；教师仅可编辑自己创建的考试，管理员可操作全部考试。

3.2.5 准考证管理

对应截图第十张页面

1. 搜索：按科目名称筛选准考证；

2. 列表字段：准考证编号、考试信息、学生学号姓名、头像、准考证下载链接、对应教师；

3. 核心功能：准考证文件在线下载；跳转录入学生考试成绩；修改、删除准考证；

4. 业务逻辑：仅审核通过且缴费完成的报名单才会生成准考证记录。

3.2.6 其他配套后台菜单（截图左侧侧边栏）

1. 个人中心：所有角色均可修改个人密码、头像、基础信息；

2. 学生管理：管理员专属，维护全部学生账号，新增、删除、修改学生信息；

3. 教师管理：管理员专属，审核教师注册账号，管理教师基础信息；

4. 考试成绩管理：教师录入、修改学生成绩；管理员查看全部成绩；学生仅查看本人成绩；

5. 系统管理：管理员专属，系统参数配置、轮播图管理、资讯管理等基础配置。

四、数据库核心表设计（MySQL）

4.1 用户相关表

1. admin 管理员表 id、username、password、name、phone、create_time

2. student 学生表 id、stu_no (学号)、username、password、name、phone、avatar、create_time

3. teacher 教师表 id、username、password、name、phone、avatar、status (账号审核状态)、create_time

4.2 考试业务表

1. exam_info 考试信息表 id、exam_no (考试编号)、subject_name 科目名称、exam_time 考试时间、exam_addr 考试地点、fee 报名费、notice 注意事项、teacher_id 教师 id、cover 封面图片路径、create_time

2. exam_apply 考试报名表 id、exam_id 考试 id、student_id 学生 id、pay_status 是否支付、audit_status 审核状态、audit_reply 审核回复、apply_time 报名时间

3. exam_ticket 准考证表 id、ticket_no 准考证编号、apply_id 报名 id、student_id、exam_id、download_url 准考证文件地址、teacher_id

4. exam_score 成绩表 id、ticket_id 准考证 id、student_id、exam_id、teacher_id、score 分数、score_desc 成绩备注、input_time 录入时间

4.3 资讯论坛表

1. news 新闻资讯表 id、title 标题、content 内容、cover 图片、create_time

2. forum_post 论坛帖子表 id、title、content、user_id 发布人 id、user_type 角色、is_top 是否置顶、top_time 置顶时间、status 帖子状态、create_time

3. forum_comment 帖子评论表 id、post_id 帖子 id、user_id 评论人、comment_content 评论内容、create_time

4.4 通用字段规范

所有表统一包含：id 主键自增、create_time 创建时间；逻辑删除采用 is_delete 字段（MyBatis-Plus 逻辑删除功能），不物理删除数据，便于数据追溯。

五、核心技术亮点与难点解决方案

5.1 JWT 无状态权限认证

难点：传统 Session 集群共享麻烦，前后端分离无法直接使用 Session；不同角色菜单权限区分。 解决方案：

1. 用户登录成功，后端根据用户名 + 角色生成加密 JWT 令牌，设置过期时间；

2. Axios 请求拦截器自动在请求头携带 token；

3. SpringMVC 拦截器校验 token，解析出用户 id、角色存入 ThreadLocal；

4. 前端 Vuex 存储用户角色，动态渲染侧边栏菜单，无权限菜单隐藏；

5. 全局异常捕获 Token 过期、非法 Token，自动弹窗跳转登录页面。

5.2 多条件模糊分页查询

需求：考试、报名、论坛页面支持多输入框联合模糊检索 + 分页； 技术实现：

1. 前端将所有搜索条件打包为参数传给后端；

2. 后端使用 MyBatis-Plus LambdaQueryWrapper 动态拼接 like 模糊查询条件，非空字段才拼接；

3. 分页插件统一处理 pageNum、pageSize，返回总条数、当前页数据，前端 Element 分页组件渲染。

5.3 文件上传与准考证下载

需求：上传考试封面、用户头像；生成准考证并支持下载； 实现：

1. 文件上传：SpringMVC 文件接收，Hutool 工具生成随机文件名，避免重名覆盖，配置 Nginx 映射图片访问路径；限制文件格式 jpg/png、文件大小；

2. 准考证下载：后端通过 POI 生成 Word/PDF 准考证文件，写入学生、考试信息，通过 IO 流返回前端，前端浏览器自动触发下载；数据库存储文件访问地址，重复下载无需重复生成。

5.4 角色动态菜单权限控制

难点：管理员、教师、学生看到不同侧边菜单，接口访问权限隔离； 双重权限控制：

1. 前端控制：登录后根据角色过滤路由与侧边菜单，隐藏无权限页面入口；

2. 后端控制：Controller 接口添加自定义权限注解，拦截器读取 Token 中的角色，校验是否拥有该接口访问权限，无权限直接返回 403。

5.5 批量操作（批量审核、批量删除）

页面功能：报名批量审核、帖子 / 考试批量删除； 实现：

1. Element Table 多选框获取选中 id 数组；

2. 前端传递 ids 集合至后端；

3. MyBatis-Plus 提供 batchById 批量操作方法，单 SQL 批量更新 / 删除，性能优于循环单条操作；

4. 批量审核添加事务注解，全部审核成功才提交，出现异常事务回滚。

5.6 全局统一异常处理

技术点：@RestControllerAdvice 全局异常处理器

1. 捕获自定义业务异常（如账号不存在、报名重复、未缴费无法生成准考证），返回友好提示；

2. 捕获系统异常（空指针、SQL 异常、文件上传异常），统一封装返回码；

3. 前端 Axios 响应拦截器统一解析返回码，弹出 Message 提示框展示错误信息，页面无需单独写错误判断。

5.7 跨域问题解决

前后端分离前端端口 8080、后端 8090，浏览器同源策略拦截请求； 解决方案：后端 WebMvcConfig 配置 CORS 跨域，允许前端域名、允许所有请求头、携带 Cookie/Token，无需 Nginx 配置即可本地开发联调。

六、系统业务流程

6.1 学生考试报名完整流程

1. 教师登录后台 → 新增考试信息（填写科目、时间、地点、费用、上传封面）；

2. 学生前台浏览考试列表，查看考试详情；

3. 学生点击报名，生成报名记录，状态为「待审核、未支付」；

4. 学生完成线上缴费，报名状态更新为「已支付待审核」；

5. 管理员进入考试报名管理页面，批量审核报名单；

6. 审核通过 → 系统自动生成准考证记录，支持学生下载；审核驳回，填写审核回复告知学生；

7. 考试结束后教师登录，在准考证管理页面录入学生考试成绩；

8. 学生前台个人中心查询本人准考证、考试成绩。

6.2 论坛交流流程

1. 教师 / 学生登录前台论坛，发布帖子；

2. 管理员后台论坛管理查看全部帖子，可置顶、修改、删除违规帖子、查看评论；

3. 所有登录用户可查看帖子并发布评论。

6.3 资讯发布流程

管理员后台新增新闻资讯，填写标题、正文、配图，前台资讯页面分页展示全部资讯。

七、系统运行环境

1. 后端环境

   • JDK 版本：1.8 及以上

   • 构建工具：Maven 3.6+

   • 数据库：MySQL 8.0

   • 中间件：无（内置 Tomcat，可外置 Tomcat）

2. 前端环境

   • Node.js：v14/v16

   • 包管理：NPM/Yarn

3. 服务器部署

   • Linux/Windows 服务器

   • Nginx（可选，反向代理前端静态资源）

八、项目拓展优化方向

1. 集成第三方支付：对接支付宝 / 微信支付，实现线上报名费真实支付；

2. 消息通知：整合 WebSocket，报名审核结果、成绩录入实时推送消息给学生；

3. 图片云存储：替换本地文件存储为阿里云 OSS / 腾讯 COS，解决服务器磁盘存储压力；

4. 数据可视化：后台首页 ECharts 图表，展示报名人数、各科目考试人次、成绩分布统计；

5. 验证码功能：登录页面增加图形验证码，防止暴力破解；

6. 定时任务：整合 Quartz 定时清理过期未支付报名记录、归档历史考试数据；

7. 导出 Excel：考试报名、学生成绩列表一键导出 Excel 文件归档。

九、项目总结

本考试报名系统基于 SpringBoot+Vue 前后端分离架构开发，完整覆盖考试报名全生命周期业务，区分三类用户角色实现精细化权限管控。后端依托 SpringBoot 简化开发、MyBatis-Plus 提升 CRUD 开发效率、JWT 实现无状态登录；前端基于 Vue+Element 组件库快速搭建管理页面，实现搜索、分页、批量操作、文件下载等高频业务功能。系统解决传统线下考试管理低效问题，业务逻辑闭环清晰，分层架构易于维护扩展，同时覆盖模糊查询、权限拦截、文件处理、全局异常、事务管理等主流企业级开发技术点，可作为课程设计、毕业设计、中小型教务管理系统落地模板。

十 项目资料

本文完整源码、资料包、笔记已整理更新，都在公众号【熊猫IT技术】，欢迎一起交流学习！