基于SpringBoot+Vue的毕业设计选题系统：从零搭建到部署实战

这次我们来看一个基于Java的学生毕业设计选题系统。对于计算机、软件工程等相关专业的同学来说，毕业设计是大学阶段最重要的综合性实践环节，而选题往往是第一步，也是最令人头疼的一步。传统的线下选题方式，如纸质表格、邮件沟通，存在信息不对称、流程繁琐、效率低下、数据统计困难等诸多痛点。这个项目就是为了解决这些问题而设计的。

这是一个典型的SpringBoot + Vue前后端分离的Web应用，旨在为高校提供一个线上毕业设计选题管理平台。它覆盖了从教师发布课题、学生在线选题、到管理员审核、最终双向确认的完整流程。项目不仅提供了可直接运行的源码，还附带了详细的文档报告、代码讲解，甚至包含了毕业设计所需的万字论文和答辩PPT，对于正在寻找毕业设计课题或课程设计项目的同学来说，是一个非常完整且实用的参考资源。

本文将带你从零开始，深入解析这个选题系统的设计与实现。我们会重点关注它的核心功能、技术栈选型、本地部署的详细步骤、关键模块的代码逻辑，以及如何基于此项目进行二次开发和定制。无论你是想直接运行体验，还是学习SpringBoot+Vue的开发模式，或是借鉴其作为自己毕业设计的蓝本，这篇文章都能提供清晰的指引。

1. 核心能力速览

在深入代码之前，我们先通过一个表格快速了解这个项目的核心规格和特点，帮助你判断它是否符合你的需求。

能力项	说明
项目类型	基于B/S架构的Web管理系统
技术栈（后端）	SpringBoot, MyBatis-Plus, MySQL, Maven
技术栈（前端）	Vue.js, Element-UI, Axios
核心功能	多角色（学生/教师/管理员）权限管理、课题发布与审核、在线双向选题、进度管理、文档上传、公告发布
部署方式	支持本地IDEA/Eclipse运行，也可打包为Jar/War部署至服务器
数据库	MySQL 5.7+，提供SQL初始化脚本
源码完整性	提供完整前后端源码、SQL文件、项目依赖配置
配套文档	包含系统设计报告、数据库设计文档、部署文档、万字毕业论文、答辩PPT
适合场景	计算机相关专业毕业设计/课程设计、高校信息化管理实践、SpringBoot+Vue全栈学习项目

从表格可以看出，这是一个“开箱即用”型的学习与实战项目。它不仅仅是一堆代码，更是一个包含了从需求分析到最终答辩全套材料的完整解决方案。

2. 适用场景与使用边界

2.1 适合谁用？

1. 计算机/软件工程专业毕业生：正在寻找一个结构清晰、功能完整、技术栈主流的毕业设计题目。本项目提供了从代码到论文的全套素材，可以极大降低前期调研和框架搭建的时间成本。
2. 在校学生（课程设计）：适用于《软件工程》、《Web开发》、《数据库系统》等课程的课程设计，可以作为团队协作开发的一个优秀范例。
3. Java全栈初学者：希望学习SpringBoot和Vue.js如何协同工作，理解前后端分离架构、RESTful API设计、权限控制等核心概念。
4. 高校教学管理人员：有信息化建设需求，可以以此为基础进行二次开发，定制符合本校实际流程的选题系统。

2.2 能解决什么问题？

• 流程线上化：将传统的线下选题、签字、盖章流程转移到线上，实现无纸化办公。
• 信息透明化：学生可以清晰看到所有可选课题、要求、已选人数；教师可以查看学生选择情况。
• 提高效率：系统自动处理冲突（如一个学生只能选一个课题，一个课题有最大人数限制），减少人工协调。
• 便于管理：管理员可以一键导出选题结果、统计报表，方便存档和后续安排。
• 过程可追溯：所有操作留有日志，选题过程各阶段状态清晰可查。

2.3 使用边界与注意事项

