在线考试系统

📋 项目简介

这是一个基于 Spring Boot + Vue 的前后端分离在线考试系统，支持试卷管理、在线答题、练习模式、成绩统计等功能。

🛠 技术栈

后端技术

• 框架: Spring Boot 2.1.2
• ORM: MyBatis Plus 3.1.0
• 数据库: MySQL 5.7+
• 连接池: Druid 1.1.8
• 工具类: Lombok 1.18.6
• JDK版本: JDK 1.8

前端技术

• 框架: Vue 2.5.2
• UI组件: Element UI 2.4.11
• 状态管理: Vuex 3.0.1
• 路由: Vue Router 3.0.1
• HTTP客户端: Axios 0.18.0
• 图表: ECharts 4.2.0
• 构建工具: Webpack 3.12.0

📁 项目结构

java-online-examination-system/
├── springboot/              # 后端项目
│   ├── src/
│   │   ├── main/
│   │   │   ├── java/       # Java源代码
│   │   │   └── resources/  # 配置文件
│   │   └── test/           # 测试代码
│   └── pom.xml             # Maven配置
├── exam/                    # 前端项目
│   ├── src/
│   │   ├── components/     # Vue组件
│   │   ├── router/         # 路由配置
│   │   ├── store/          # Vuex状态管理
│   │   └── views/          # 页面视图
│   ├── build/              # 构建配置
│   ├── config/             # 项目配置
│   └── package.json        # 依赖配置
├── sql/                     # 数据库文件
│   └── exam.sql            # 数据库脚本
├── img/                     # 项目截图
└── 在线考试系统.mp4         # 演示视频

✨ 主要功能

学生端

• 用户登录/注册
• 查看试卷列表
• 在线答题（单选、多选、判断题）
• 练习模式
• 查看考试成绩
• 留言反馈

管理端

• 试卷管理（增删改查）
• 题目管理
• 学生管理
• 成绩管理
• 成绩统计分析（折线图）
• 留言管理

🚀 快速开始

环境要求

• JDK 1.8+
• Maven 3.0+
• MySQL 5.7+
• Node.js 6.0+
• npm 3.0+

1. 数据库配置

创建数据库并导入数据

# 登录MySQL
mysql -u root -p

# 创建数据库
CREATE DATABASE exam DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;

# 导入数据
mysql -u root -p exam < sql/exam.sql

2. 后端配置与启动

修改数据库配置

编辑 springboot/src/main/resources/application.properties：

server.port=8080
spring.datasource.username=root
spring.datasource.password=你的数据库密码
spring.datasource.url=jdbc:mysql://localhost:3306/exam?useUnicode=true&characterEncoding=UTF-8&useSSL=false&serverTimezone=UTC
spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver

启动后端服务

方式一：使用Maven命令

cd springboot
./mvnw spring-boot:run

方式二：使用IDE

• 使用 IntelliJ IDEA 或 Eclipse 导入项目
• 找到主启动类运行即可

后端服务将在 http://localhost:8080 启动

3. 前端配置与启动

安装依赖

cd exam

# 推荐使用yarn（可选）
npm install yarn -g
yarn config set registry https://registry.npm.taobao.org
yarn install

# 或使用npm
npm install

启动前端服务

# 开发模式
npm run dev
# 或
yarn dev

前端服务将在 http://localhost:8081 启动（默认）

生产构建

npm run build
# 或
yarn build

🔑 默认账号

系统启动后，可以使用以下账号登录测试：

• 管理员账号: admin / admin123
• 学生账号: student / 123456

（具体账号请查看数据库 user 表）

📊 数据库说明

主要数据表：

• user - 用户表（学生、教师、管理员）
• exam - 试卷表
• question - 题目表
• score - 成绩表
• message - 留言表

🌐 在线演示

在线访问地址：http://124.223.53.193/

温馨提示：请登录后台的朋友，不要删除"计算机网络"这套试卷，因为目前只添加了这套试卷的题目作为测试。

📸 系统截图

项目包含以下功能截图（位于 img/ 目录）：

• 登录页面
• 试卷列表
• 答题模块
• 练习模式
• 留言模块
• 后台管理
• 学生成绩折线图

⚙️ 配置说明

后端配置

• 端口配置: application.properties 中的 server.port
• 数据库配置: spring.datasource.* 相关配置
• MyBatis配置: 驼峰命名自动转换已开启
• 日志级别: Mapper层日志级别为 debug

前端配置

• API地址: 在 config/index.js 或相关配置文件中修改
• 端口配置: config/index.js 中的 port 配置
• 代理配置: 开发环境跨域代理配置

🔧 常见问题

1. 后端启动失败

• 检查JDK版本是否为1.8
• 检查MySQL是否启动
• 检查数据库连接配置是否正确
• 检查端口8080是否被占用

2. 前端启动失败

• 检查Node.js版本
• 删除 node_modules 重新安装依赖
• 检查端口是否被占用
• 使用淘宝镜像源安装依赖

3. 跨域问题

• 后端已配置CORS，如仍有问题请检查前端API地址配置
• 开发环境可使用代理解决

4. 数据库连接失败

• 检查MySQL服务是否启动
• 检查数据库名、用户名、密码是否正确
• 检查MySQL版本，建议使用5.7+
• 注意时区配置 serverTimezone=UTC

📝 开发说明

后端开发

• 使用MyBatis Plus简化CRUD操作
• 遵循RESTful API设计规范
• 统一返回结果封装
• 异常统一处理

前端开发

• 组件化开发
• 使用Vuex管理全局状态
• 路由懒加载优化性能
• Element UI组件库快速开发

📄 许可证

本项目仅供学习交流使用。

👥 联系方式

如有问题，请查看项目演示视频或在线演示系统。

---

最后更新时间: 2024年12月