课程设计选题管理这个场景做过的同学应该都有体会每到学期初导师和学生双方都在同一个时间点涌进系统要么是选不到合适的课题要么是老师手动分配名单改来改去。市面上现成的系统不少但真要拿来交作业或者自己学习前后端分离开发还是自己动手撸一套SpringBootVueMyBatisMySQL的完整项目最实在。这年头前后端分离已经是Web开发的标配与其对着网上的碎片教程东拼西凑不如直接拆一个能跑通的选题管理项目把源码、表结构、部署流程都过一遍。这篇文章我就以这套课程设计选题管理ABO系统为例从需求拆解、数据库设计、后端接口、前端页面、打包部署、常见坑位几个方向完整讲透。适合正在做课程设计、毕业设计或者想系统入门SpringBootVue全栈开发的同学也适合那些手里有一个“能跑但说不清为什么”的项目、想补一补原理的开发者。整套东西我踩过的坑都会在对应位置标出来能帮你少走不少弯路。1. 整体设计与需求拆解1.1 选题管理到底管什么先别急着写代码你得先把业务想明白。课程设计选题管理核心参与角色无非三类管理员、教师、学生。管理员负责基础数据维护和系统配置教师负责报课题、审核学生选题、录入成绩学生负责查看课题、选定课题、查看结果。如果系统再完善一点还要支持志愿选择和冲突处理比如一个课题最多只允许N个学生选择超出之后要能自动或手动调配。这套ABO系统的命名在课程设计里很常见ABO本身只是项目代号一般理解成“Automated Batch Operation”或者干脆就是课程设计的一个工作名。很多同学拿到这类项目最容易犯的错是上来就建表、写接口结果做到一半发现学生选课题和教师确认课题的关系理不清或者管理员想调整某个学生的课题时改起来特别别扭。这说明前期需求梳理没做到位。我建议你先把核心流程画在纸上管理员导入教师和学生账号 - 教师提交课题可以带名额上限 - 管理员审核课题并发布 - 学生在可选列表中选择课题 - 教师确认或驳回 - 管理员查看全局进度并可手动调配 - 中期录入成绩 - 结束。这个过程走通了数据库和接口设计就顺理成章。1.2 为什么选择前后端分离这个项目用的是前后端分离架构前端Vue负责页面交互后端SpringBoot只提供JSON接口两边通过HTTP通信。相比传统的Thymeleaf模板渲染工程前后端分离最大的好处是职责清晰后端同学专注接口逻辑前端同学专注页面交互两边都能独立开发和调试。对于课程设计来说这还意味着工作量拆分更明显答辩的时候能讲的东西也多。另一个实际好处是部署灵活。前端构建出来就是静态文件扔到Nginx里就行后端打成一个jar包用Java命令就能跑。两个服务之间用Nginx做反向代理既解决了跨域问题又能达到前端静态资源与后端动态接口分离的效果。这套部署思路在真实公司项目里也是主流做法学会了以后做别的项目也能迁移。当然前后端分离也有代价前端跨域调接口要配置部署时要维护Nginx配置联调成本比单体高一些。但以这套技术栈的成熟度来说这些代价在开发期和工作量面前完全可以接受。1.3 技术栈的核心优势SpringBootVueMyBatisMySQL这套组合说是Java Web课程设计里最“安全牌”的搭配也不为过。SpringBoot简化了Spring的配置起步依赖帮助你快速集成Web、MyBatis、数据库驱动等组件不需要自己往Tomcat里打war包。Vue的响应式数据绑定大大简化了前端DOM操作加上Element UI这类组件库后台管理界面很快就能搭出来。MyBatis则把SQL和Java方法绑定在一起复杂查询可控性强对课程设计阶段非常合适比动不动几百行配置的JPA更好理解。选择这套组合也意味着资料多、生态成熟、遇到问题随便一搜就有一堆解决办法。我见过一些同学非要挑战小众框架结果卡在一个很不起眼的依赖版本问题上花了两三天最后还要换回主流方案。课程设计的时间本来就紧选主流技术栈不是没追求而是把精力花在业务功能的实现上这才是聪明的做法。2. 数据库设计与后端接口规划2.1 核心表结构与关系梳理数据库设计是整套系统的地基。这个项目我建议至少包含以下核心表用户表、角色表或直接在用户表里加角色字段、课题表、选题记录表、通知公告表、成绩表、学院专业表。如果你不想过度设计角色字段可以直接用字符串存在用户表里省掉角色和权限的多对多关系但如果你希望在答辩时体现更完整的设计可以考虑用Spring Security做RBAC模型。用户表字段相对固定id、username、password、real_name、roleadmin/teacher/student、college_id、major_id、phone、email、status。密码字段必须加密存储至少用BCrypt来哈希别用明文也别自己写个什么“MD5加盐”的民间算法用现成的工具类最省事。课题表是业务核心id、title、description、teacher_id外键关联教师、type课题类型、max_students最大选课人数、selected_count当前已选人数、status待审核/已发布/已下架/已结束、create_time、update_time。这里有个容易踩的坑selected_count用单独字段维护还是每次查询时统计关联表数据我的建议是两个都要列表展示时直接用维护好的selected_count性能好产生选题关系时事务里atomic更新这个字段同时用唯一索引保证并发场景下不会超选。选题关系表id、student_id、teacher_id、topic_id、status待确认/已确认/已驳回/已退选、priority第几志愿、create_time、update_time。一个学生同时只能有一条进行中的选题记录这个约束可以在代码里做也可以用唯一索引加字段组合来兜底。我在实际项目里是“应用层校验 数据库唯一索引”双保险宁可多写一行也不让学生数据打架。考试成绩表id、student_id、topic_id、score、remark、teacher_id、update_time。如果课题阶段没有成绩需求这张表可以先建好不过多开发界面后续有需要再补。2.2 RESTful API 设计规范接口设计直接影响前端的对接体验。项目里所有接口统一走/api前缀按资源拆分成/api/auth登录认证、/api/user用户管理、/api/topic课题管理、/api/selection选题管理、/api/notice公告等模块。我的习惯是先列下每个模块的核心接口清单再动手写Controller。拿选题流程举例几个关键接口必须先定下来学生获取可选课题列表GET /api/topic/available?pageNum1pageSize10keyword...学生提交选题POST /api/selection教师确认学生选题PUT /api/selection/{id}/confirm教师驳回学生选题PUT /api/selection/{id}/refuse学生退选PUT /api/selection/{id}/withdraw管理员手动调配POST /api/selection/admin/adjust每个接口返回值都统一封装成一个Result对象包含code、message、data三个字段。code为200代表成功401代表未登录或token失效403代表权限不足500代表服务器异常。这样前端axios拦截器可以统一处理状态码不用每个请求都单独判断。这个封装类没多大技术含量但能让你后期的联调和排查省很多时间。接口响应前端时要注意列表接口建议带分页参数和总记录数使用MyBatis的分页插件PageHelper可以一行代码搞定详情接口返回对象本身即可。字段命名统一用驼峰前端拿到数据后直接用不再单独做字段映射。2.3 登录认证与权限控制前后端分离项目里登录认证最常用的方案是JWT。用户输入账号密码后端验证成功后生成一个token前端存储这个token后续每次请求在请求头里带上Authorization: Bearer token后端用拦截器或过滤器校验token解析出用户信息再判断是否有权限访问对应接口。我在这个项目里用的方案是登录接口返回token字符串同时返回用户基本信息id、用户名、真实姓名、角色。前端把token存到localStorage里把用户信息存到Vuex或Pinia里。axios请求拦截器在请求发出前自动带上token响应拦截器捕获401后跳转到登录页。权限控制上项目里最简单的做法是写一个后端拦截器拦截所有/api/**请求先校验token是否有有效再从token或者Redis缓存中获取当前用户角色判断是否允许访问。角色权限如果只用三四个接口权限的话直接在注解或代码里if(admin.equals(role))也够用。如果你想做得更专业可以集成Spring Security或者自定义RequireRole注解配合AOP实现这个看你的时间预算和答辩需要不加分不会扣分但做出来确实能体现完整考虑。关于JWT密钥和过期时间有一个常见的坑把过期时间设置的特别长比如7天甚至30天这样“免登录”效果是有了但安全问题严重。课程设计可以设置2小时过期前端每次刷新页面时通过刷新token来维持登录状态或者简单一点直接设置24小时有效过期后让用户重新登录。这些小细节在答辩时可以主动提出来说明你有安全意识。3. 核心功能实现与关键代码剖析3.1 课题发布与审核流程教师发布课题的核心逻辑很简单填写课题标题、描述、类型、可选人数上限保存后课题状态是“待审核”。后端Controller接收表单数据后需要把当前登录用户的ID作为teacher_id写入课题表不能让前端传teacher_id否则有越权风险。管理员审核课题时看到的是所有待审核课题列表可以一次性通过多个也可以单个驳回并填写驳回原因。这个功能实现上没有什么复杂逻辑真正容易出错的是“已通过课题不能被随便删除”。我建议在删除或下架课题时先查询选题关系表里是否已有状态为“已确认”的记录如果有就不允许删除只允许修改课题状态为“已结束”。这一条我是在实际运行中被数据搞怕了才加上的刚开始觉得不会有人手滑后来发现真有同学和管理员误删课题删完学生那边全乱了。课题发布后学生端的可见范围建议用“已发布”状态加“已选人数小于最大人数”两个条件联合过滤。已满的课题不出现在可选列表里但学生如果只差一个名额恰好有人退选那么该课题应该重新出现在列表里所以在查询时实时计算已选人数不要用数据库冗余字段做列表过滤条件容易出现不一致。3.2 学生选题与教师确认的并发问题既然允许多个学生同时抢同一个课题就必须考虑并发。课题名额max_students设置成5两个学生同时提交选择如果代码里是先查询available_count再判断是否小于max_students最后执行insert和update那么在高并发下两个请求可能同时读到可用数量是1和1最后两个人都选上了名额超了。解决办法有几种。最简单但不太优雅的方案是在关键方法上加synchronized但这个只对单实例部署有效分布式下不生效。另一种靠谱方案是使用数据库的乐观锁在课题表的update语句里加上WHERE selected_count max_students如果更新的影响行数为0说明已经被别人抢满了本次申请失败给前端返回“课题已满”的提示。这条SQL就是关键所在UPDATE topic SET selected_count selected_count 1 WHERE id #{topicId} AND selected_count max_studentsJava代码里可以这样写Transactional(rollbackFor Exception.class) public void selectTopic(Long studentId, Long topicId) { // 1. 新查询确认学生没有未结束的选题记录 // 2. 插入选题关系记录状态为待确认 // 3. 执行上面这条update语句 int rows topicMapper.increaseSelectedCount(topicId); if (rows 0) { throw new BusinessException(课题名额已满请选择其他课题); } }这里的核心逻辑是先插入选题记录再执行条件更新课题表的selected_count。如果更新失败就抛异常整个事务回滚插入的选题记录也会被撤销。实测下来这个方案能很好应对课程设计节点的并发峰值几百人同时点在系统上也不会出现超选。3.3 前端Vue核心页面与状态管理前端部分我习惯用Vue 3 Vite Element Plus组合。Vue 3的组合式API写起来比Options API清晰一些代码复用也更方便Vite的启动速度和热更新体验比Webpack好太多对开发调试很友好。项目里会包含登录页、学生端页面、教师端页面、管理员端页面四个大模块。学生端核心页面是“选课中心”进去之后默认显示所有当前可选的课题列表支持按关键词、课题类型筛选分页加载。点击某个课题可以查看详情弹窗包括课题描述、名额情况、教师信息。符合条件的课题显示“选择”按钮点击后弹二次确认框然后调用提交接口。页面交互不多但数据展示部分建议做好状态映射比如课题状态0代表待审核、1代表已发布、2代表已结束不要直接显示数字用formatter转成文字标签。教师端核心页面是“我的课题”和“选题审核”。前者是教师自己发布的课题列表可以增删改查删除按钮要判断课题是否已被选择。后者是这个课题下所有申请记录每条记录显示学生信息和状态审核时点击确认或驳回按钮调用对应接口。驳回时可以用输入框让教师填写原因这个原因在学生端“选择进度”里要能看到。管理员端页面最杂有用户管理、课题审核、全局进度、调配管理、公告管理等。用户管理支持Excel导入这种场景非常适合做“模板下载、学生名单批量导入”用前端把Excel解析成JSON再提交后端也行后端用EasyExcel解析也行。课程设计阶段我更推荐后端解析逻辑更集中前端只管上传文件省的到处都是重复代码。状态管理我建议用Pinia。虽然项目里真正需要在多组件间共享的状态不多主要是用户信息和token但把登录用户信息放进store里在导航守卫中检查登录状态代码会干净很多。还有一个容易忽略的细节前端的路由守卫必须动态判断角色不能让普通学生访问教师后台页面。页面级的权限控制是前端负责的后端接口级的权限控制是后端负责的两者是“双保险”关系不能只靠其中一层。3.4 几处不得不说的加分细节除核心功能外有几个小功能建议顺手做了不费太多工作量但很有展示价值。一是首页统计面板管理员进入后台后能看到学生总数、教师总数、课题总数、已完成选题人数用ECharts画一个简单的柱状图或饼图效果很加分。二是系统公告管理员可以在线发布公告学生端登录后首页滚动展示这个功能实现成本极低一张表一个接口一个页面组件就搞定。三是操作日志记录谁在什么时间做了什么操作。对答辩来说这些非核心功能反而是能展示你系统设计完整度的地方花小钱办大事。4. 部署上线全流程与配置要点4.1 本地开发环境准备本地调试前先确保环境变量里的工具都装齐了。JDK建议用8或11版本太新偶尔会遇到兼容问题Maven用3.6以上Node用16以上MySQL用5.7或8.0都行。数据库连接串里的时区问题是个经典坑8.0版本的MySQL驱动要求serverTimezone必须配置否则启动时直接报空指针或时区异常。建议连接串写成jdbc:mysql://localhost:3306/course_design?useUnicodetruecharacterEncodingutf8serverTimezoneAsia/ShanghaiuseSSLfalseallowPublicKeyRetrievaltrueallowPublicKeyRetrievaltrue这个是MySQL 8.0才需要加的不加会出现Public Key Retrieval is not allowed的错误。我见过太多人在这个问题上卡一下午其实一行配置就能解决。MySQL建好库后直接把项目里的sql文件导入即可。sql文件里要包含建表语句和基础数据至少有一个初始管理员账号方便第一次启动能登录系统。建议把密码初始值设置成一个固定值比如admin123然后在文档里提醒用户登录后尽快修改。注意sql文件里的字符集要设为utf8mb4否则输入中文时发现能存但显示乱码又是玄学级问题。4.2 后端打包的正确姿势后端打包是每次部署最容易出错的一步。项目根目录下执行mvn clean package -DskipTests如果Maven配置过国内镜像这一步通常几十秒就能完成。构建成功后target目录下会出现一个xxx.jar这就是可执行的后端包。启动命令很简单java -jar xxx.jar但部署时要注意指定环境配置Spring Boot默认加载application.yml如果你把数据库账号密码直接写在配置文件里生产环境修改起来很麻烦而且容易忘记改。更好的做法是启动时用--spring.profiles.activeprod指定生产环境配置或者直接用环境变量DATABASE_URL、DATABASE_USERNAME来覆盖默认值。课程设计阶段最简单靠谱的方式是把application-prod.yml里的数据库连接改好日志输出到指定目录然后启动命令带上--spring.profiles.activeprod。另一个常见问题是指定运行端口。如果服务器上80端口被Nginx占用后端服务建议运行在8080然后通过Nginx反向代理转发到8080前端只认80或443前后端接口路径统一走/api这样客户端不用关心后端具体端口。反向代理配置在下面的Nginx小节里会说。4.3 前端构建与Nginx反向代理配置前端项目开发调试用npm run dev打包上线用npm run build。构建成功后dist目录里就是所有静态资源。直接把这个dist目录里的内容拷贝到服务器的/usr/share/nginx/html或者你自己定义的路径下即可。Nginx配置是部署环节的重头戏我贴一段我常用的配置模板server { listen 80; server_name your-domain.com; access_log /var/log/nginx/access.log; error_log /var/log/nginx/error.log; # 前端静态资源 location / { root /usr/share/nginx/html; index index.html; try_files $uri $uri/ /index.html; } # 后端接口反向代理 location /api/ { proxy_pass http://127.0.0.1:8080; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; } }这里两个关键点都是血的教训。第一location /里必须配置try_files $uri $uri/ /index.html否则刷新某个子路径页面时Nginx找不到对应文件会返回404必须让它回退到index.html前端路由才能接管。只要用Vue Router的history模式这个问题就一定存在网上报“前端刷新404”的同学十有八九是漏了这句。第二location /api/里proxy_pass的地址不要漏掉末尾的/漏了会导致路径拼接错误。部署完成后登录测试时如果前端能打开页面但接口报跨域或404八成是Nginx的/api路径没有正确转发先看access.log和error.log这两个日志文件是你排错的起点。4.4 Windows与Linux部署差异很多同学的本机是Windows服务器却是Linux部署流程上有些细节要单独提醒。Windows下启动jar包直接在命令行窗口里用java -jar跑但如果关掉窗口服务就停了。比较省事的做法是写一个start.bat批处理脚本内容就一行java -jar xxx.jar双击运行服务器上则用systemd服务来管理进程这样服务器重启后服务能自动拉起。systemd配置文件示例[Unit] DescriptionCourseDesignApplication [Service] Userroot WorkingDirectory/opt/course-design ExecStart/usr/local/java/bin/java -jar /opt/course-design/app.jar --spring.profiles.activeprod Restartalways [Install] WantedBymulti-user.target把文件放到/etc/systemd/system/course-design.service然后执行systemctl daemon-reload、systemctl start course-design就能管理服务了。日志默认输出到命令行时屏幕里如果用systemd运行可以用journalctl -u course-design -f查看实时日志。这个比直接敲命令多了一步配置但能让你在服务器上脚踏实地干活而不是窗口一关服务就消失。5. 常见问题与排查技巧实录5.1 前端常见问题与解决思路前端最常见的报错分成两类一类是“页面打不开”另一类是“接口请求报错”。页面打不开大概率是Nginx配置问题检查Nginx是否启动、访问的路径是否对、监听端口是否正确。可以用curl -I http://localhost测试Nginx是否正常响应再逐层排查。接口请求报错就复杂一点。如果在浏览器F12网络面板看到接口返回403基本是登录态失效。如果是返回500那问题出在后端先把后端接口直接用Postman调一次如果还是500就看后端日志。如果浏览器提示“CORS policy blocked”那就是跨域问题解决办法有两个后端添加全局跨域配置类或者直接靠Nginx反向代理规避。Nginx模式下前端页面和后端接口同源不会触发浏览器跨域检查所以生产环境很少遇到CORS。开发阶段用npm run dev跨域调后端建议在Vite的配置文件里配一个proxyserver: { proxy: { /api: { target: http://localhost:8080, changeOrigin: true } } }这样开发环境也不会有跨域问题和后端联调时省下大量时间。5.2 后端常见问题与排查步骤后端启动时报错自己先按顺序检查数据库服务启动了吗账号密码对不对连接串带时区配置了吗端口被占了吗这四步排查完70%的问题已经解决了。如果还是报错把完整的堆栈信息贴到搜索引擎里搜比在群里反复问人快。运行时报的一个高频错误是MyBatis绑定异常Invalid bound statement (not found)这个一般是mapper接口和xml文件没有成功绑定。检查三处xml文件路径是否在resources目录的mapper目录下xml里的namespace是否对应接口全限定名application.yml里是否配置了mybatis.mapper-locations: classpath:mapper/*.xml。这三处都对上了这个错基本就消失了。还有一个高频问题登录接口能通过但访问需要权限的接口报401。这个先检查前端请求头是否带上了Authorization再看后端的token校验逻辑是否从请求头里正确取到了值。我在跨域配置里遇到过一个坑如果后端配了allowedOrigins(*)同时又把token放在请求头里某些浏览器会发起OPTIONS预检请求后端如果没处理OPTIONS请求就会导致真正的功能请求失败。解决办法是在对应的Controller或拦截器里对OPTIONS请求直接放行这个细节记得留个心眼。5.3 数据库相关问题速查数据库问题里最经典的要属“中文乱码”。排查思路是数据库连接串有没有指定characterEncodingutf8数据库表是不是utf8mb4前端页面charset是不是utf-8MySQL配置文件里default-character-set是什么。四层都对齐了中文就是正常的以上任何一层有问题乱码都可能在某一环节出现。另一个经典问题是MyBatis配置文件里的时间字段如果Java实体类用的是LocalDateTime数据库是datetime通常没问题。但如果有同学的数据库是timestamp且设置成CURRENT_TIMESTAMP ON UPDATE执行更新操作后你会发现这个字段自己变了这是数据库特性不是程序bug别花时间在这个上面排查。还有一点要提醒sql文件导入时如果表之间有外键必须先导入主表再导入子表否则会报外键检查失败。可以临时用SET FOREIGN_KEY_CHECKS 0;关闭外键检查导入完再打开这也是官方推荐的方式。5.4 排障清单表现象可能原因排查/解决方式前端404Nginx try_files未配置添加try_files $uri $uri/ /index.html;接口报403token未携带或过期检查前端请求头和后端token校验接口报500数据库连接/字段映射问题查看后端日志定位具体异常堆栈启动报端口占用8080或其他端口被占更换端口或释放占用进程中文显示乱码连接串/表字符集不一致统一utf8mb4并配置characterEncoding后端能跑但前端连不上Nginx/api代理配置错误检查proxy_pass路径和location匹配接口返回“课题已满”但列表显示有名额缓存或查询条件不一致检查列表查询与提交逻辑的状态条件是否统一6. 从代码到项目答辩的经验延伸整个项目从零到一跑通之后你会发现最有价值的反而不是代码本身而是“完整地做过一个系统”的过程。课程设计的评分往往不会只看功能是否全部实现更多会看你是否讲清楚了这些事为什么选前后端分离、数据库表为什么这么设计、并发问题怎么处理、部署环境有哪些坑。把上面这些思路消化掉答辩时被问到的任何问题都能讲出一些依据而不是只会说“照着教程写的”。如果你还有余力可以考虑给这个项目再扩展几个方向。比如加上Redis缓存来存登录token和课题列表让并发能力更强比如把前端升级成更复杂的动态菜单权限比如做一个数据导出功能管理员可以把选课结果一键导出成Excel这也是很受老师欢迎的功能。扩展点很多挑一个和你的兴趣方向匹配的就好。再分享一个小技巧项目里每个模块的代码不要写得太“一次性”把日期格式化、分页参数、结果集封装这些能复用的代码尽量抽出来。这对自己后期的维护和二次开发都有很大的帮助也方便迁移到新的项目中去。我在实际跑这个项目的过程中最大的体会是前后端分离虽然多了一层联调和部署的工作但所有环节都是可控的、有章可循的。开发前期把需求理清楚开发中把接口约定好部署时把配置核对全这套系统就能稳定运行。如果你在这个基础上继续加功能整个骨架也不会散这是这个项目带给我最大的收获。