• 非商用级产品：作为毕业设计项目，其代码结构、异常处理、安全防护、性能优化等方面可能未达到企业级应用标准，若用于生产环境，需进行严格的代码审计和压力测试。
• 流程定制性：不同高校的毕业设计选题流程可能存在差异（如是否需要开题答辩、中期检查等环节）。本项目实现的是通用核心流程，特殊环节需要自行扩展。
• 数据安全：系统涉及学生和教师的个人信息，在实际部署时，必须考虑数据加密、权限最小化、防止SQL注入与XSS攻击等安全措施。本项目作为学习示例，安全实现需根据实际情况加强。
• 版权与授权：项目附带的论文和PPT仅供参考思路和格式，严禁直接抄袭。必须理解后结合自己的工作进行重新组织和撰写，遵守学术规范。

3. 环境准备与前置条件

要成功运行本项目，你需要准备好以下开发与运行环境。请确保所有前置条件满足，这是后续一切操作的基础。

3.1 硬件与操作系统

• 操作系统：Windows 10/11， macOS， 或 Linux（如Ubuntu）均可。本文演示以Windows为例。
• 内存：建议8GB及以上，确保IDE、数据库、前后端服务同时运行流畅。
• 磁盘空间：预留至少2GB空间用于存放项目代码、依赖库和数据库。

3.2 软件环境（必装）

这是运行项目的基石，请按顺序安装并配置好环境变量。

1. Java开发工具包 (JDK)

   • 版本：JDK 8 或 JDK 11（推荐）。SpringBoot 2.x 对这两个版本支持最好。
   • 验证：安装后，打开命令行（CMD或PowerShell），输入java -version和javac -version，应能正确显示版本信息。

   C:\Users\YourName>java -version java version "1.8.0_301" Java(TM) SE Runtime Environment (build 1.8.0_301-b09) Java HotSpot(TM) 64-Bit Server VM (build 25.301-b09, mixed mode)

2. Apache Maven

   • 作用：用于管理项目依赖、编译和打包Java后端代码。
   • 版本：3.6.x 及以上。
   • 验证：安装并配置MAVEN_HOME环境变量后，命令行输入mvn -v。

   C:\Users\YourName>mvn -v Apache Maven 3.8.4 (9b656c72d54e5bacbed989b64718c159fe39b537)

3. Node.js 与 npm

   • 作用：Node.js是运行前端Vue项目的基础，npm是其包管理工具。
   • 版本：推荐安装Node.js 16.x或18.x的LTS（长期支持）版本。避免使用过新或过旧的版本，可能导致依赖兼容性问题。
   • 验证：

   C:\Users\YourName>node -v v16.15.0 C:\Users\YourName>npm -v 8.5.5

4. MySQL数据库

   • 版本：5.7 或 8.0。两者在语法上对本项目兼容，8.0在性能和安全性上更优。
   • 准备：安装后，记住你设置的root用户密码。需要创建一个新的数据库（如graduation_topic）来存放本项目数据。

5. 集成开发环境 (IDE)

   • 后端：IntelliJ IDEA（推荐）或 Eclipse。IDEA对SpringBoot支持更友好。
   • 前端：Visual Studio Code（推荐）或 WebStorm。VSCode轻量且Vue插件生态丰富。

3.3 获取项目资源

从提供的资源包中，你应该能找到类似以下结构的文件：

毕业设计选题系统/ ├── backend/ # SpringBoot后端项目 │ ├── src/ │ ├── pom.xml # Maven项目配置文件 │ └── sql/ # 数据库初始化脚本 (graduation_topic.sql) ├── frontend/ # Vue前端项目 │ ├── public/ │ ├── src/ │ └── package.json # 前端项目依赖配置 ├── documentation/ # 文档资料 │ ├── 毕业论文.docx/.pdf │ ├── 答辩PPT.pptx │ ├── 系统设计说明书.docx │ └── 部署手册.txt └── README.md # 项目总说明

请将整个项目文件夹放在一个没有中文和空格的路径下，例如D:\Projects\graduation_topic_system。

4. 数据库初始化

在启动后端服务前，必须先创建数据库并导入表结构及初始数据。

1. 登录MySQL。可以使用命令行或图形化工具（如Navicat, MySQL Workbench）。

   mysql -u root -p # 输入密码后进入MySQL命令行

2. 创建数据库。

   CREATE DATABASE IF NOT EXISTS `graduation_topic` DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci; USE `graduation_topic`;

