一个前后端分离的在线考试系统,覆盖题库维护、组卷、在线作答、自动判分、成绩分析以及用户和学科管理,并适配桌面端和移动端。
- 后端:Java 21、Spring Boot 4.1、Spring Data JPA、JWT、springdoc OpenAPI
- 前端:Vue 3、Vite、Pinia、Element Plus、WangEditor、ECharts
- 数据库:MySQL 8
| 角色 | 可用模块与能力 |
|---|---|
| 学生 | 查看概览,进入考场作答,查看自己的答卷 |
| 教师 | 包含学生能力;维护题库、批量导题、创建试卷、查看全部考生成绩 |
| 管理员 | 访问全部模块;包含教师能力,并可管理用户和学科 |
详细操作请查看:学生指南 · 教师指南 · 管理员指南 · 常见问题
按当前界面逐步操作的截图见下文图文使用说明。
需要已安装 Docker 和 Docker Compose。在仓库根目录运行:
docker compose up --build服务就绪后访问 http://localhost:9527。首次创建数据库卷时,MySQL 会自动执行 doc/sql/exam.sql。
| 角色 | 用户名 | 密码 |
|---|---|---|
| 管理员 | admin |
admin123 |
| 教师 | teacher |
admin123 |
| 学生 | student |
admin123 |
准备 JDK 21、Node.js 20.19+ 或 22.12+、Maven 和 MySQL 8。在仓库根目录创建并初始化数据库:
mysql -u root -p -e "CREATE DATABASE IF NOT EXISTS exam CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;"
mysql -u root -p exam < doc/sql/exam.sql分别启动后端和前端;将示例中的密码替换为本机 MySQL root 密码:
cd backend
DB_PASSWORD='<MySQL root 密码>' mvn spring-boot:runcd frontend
npm ci
npm run dev前端开发地址为 http://localhost:5173,/api 请求会代理到运行在 9527 端口的后端。后端默认连接本机 3306 端口的 exam 数据库。 接口文档在 http://localhost:9527/swagger-ui.html。
backend/ Spring Boot API、业务逻辑和后端测试
frontend/ Vue 3 单页应用
doc/sql/exam.sql 数据库结构与演示数据
doc/images/guide/ 当前界面的用户指南截图
doc/user-guide.md 按角色划分的操作指南
docker-compose.yml 应用与 MySQL 的容器编排
Dockerfile 前后端构建及应用镜像
cd backend
mvn testcd frontend
npm ci
npm run build- Fork 本仓库并从最新代码创建功能分支。
- 完成修改后运行相关测试和构建。
- 提交清晰、聚焦的变更,并发起 Pull Request。
下面的截图来自当前 Vue 3 界面。左侧是桌面导航,宽度小于 900px 时收起,改到页面底部。
打开首页即登录页。三个演示账号的密码相同,也可以点「没有账号,去注册」。
注册只收集用户名、密码、昵称和邮箱。创建成功后直接进入考场,角色是学生。
用 student / admin123 登录。概览页标题是「我的考场」,能看到开放考试数、自己的答卷数、平均分,以及得分率分布和最近答卷。
进入「考场」,每张卡片是一场开放的考试,写着总分、时长和单选、多选、判断的题量。点「开始作答」。
作答页右上角是倒计时。单选和判断点一个选项,多选可以点多个。选中的选项会描红。时间到会自动交卷。
答完点页面底部的「交卷」,在确认框里点「确定」。
交卷后进入这份答卷。绿色是正确答案,红色是选错的选项,每题标着得分。
「我的答卷」列出自己交过的所有场次,点「查看」回到上面的详情。
手机上同一套页面改成单列,底部是「概览 / 考场 / 我的答卷」。
用 teacher / admin123 登录。概览标题变成「学情概览」,多出题库规模,以及每场考试的人次、均分、最高分、最低分和及格率。
「题库」可以新建、编辑和删除题目。被未删除考试引用的题目不能直接删除。题干和选项都是富文本,配图以 Base64 写入数据库。
点「新建题目」,填写题干、解析、题型、难度、学科和分值。单选、判断用单选标记正确答案;多选则勾选多个正确选项。判断题可以点「填入判断题『正确 / 错误』」。
批量导入:先点「下载模板」,得到 questions.csv,填好后点「批量导入」。也支持 .xlsx,列顺序与 CSV 相同。
type,level,category,score,stem,optionA,optionB,optionC,optionD,answer
single,易,数学,5,1+1等于几,1,2,3,4,B
multi,中,语文,6,下列哪些是元音,A,E,I,O,A|B|C|D
judge,易,生活,5,地球是圆的,,,,,正确
type:single/多选(或multi)/judge(或判断)level:易、中、难category:必须是已经存在的学科名称answer:单选用A–D;多选用|或、分隔;判断用正确或错误
「试卷」里点「新建考试」。填写名称、简介、封面、时长,以及单选、多选、判断的每题分值,再从题库里勾选题目。删除考试只会隐藏这场考试,题目仍留在题库。
「学情」列出全部考生的成绩。可以用下拉框只看一场考试,也可以「导出 CSV」。点「答卷」能打开该考生的逐题详情。
教师自己也可以从「考场」参加考试,记录出现在「我的答卷」里。
用 admin / admin123 登录。侧栏比教师多「学科」和「用户」。
「学科」按卡片列出名称、简介和题量。仍有题目的学科不能删除。
「用户」可以新建账号、修改昵称和邮箱、重置密码,以及停用账号。停用后无法登录。新建用户时选择角色:管理员、教师或学生。