3. 导入SQL脚本。在MySQL命令行中执行（假设脚本文件在D:\Projects\graduation_topic_system\backend\sql\graduation_topic.sql）：

   SOURCE D:/Projects/graduation_topic_system/backend/sql/graduation_topic.sql;

   或者，在图形化工具中直接打开该SQL文件并运行。

4. 验证。查看数据库是否成功创建了user（用户表）、topic（课题表）、selection（选题记录表）等核心表。

   SHOW TABLES;

5. 后端服务启动与配置

后端是基于SpringBoot的Java项目，我们使用IDEA来打开和运行它。

5.1 导入与依赖下载

1. 打开IntelliJ IDEA，选择File->Open...，导航到backend文件夹，点击确定。
2. IDEA会自动识别为Maven项目并开始下载依赖（pom.xml中定义的jar包）。这个过程可能会持续几分钟，取决于网络速度。观察IDEA右下角的进度条。
3. 确保依赖下载完成，没有报红错误。

5.2 修改配置文件

后端连接数据库的配置通常在src/main/resources/application.yml或application.properties中。找到它并根据你的MySQL设置进行修改。

示例 (application.yml):

spring: datasource: driver-class-name: com.mysql.cj.jdbc.Driver # 修改为你自己的数据库连接信息 url: jdbc:mysql://localhost:3306/graduation_topic?useUnicode=true&characterEncoding=utf-8&useSSL=false&serverTimezone=Asia/Shanghai username: root password: your_mysql_password # 替换为你的密码 servlet: multipart: max-file-size: 10MB max-request-size: 100MB # MyBatis-Plus配置 mybatis-plus: mapper-locations: classpath*:/mapper/**/*.xml global-config: db-config: logic-delete-field: deleted # 全局逻辑删除字段名 logic-delete-value: 1 # 逻辑已删除值 logic-not-delete-value: 0 # 逻辑未删除值 # 日志级别 logging: level: com.yourcompany.graduation: debug

关键修改点：

• url中的localhost:3306：确保端口与你的MySQL服务端口一致。
• username和password：填写你MySQL的登录凭据。
• 如果使用MySQL 8.0，驱动com.mysql.cj.jdbc.Driver通常是正确的。

5.3 启动后端服务

在IDEA中找到主启动类，通常命名为*Application.java（例如GraduationTopicApplication.java）。右键点击它，选择Run ‘GraduationTopicApplication’。

观察控制台日志，成功的启动日志会包含以下关键信息：

... Tomcat started on port(s): 8080 (http) ... ... Started GraduationTopicApplication in 5.567 seconds (JVM running for 6.321) ...

这表明SpringBoot内嵌的Tomcat服务器已经在8080端口启动。如果端口冲突（比如8080已被占用），可以在application.yml中修改server.port属性。

此时，你可以打开浏览器访问http://localhost:8080，如果能看到一个简单的错误页面（如Whitelabel Error Page）或项目自定义的首页，说明后端服务基本正常（前端尚未启动，所以没有完整页面）。

6. 前端项目启动与配置

前端是Vue项目，我们使用VSCode打开并运行。

6.1 安装依赖

1. 打开Visual Studio Code，选择文件->打开文件夹...，导航到frontend文件夹。
2. 打开VSCode的终端（终端->新建终端）。终端路径应位于前端项目根目录。
3. 执行以下命令安装项目依赖（npm会根据package.json下载所有需要的包）：

   npm install # 或使用淘宝镜像加速 # npm install --registry=https://registry.npmmirror.com

   这个过程会创建node_modules文件夹，可能会花费一些时间。

6.2 配置API代理

前端需要调用后端API。在开发环境下，我们通常配置一个代理来解决跨域问题。找到frontend目录下的vue.config.js文件（如果没有，可能在package.json同级创建）。

示例 (vue.config.js):

module.exports = { devServer: { port: 3000, // 前端开发服务器端口，可自定义 proxy: { '/api': { // 拦截以 /api 开头的请求 target: 'http://localhost:8080', // 后端服务地址 changeOrigin: true, pathRewrite: { '^/api': '' // 重写路径，去掉 /api 前缀 } } } } }

这个配置意味着，当前端运行在localhost:3000时，所有发往/api/xxx的请求都会被代理到后端的http://localhost:8080/xxx。

6.3 启动前端开发服务器

在VSCode终端中，执行启动命令：

npm run serve

成功启动后，终端会显示类似信息：

App running at: - Local: http://localhost:3000/ - Network: http://192.168.1.xxx:3000/

现在，打开浏览器，访问http://localhost:3000。你应该能看到系统的登录界面。

7. 系统功能测试与效果验证

系统启动成功后，我们使用默认账号登录，逐一测试核心功能。通常，SQL初始化脚本会插入一些测试账号。

7.1 登录与角色权限

• 管理员：账号admin，密码可能是admin123或123456（查看SQL脚本确认）。拥有最高权限，可以管理用户、审核课题、查看所有选题、发布公告。
• 教师：账号如teacher01，密码同上。可以发布课题、审核选择自己课题的学生、管理课题进度。
• 学生：账号如student01，密码同上。可以浏览课题、选择课题、查看选题结果、上传开题报告等文档。

测试步骤：

1. 访问http://localhost:3000，进入登录页。
2. 分别使用三种角色账号登录。
3. 观察登录后跳转的首页和左侧菜单栏。验证：不同角色看到的菜单和功能应完全不同，这体现了基于角色的权限控制（RBAC）已生效。

7.2 教师端：课题发布与管理

1. 以教师身份登录。
2. 找到“课题管理”或类似菜单，点击“发布新课题”。
3. 填写课题表单，包括：课题名称、研究方向、难度等级、要求、最大可选人数、截止日期等。
4. 提交后，在课题列表应能看到刚发布的课题，状态为“待审核”。
5. 验证：课题信息是否准确显示？状态流转是否正确？

7.3 管理员端：课题审核

1. 以管理员身份登录。
2. 进入“课题审核”菜单，应能看到所有教师提交的待审核课题。
3. 点击某个课题，查看详情，然后选择“通过审核”或“驳回”。
4. 验证：审核后，课题状态是否从“待审核”变为“已发布”或“已驳回”？学生端是否只能看到“已发布”的课题？

7.4 学生端：在线选题

1. 以学生身份登录。
2. 进入“课题列表”或“可选课题”，应能看到所有状态为“已发布”且未满额的课题。
3. 点击某个感兴趣的课题，查看详情，然后点击“选择该课题”。
4. 验证：
   • 选择后，该课题的已选人数是否+1？
   • 该生是否无法再选择其他课题？（系统应提示“您已选择课题”）
   • 在“我的选题”中，是否能查看到已选课题及状态（如“待教师确认”）？

7.5 教师端：确认学生选题

1. 教师重新登录。
2. 进入“学生选题管理”或类似功能，应能看到选择了自己课题的学生列表。
3. 教师可以选择“确认”或“拒绝”该学生的选择。
4. 验证：
   • 教师确认后，学生端的选题状态是否变为“选题成功”？
   • 教师拒绝后，学生端的选题状态是否变为“被拒绝”，并且该学生可以重新选择其他课题？
   • 课题的已选人数是否会相应变化？

7.6 通用功能测试

• 公告系统：管理员发布公告，所有角色登录后应在首页或公告栏看到。
• 文档上传：学生能否在“我的课题”页面成功上传开题报告、论文等文档？教师能否下载查看？
• 个人信息修改：各角色能否修改自己的密码、联系方式等基本信息？
• 搜索与筛选：在课题列表、用户列表等页面，测试按名称、状态等条件搜索和筛选是否有效。

8. 核心代码模块讲解

理解核心代码逻辑，是学习和二次开发的关键。我们挑几个重点模块看一下。

8.1 后端：用户登录与权限控制

通常位于controller包下的AuthController或LoginController。

// 示例代码片段，展示登录流程 @RestController @RequestMapping("/api/auth") public class AuthController { @Autowired private UserService userService; @Autowired private JwtTokenUtil jwtTokenUtil; @PostMapping("/login") public Result login(@RequestBody LoginForm form) { // 1. 验证用户名密码 User user = userService.login(form.getUsername(), form.getPassword()); if (user == null) { return Result.error("用户名或密码错误"); } // 2. 生成JWT令牌 String token = jwtTokenUtil.generateToken(user); // 3. 返回用户基本信息和token LoginVO vo = new LoginVO(); vo.setUserInfo(user); vo.setToken(token); return Result.success(vo); } }

关键点：

• 使用@PostMapping接收前端POST请求。
• @RequestBody将JSON参数映射为Java对象 (LoginForm)。
• 服务层 (UserService) 处理具体的业务逻辑（查询数据库、比对密码）。
• 生成JWT（JSON Web Token）作为身份凭证，后续请求需在Header中携带。
• 返回统一的Result封装对象，包含状态码、消息和数据。

8.2 后端：课题发布的Service层逻辑

位于service包下的TopicService或其实现类。

@Service public class TopicServiceImpl extends ServiceImpl<TopicMapper, Topic> implements TopicService { @Override @Transactional // 添加事务注解，保证操作原子性 public boolean publishTopic(TopicDTO dto, Long teacherId) { // 1. DTO 转 Entity Topic topic = new Topic(); BeanUtils.copyProperties(dto, topic); topic.setTeacherId(teacherId); topic.setStatus(TopicStatus.PENDING); // 初始状态：待审核 topic.setCurrentSelected(0); // 初始已选人数为0 // 2. 检查教师是否已达到发布上限（业务规则） long count = this.count(new LambdaQueryWrapper<Topic>() .eq(Topic::getTeacherId, teacherId) .eq(Topic::getStatus, TopicStatus.PUBLISHED)); if (count >= MAX_TOPICS_PER_TEACHER) { throw new BusinessException("您发布的课题数量已达上限"); } // 3. 保存到数据库 return this.save(topic); } }

关键点：

• @Service注解声明为Spring管理的服务组件。
• 继承MyBatis-Plus的ServiceImpl，获得基础的CRUD方法。
• @Transactional确保方法内的数据库操作要么全部成功，要么全部回滚。
• 使用LambdaQueryWrapper构建查询条件，代码更清晰。
• 实现了简单的业务规则校验（教师发布课题上限）。

8.3 前端：Vue组件与API调用

以学生选题页面组件 (StudentTopicSelection.vue) 为例。

<template> <div> <el-table :data="topicList"> <el-table-column prop="title" label="课题名称"></el-table-column> <el-table-column prop="teacherName" label="指导教师"></el-table-column> <el-table-column prop="currentSelected" label="已选/上限"> <template slot-scope="scope"> {{ scope.row.currentSelected }} / {{ scope.row.maxSelected }} </template> </el-table-column> <el-table-column label="操作"> <template slot-scope="scope"> <el-button @click="viewDetail(scope.row)" size="small">详情</el-button> <el-button type="primary" @click="selectTopic(scope.row.id)" :disabled="scope.row.currentSelected >= scope.row.maxSelected || hasSelected" size="small"> 选择 </el-button> </template> </el-table-column> </el-table> </div> </template> <script> import { getTopicList, selectTopic } from '@/api/topic'; // 导入API模块 export default { data() { return { topicList: [], hasSelected: false // 标记学生是否已选课 }; }, created() { this.fetchTopicList(); this.checkSelectionStatus(); }, methods: { async fetchTopicList() { try { const res = await getTopicList({ status: 'PUBLISHED' }); this.topicList = res.data; } catch (error) { this.$message.error('获取课题列表失败'); } }, async selectTopic(topicId) { this.$confirm('确定选择此课题吗？', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(async () => { try { await selectTopic({ topicId }); this.$message.success('选题申请已提交，等待教师确认'); this.hasSelected = true; this.fetchTopicList(); // 刷新列表 } catch (error) { this.$message.error(error.message || '选题失败'); } }); } } }; </script>

关键点：

• 使用Element-UI组件 (el-table,el-button,el-message) 快速构建界面。
• 将API调用封装在独立的@/api/topic.js文件中，利于维护。
• 在created生命周期钩子中初始化数据。
• 使用async/await处理异步请求，代码更同步化。
• 按钮的:disabled属性根据业务逻辑动态控制（课题已满或学生已选）。
• 操作后有用户反馈（成功/失败提示）。

9. 接口API与数据交互

前后端通过RESTful API进行数据交互。理解API设计是进行接口测试或开发移动端/小程序的关键。

9.1 主要API接口示例

以下是一些典型的接口定义（基于常见的REST风格）：

功能模块	请求方法	接口路径	描述	请求体/参数示例
用户认证	POST	/api/auth/login	用户登录	{"username":"student01", "password":"123456"}
课题管理	GET	/api/topic/list	分页查询课题列表	page=1&size=10&status=PUBLISHED
POST	/api/topic	教师发布新课题	课题对象JSON
PUT	/api/topic/{id}/status	管理员审核课题	{"status": "APPROVED"}
选题管理	POST	/api/selection	学生选择课题	{"topicId": 5}
PUT	/api/selection/{id}/confirm	教师确认/拒绝选题	{"action": "CONFIRM"}
文件上传	POST	/api/upload	上传文档（开题报告等）	Multipart/Form-data

9.2 使用Postman测试API

在前后端分离开发中，使用Postman等工具直接测试后端API非常高效。

1. 获取Token：先调用登录接口 (POST /api/auth/login)，在响应体中拿到token。
2. 设置Header：在后续需要认证的请求中，在Headers里添加：Authorization: Bearer <你的token>。
3. 测试查询：发送GET /api/topic/list?page=1&size=5，查看返回的课题列表JSON数据。
4. 测试操作：以教师身份登录后，发送POST /api/topic并携带课题JSON数据，测试发布功能。

Python调用示例（仅供参考）：

import requests # 1. 登录 login_url = "http://localhost:8080/api/auth/login" login_data = {"username": "admin", "password": "admin123"} login_resp = requests.post(login_url, json=login_data) token = login_resp.json()['data']['token'] print(f"Token: {token}") # 2. 携带Token查询课题列表 headers = {"Authorization": f"Bearer {token}"} topic_url = "http://localhost:8080/api/topic/list" params = {"page": 1, "size": 10} topic_resp = requests.get(topic_url, headers=headers, params=params) print(topic_resp.json())

10. 项目打包与部署

本地开发测试完成后，你可能需要将项目打包，部署到服务器或交给老师验收。

10.1 后端打包（SpringBoot）

在backend目录下，打开命令行，执行Maven打包命令：

mvn clean package -DskipTests

• clean：清理旧的编译输出。
• package：打包项目。
• -DskipTests：跳过单元测试，加快打包速度。

打包成功后，会在target目录下生成一个*.jar文件（例如graduation-topic-0.0.1-SNAPSHOT.jar）。这个Jar包是可直接运行的。

运行Jar包：

java -jar target/graduation-topic-0.0.1-SNAPSHOT.jar

可以通过--server.port=9090参数指定运行端口。

10.2 前端打包（Vue）

在frontend目录下，执行构建命令：

npm run build

该命令会编译、压缩前端资源，并在项目根目录下生成一个dist文件夹。dist文件夹内的内容是静态文件（HTML, CSS, JS）。

10.3 生产环境部署

有两种常见方式：

方式一：前后端分离部署

1. 后端：将Jar包上传至服务器，使用nohup或systemd等方式启动，确保在后台运行。

   nohup java -jar graduation-topic-0.0.1-SNAPSHOT.jar --server.port=8080 > app.log 2>&1 &

2. 前端：将dist文件夹内的所有文件，部署到Nginx或Apache等Web服务器上。
3. 配置代理：修改Nginx配置，将前端请求转发到后端API。

   server { listen 80; server_name your-domain.com; # 你的域名或IP location / { root /path/to/your/dist; # 前端dist目录路径 index index.html; try_files $uri $uri/ /index.html; # 支持Vue路由History模式 } location /api/ { proxy_pass http://localhost:8080/; # 转发到后端服务 proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; } }

方式二：前后端合并部署（简易）将前端dist文件夹内的所有文件，复制到SpringBoot项目的src/main/resources/static目录下，然后重新打包后端。这样，一个Jar包就同时包含了前端和后端，访问http://server:port即可。这种方式适合简单的演示环境。

11. 常见问题与排查方法

在部署和运行过程中，你可能会遇到以下问题。这里提供排查思路。

问题现象	可能原因	排查方式	解决方案
前端npm install失败	网络问题、Node版本不兼容、依赖冲突	1. 检查网络，尝试使用淘宝镜像。 2. 查看错误信息，确认是哪个包失败。 3. 核对package.json中依赖版本与Node版本是否匹配。	1.npm cache clean --force后重试。 2. 删除node_modules和package-lock.json，使用npm install --registry=https://registry.npmmirror.com。 3. 考虑降低或升级Node版本。
后端启动时报数据库连接错误	数据库服务未启动、连接配置错误、驱动缺失	1. 检查MySQL服务是否运行 (net start mysql)。 2. 核对application.yml中的url,username,password。 3. 检查pom.xml中MySQL驱动依赖。	1. 启动MySQL服务。 2. 修正配置文件。 3. 确认数据库名、表是否存在。
前端访问localhost:3000白屏或报错	前端服务未启动、代理配置错误、后端服务未运行	1. 检查前端终端是否成功运行npm run serve。 2. 打开浏览器开发者工具 (F12)，查看Console和Network标签页的错误信息。 3. 检查vue.config.js中的proxy配置，确保后端地址正确。	1. 确保前端服务在3000端口运行。 2. 确保后端服务在8080端口运行。 3. 修正代理配置或API请求地址。
登录后页面跳转错误或菜单不显示	路由守卫未正确配置、用户信息获取失败、Token失效	1. 查看浏览器开发者工具Network，登录接口是否返回了正确的用户角色信息。 2. 检查前端路由文件 (router/index.js)，看权限控制逻辑。 3. 检查本地存储 (localStorage) 中Token和用户信息是否存在。	1. 确保登录接口返回的数据结构符合前端预期。 2. 调试前端路由守卫逻辑。 3. 清除浏览器缓存重新登录。
文件上传失败或大小限制	SpringBoot默认文件大小限制、Nginx配置限制、磁盘权限	1. 检查后端application.yml中spring.servlet.multipart配置。 2. 如果使用Nginx，检查client_max_body_size配置。 3. 检查服务器上传目录是否有写入权限。	1. 在后端配置中调大max-file-size和max-request-size。 2. 在Nginx配置中增加client_max_body_size 100M;。
打包后运行Jar包，访问不到前端页面	前端静态资源未正确复制到Jar包内、路径错误	1. 使用jar -tf *.jar查看Jar包内文件结构，确认BOOT-INF/classes/static/下是否有前端文件。 2. 检查前端vue.config.js中的publicPath配置。	1. 确保执行npm run build后，将dist内容复制到了SpringBoot的static目录。 2. 对于History路由模式，确保后端有兜底路由返回index.html。

12. 二次开发与扩展建议

如果你打算以此为基础进行毕业设计，可以考虑从以下几个方面进行功能扩展或优化，使其更具个人特色和深度。

1. 增加智能推荐功能：根据学生的历史成绩、兴趣标签、教师研究方向，使用协同过滤或内容推荐算法，为学生推荐更匹配的课题。
2. 集成消息通知：选题状态变更（如课题被审核、选题被确认/拒绝）时，通过站内信、邮件或微信（可集成Server酱、企业微信机器人）实时通知学生和教师。
3. 强化流程管理：增加开题报告提交与审核、中期检查、论文提交、答辩安排等环节，形成一个完整的毕业设计过程管理系统。
4. 数据可视化仪表盘：为管理员首页增加数据看板，使用ECharts等库展示课题统计、选题趋势、各专业分布等图表。
5. 引入工作流引擎：使用Activiti或Flowable等引擎，将选题、审核、确认等流程图形化、可配置化，提高系统的灵活度。
6. 容器化部署：编写Dockerfile，将前后端和数据库容器化，使用Docker Compose一键部署，提升项目的技术现代性和部署便捷性。
7. 性能与安全优化：
   • 缓存：对频繁访问且不常变的数据（如公告、课题列表）引入Redis缓存。
   • 安全：加强密码加密（使用BCrypt），增加API限流、防止暴力破解，对用户输入进行更严格的校验和过滤（防XSS、SQL注入）。
8. 移动端适配或小程序：基于现有的RESTful API，开发一个微信小程序或Uni-App，方便学生和教师随时随地查看和管理。

这个基于Java的学生毕业设计选题系统，提供了一个非常扎实的SpringBoot+Vue全栈实践样板。从环境搭建、功能测试到代码解读，我们完整地走了一遍。它的价值不仅在于能直接运行，更在于其清晰的分层架构、规范的代码风格和完整的业务流程，为学习者提供了一个绝佳的剖析对象。建议在理解的基础上，结合自己的创意进行改造，这样才能真正转化为你自己的毕业设计成果。项目源码和文档是很好的起点，但真正的收获来自于动手实践和解决问题的过程。