做了这么多年Java Web开发隔三差五就有读者问我毕设或者练手项目该选什么技术栈。这套基于SpringBoot2 Vue3 MyBatis-Plus MySQL8.0的论文管理系统我实际拆过、也带着人跑通过算是这段时间里后台管理类项目里少有的“配料齐全又不花里胡哨”的组合。说它合适不只是因为技术栈新而是每层选型都踩在了毕业设计和中小型后端应用的“甜点区”后端用SpringBoot2稳扎稳打前端用Vue3组合式API写起来比以前的Options API顺手太多持久层交给MyBatis-Plus能省掉一堆重复SQL数据库用MySQL8.0既跑得动单机业务又能在简历上写一句“用过新版本特性”。这个项目本身面向的是高校论文管理场景学生、老师、管理员三种角色各一套操作流程。对学生来说在线选题、上传论文初稿和终稿、查重、查看评阅结果这些是核心动作对老师来说发布论文题目、审核学生选题、在线评阅论文、打分写评语是每学期要重复N遍的活管理员则负责用户管理、学院专业管理、系统公告、参数配置这些后台杂活。所以做出来的东西不是一个“玩具”而是能真正跑完“选题—提交—评阅—归档”完整闭环的业务系统。适合谁参考正在准备毕业设计的同学、想系统学一遍前后端分离开发的新手以及想拿一套完整代码练部署的开发者都能从里面刨到不少有用的东西。下面我把这套项目从设计思路到落地细节从头拆一遍。1. 这套技术栈为什么这么搭很多同学拿到技术选型就直接上手写代码结果写到一半才发现这不对那不对然后反复推倒重来。我先把这套组合的设计逻辑捋清楚搞明白每一环解决什么问题你后面写代码才有底气。1.1 SpringBoot2看似“保守”其实是毕业设计的最优解SpringBoot3出来一两年了但对于大多数做毕设和课程设计的人来说SpringBoot2仍然是最省钱、最省力的选择。这里说的“省钱”不是钱而是时间成本和问题排查成本。SpringBoot3强制要求JDK17并且完全的Jakarta EE命名空间迁移网上老教程一大半不能用——你抄一段代码报错了搜到的解决方案全是旧包路径的心态容易崩。而SpringBoot2的生态已经稳定到了极致任何一个报错都能搜到现成处理办法。另一个实际好处是大多数学校的Java课程和实训项目教的还是SpringBoot2答辩时候老师问起来你对常用注解、自动配置原理、启动流程这些知识点是熟悉的能聊出内容来。选SpringBoot2.7.x这个版本尤其好它是2.x系列的收官版本既有SpringBoot2的成熟度又兼容了较多新特性配合spring-boot-starter-validation、spring-boot-starter-security这些起步依赖做论文系统这种带权限控制的Web应用非常顺手。1.2 Vue3 Element Plus后台管理前端的“新主流填空题”Vue3最大的变化就是组合式APIComposition API。你可以把原来分散在data、methods、computed、watch里的逻辑按业务功能集中到一块复用的时候用组合式函数useXxx一提就行。对于论文系统这种角色多、页面模式重复的后台应用来说这套代码组织方式的优势非常突出学生页面、教师页面、管理员页面有很多相似逻辑抽成组合式函数之后每个页面少写一半重复代码。Element Plus是Vue3生态里最完善的中后台组件库表格、表单、对话框、上传、分页这些论文系统必需的组件全都有现成实现。这里有个小建议直接按需引入而不是全量引入。在vite配置里用unplugin-auto-import和unplugin-vue-components这两个插件代码里写了ElButton就自动按需编译进去打包体积能少不少。对部署在自己服务器上的项目来说首屏速度差那么一两秒体验还是不一样的。1.3 MyBatis-Plus单表CRUD不写SQL留出精力打磨核心业务先说结论MyBatis-Plus不是替代MyBatis它是给MyBatis做增强的。它最实用的是三样东西BaseMapper内置的CURD方法、条件构造器QueryWrapper/LambdaQueryWrapper、分页插件。做论文系统这种业务你会发现80%的数据操作是单表增删改查。比如用户模块的“按用户名查找”、论文题目的“按学院查出所有选题”、评审记录的“按论文ID查评语”——这些用MyBatis-Plus的selectOne、selectList、selectPage配合LambdaQueryWrapper两三行代码就搞定SQL都不用写。剩下20%复杂查询比如多表联查、报表统计手写SQL放Mapper.xml里也不冲突。LambdaQueryWrapper还有个好处是类型安全。旧写法里的QueryWrapper把字段名写成字符串比如user_name字段改名后编译器根本不报错运行期才炸。LambdaQueryWrapper用实体类的getter方法引用比如User::getUsername编译期就能发现错误重构起来也安心得多。1.4 MySQL8.0不止是个版本号是实打实的特性红利选MySQL8.0不只是“追新”它对论文系统这类数据管理项目确实有实际价值。默认字符集utf8mb4在老版本里是utf8mb4_general_ci8.0直接改成utf8mb4_0900_ai_ci中文排序和比较更加符合预期。对学生名、论文标题这种含生僻字的数据存储更友好。还有窗口函数。比如论文成绩排名老写法是用子查询加变量模拟row_number()又绕又难读8.0里直接支持ROW_NUMBER() OVER (PARTITION BY 学院 ORDER BY 总评分 DESC)这样清晰的语法做统计报表方便得多。另外JSON类型的支持也值得一提评审表里存评语、评分细则这类半结构化数据直接用JSON字段存比拆成多张子表灵活。2. 开发前的环境准备每一步都有讲究这部分看起来基础但我敢说踩坑率最高的就是环境。版本不对、插件冲突、密码插件不兼容任何一个小问题都能卡住半天。2.1 JDK、Maven、Node的版本搭配先给一个我验证过的版本组合作为基准JDK 8u202Maven 3.6Node.js 16.14npm 8IDEA 2022.2以上。SpringBoot2完全兼容JDK8但要注意别装JDK9到JDK11之间的某些特殊小版本有的会导致Lombok插件失效。Node版本尤其关键Vite 4要求Node 16.14以上很多同学电脑上装的是Node 14跑npm create vitelatest直接报错。装Node有个建议不要图省事从官网下载安装包覆盖而是用nvm-windowsWindows或者nvmMac/Linux管理多版本方便在Vue2和Vue3项目之间切换。下面是完整的后端起步过程# 后端从脚手架生成项目在IDEA里也可以直接用Spring Initializr mvn archetype:generate -DgroupIdcom.example -DartifactIdpaper-system -DarchetypeArtifactIdmaven-archetype-quickstart -DinteractiveModefalse cd paper-system # 在pom.xml里添加SpringBoot2.7.x依赖后执行 mvn clean install -DskipTests实际动手时我更推荐直接打开 https://start.spring.io/ 选Spring Boot 2.7.18依赖勾选Spring Web、MyBatis Framework选中后自己把包换成MyBatis-Plus、MySQL Driver、Lombok、Validation。这个思路比命令行生成更直观依赖关系也不会手写错。2.2 MySQL8.0的安装与初始配置Windows和Docker两种方式Windows环境直接下mysql-installer-community-8.0.x.msi选Developer Default安装类型一路Next。有两个地方容易埋坑一是端口默认3306如果本机之前装过旧MySQL端口被占用会导致服务起不来可以先netstat -ano | findstr 3306诊断一下有进程就处理一下再装二是root密码设置界面会问认证插件默认是caching_sha2_password这个新版密码插件要求客户端和驱动都支持后面用老版本Navicat或者JDBC驱动连接会报Unable to load authentication plugin建议在安装界面的“Authentication Method”里选“Use Legacy Authentication”如果安装完才发现选错了后面会讲怎么改。如果是用Docker跑MySQL8.0做开发环境一条命令就搞定docker run --name mysql8 \ -e MYSQL_ROOT_PASSWORD123456 \ -e MYSQL_DATABASEpaper_system \ -p 3306:3306 \ -v mysql_data:/var/lib/mysql \ -d mysql:8.0注意容器内的时区问题。MySQL8.0镜像默认时区是UTCJava后端连接后存储CURRENT_TIMESTAMP写进数据库的时间会差8小时。在启动命令里加上--default-time-zone8:00参数能解决或者在JDBC连接串上拼接serverTimezoneAsia/Shanghai。关于两者区别后面第4节还会细说。2.3 前端Vite创建Vue3项目与常见环境问题前端创建命令是npm create vitelatest paper-web -- --template vue cd paper-web npm install npm run dev如果用npm install太慢配置一下淘宝镜像源npm config set registry https://registry.npmmirror.com。这里有个小坑如果npm版本太低create vite可能装不到最新版本执行npm install -g npmlatest升级一下。Vite默认端口是5173开发环境下前后端分离访问会有跨域问题。一个最省事的方案是在vite.config.js里配置开发代理server: { port: 5173, proxy: { /api: { target: http://localhost:8080, changeOrigin: true } } }配置完后前端请求/api/login会被代理转发到后端8080端口浏览器看到的是同源请求不会触发跨域拦截。上线部署时Nginx再做一层同样的代理开发和生产可以无缝切换。3. 论文系统的数据库设计先建模再写代码数据库是这类业务系统的重中之重。表关系没设计好后面写Mapper和前端页面时各种别扭。我设计论文系统时核心思路是“用户-角色-业务数据-流转记录”四层模型。3.1 用户与权限的表结构设计第一张核心表是用户表sys_user字段包括id、username、password、real_name、rolestudent/teacher/admin、学院、专业、学号/工号、phone、email、avatar、status、create_time等。密码一定要存加密后的值推荐BCrypt加密每次盐值不同但能同时验证比MD5加盐更安全。角色直接用字符串字段区分而不是用RBAC四表是因为论文系统的权限模型足够简单一个用户只有一个角色不需要角色继承和细粒度权限点。只有三种角色、每个角色页面固定这种场景用shiro或完整RBAC反而显得臃肿。权限这块做到“路由级别的访问控制”就够用了后端接口再按角色校验一遍。业务数据表的公共字段我习惯统一设计create_by、create_time、update_by、update_time、deleted。这里deleted字段配合的是MyBatis-Plus的物理删除切换逻辑删除功能。用TableLogic注解标一下所有查询自动带WHERE deleted0删除操作自动变成UPDATE deleted1对数据安全和管理都有帮助。3.2 论文业务流程涉及的核心表与关联关系整套论文管理流程会涉及这几张表论文题目表paper_topic老师发布选题的仓库。id、题目名称、题目描述、所属学院、专业方向、指导老师id、选择人数上限、已选人数、状态可选/已满/关闭、审核状态。学生选题表student_topic学生选题记录。id、学生id、题目id、状态待审核/已通过/已驳回、驳回原因、选择时间。论文文件表paper_file提交论文的载体。id、学生id、题目id、文件类型开题报告/初稿/终稿/查重报告、文件路径、文件原始名称、文件大小、上传时间。评审记录表review_record老师评审的成果。id、论文提交记录id、老师id、评分、评语、评审状态、评审时间。成绩表paper_score最终成绩。id、学生id、题目id、总分、各分项得分、评定等级、更新时间。系统公告表sys_noticeid、标题、内容、发布人id、发布时间、是否置顶。表关系上一个老师可以发布多个题目一个题目可被多个学生选择但老师审核通过前学生可退选一个学生最终只能保留一个有效选题学生上传多个版本的论文文件每次上传记录在paper_file老师对学生的最终定稿做评审评完写入review_record最后汇总到paper_score。这套关系网画出来之后你再看前端页面需要哪些接口就一目了然了。4. 后端核心实现从项目骨架到业务代码后端部分我重点挑几个“你照着写就能跑通”的核心环节来讲从目录结构到鉴权再到文件上传。4.1 后端目录分层与MyBatis-Plus分页配置标准的SpringBoot2后端目录结构我习惯这么划分com.example.papersystem ├── common // 通用类统一返回结果、异常处理、常量 ├── config // 配置类MyBatis-Plus分页、CORS、拦截器注册 ├── controller // 接口层 ├── entity // 数据库实体 ├── mapper // MyBatis-Plus的Mapper接口 ├── dto // 入参对象比如登录请求DTO ├── vo // 出参对象比如给前端展示的选题VO ├── service // 业务层 └── utils // 工具类JWT工具、文件上传工具、导出工具MyBatis-Plus分页配置是个容易漏但是不做就分页失效的环节。要创建一个MybatisPlusInterceptor类的Bean并添加PaginationInnerInterceptorConfiguration public class MybatisPlusConfig { Bean public MybatisPlusInterceptor mybatisPlusInterceptor() { MybatisPlusInterceptor interceptor new MybatisPlusInterceptor(); PaginationInnerInterceptor pagination new PaginationInnerInterceptor(DbType.MYSQL); // 设置最大单页限制防止全表查询 pagination.setMaxLimit(500L); interceptor.addInnerInterceptor(pagination); return interceptor; } }配置好之后service层调用page方法才能拿到带total、pages等分页信息的Page对象。没配置这个分页查询会查出全部数据页面却只渲染第一页的假象。4.2 统一返回结果与全局异常处理后端接口返回给前端的数据格式必须统一否则前端Axios封装没法做通用处理。我用的Result对象长这样Data public class ResultT { private Integer code; private String message; private T data; public static T ResultT success(T data) { ResultT result new Result(); result.setCode(200); result.setMessage(操作成功); result.setData(data); return result; } public static T ResultT error(String message) { ResultT result new Result(); result.setCode(500); result.setMessage(message); return result; } }同时配一个全局异常处理器用RestControllerAdvice统一捕获业务异常、参数校验异常和兜底的Exception避免任何异常都以默认错误堆栈抛给前端。这里有个经验参数校验不要自己写if判断直接用Jakarta Validation的Validated NotBlank注解方法参数上声明约束全局处理器里抓MethodArgumentNotValidException返回第一条校验失败信息代码干净、答辨也加分。4.3 JWT鉴权流程Spring Security 自定义过滤器论文系统有明确的三角色区分接口必须做权限控制。主流的做法是用Spring Security做认证授权配合JWT做无状态token。简单说流程是用户提交login请求后端拿着用户名密码去数据库比对BCrypt匹配匹配成功后生成一个token返回前端前端每次请求在Authorization请求头带上Bearer token后端自定义的JwtAuthenticationFilter拦截请求、解析token、把用户信息放进SecurityContextHolder然后Spring Security的配置决定这个接口允许哪些角色访问。核心配置类长这样Configuration EnableWebSecurity public class SecurityConfig { Bean public SecurityFilterChain filterChain(HttpSecurity http) throws Exception { http.csrf().disable() .cors().and() .sessionManagement().sessionCreationPolicy(SessionCreationPolicy.STATELESS) .and() .authorizeHttpRequests(auth - auth .requestMatchers(/api/auth/login, /api/auth/register).permitAll() .requestMatchers(/api/student/**).hasRole(STUDENT) .requestMatchers(/api/teacher/**).hasRole(TEACHER) .requestMatchers(/api/admin/**).hasRole(ADMIN) .anyRequest().authenticated() ) .addFilterBefore(jwtAuthenticationFilter, UsernamePasswordAuthenticationFilter.class); return http.build(); } }用JWT要注意token过期时间。一般开发环境设成2小时都行但如果用户登着登着token过期了前端要能捕获401并跳回登录页否则页面白屏特别尴尬。前端Axios响应拦截器里加一行判断401时清掉本地存储并跳转/login体验能好很多。4.4 文件上传与下载论文提交的核心链路论文系统的关键功能就是文件上传。后端接口接收MultipartFile校验文件大小和后缀名比如限制20MB、允许docx/pdf/zip把文件存储到本地或者OSS上。本地存储时不要直接把上传文件名存数据库安全做法是UUID生成存储名来规避路径穿越攻击String originalFilename file.getOriginalFilename(); String ext originalFilename.substring(originalFilename.lastIndexOf(.)); String storeName UUID.randomUUID().toString().replace(-, ) ext; file.transferTo(new File(uploadDir storeName));数据库里同时记录原始文件名用于下载时前端展示真实名称和存储文件名用于定位磁盘文件。下载接口用OutputStream把文件写给浏览器注意设置Content-Disposition响应头值为attachment;filenameUTF-8编码后的文件名否则中文文件名容易乱码。5. Vue3前端实战从工程搭建到各模块落地前端部分我以一个最常规的后台管理系统为模板来讲论文系统的页面基本都能套用这套结构。5.1 前端目录结构与Axios封装Vue3项目的src目录我建议这样规划src ├── api // 接口定义按业务模块拆分auth.js, topic.js, file.js, review.js... ├── assets // 静态资源 ├── components // 通用组件上传组件、富文本、文件预览 ├── router // 路由配置 动态路由生成 ├── stores // Pinia状态管理 ├── utils // axios封装、工具函数 └── views // 页面按角色分子目录student/teacher/adminAxios封装是整个前端的数据入口这里务必用心做。拦截器里统一处理token注入、响应解包和错误处理。基础http请求封装如下import axios from axios import { ElMessage } from element-plus import router from /router import { useUserStore } from /stores/user const service axios.create({ baseURL: /api, timeout: 15000 }) // 请求拦截器带上token service.interceptors.request.use(config { const userStore useUserStore() if (userStore.token) { config.headers.Authorization Bearer ${userStore.token} } return config }) // 响应拦截器统一处理code码 service.interceptors.response.use( response { const res response.data if (res.code 200) { return res } ElMessage.error(res.message || 请求失败) return Promise.reject(new Error(res.message || 请求失败)) }, error { if (error.response?.status 401) { const userStore useUserStore() userStore.clear() router.push(/login) } ElMessage.error(error.message || 网络异常) return Promise.reject(error) } ) export default service这段代码等于给所有接口套了一层“自动携带token 自动处理业务错误 自动踢回登录页”的壳。每个页面调接口的时候只需要关注业务本身。5.2 Pinia状态管理与角色权限控制Vue3生态里目前最主流的全局状态管理是Pinia——Vuex官方推荐的替代方案API简洁、天然支持TypeScript、没有mutations的概念。论文系统用Pinia存用户信息和token定义storeimport { defineStore } from pinia export const useUserStore defineStore(user, { state: () ({ token: localStorage.getItem(token) || , userInfo: JSON.parse(localStorage.getItem(userInfo) || {}), role: localStorage.getItem(role) || }), actions: { setLoginData(data) { this.token data.token this.userInfo data.userInfo this.role data.userInfo.role localStorage.setItem(token, data.token) localStorage.setItem(userInfo, JSON.stringify(data.userInfo)) localStorage.setItem(role, data.userInfo.role) }, clear() { this.token this.userInfo {} this.role localStorage.clear() } } })路由权限控制在router里做。前端定义好所有路由meta字段标roles允许哪些角色访问然后在全局前置守卫router.beforeEach里判断router.beforeEach((to, from, next) { const userStore useUserStore() if (to.meta.public) { next() return } if (!userStore.token) { next(/login) return } if (to.meta.roles !to.meta.roles.includes(userStore.role)) { next(/403) return } next() })这样既做到了角色隔离又从代码上把权限逻辑集中到了一处答辩时能清晰讲出来。5.3 核心页面实现选题、提交、评审、成绩前端页面要围绕几个核心业务场景来写。学生选题页进入后调接口查出老师发布的所有题目列表用el-table el-pagination分页展示题目卡片上显示选择人数上限和已选人数。点击选题后调post接口记录如果题目满员则按钮置灰。学生端还要有“我的选题”页面能查看审核状态被驳回时显示驳回原因这时允许重新选择或退选。论文提交页这里核心是el-upload组件。用el-upload加action属性指向后端上传地址注意要带上token所以需要动态设置action或者在before-upload里用自定义headers属性el-upload :actionuploadUrl :headersuploadHeaders :data{ paperId: currentPaperId, fileType: final } :on-successhandleUploadSuccess :before-uploadbeforeUpload el-button typeprimary上传终稿/el-button /el-upload弹窗预览用PDF或者Word在线预览的话可以直接把后端文件地址放进iframe里打开前提是后端配合返回文件流。最简单的方案是点击“下载”时用window.open或者a标签触发blob下载兼容性最好。教师评阅页展示待评审学生列表点进去看到提交的论文文件下载后在线评分。评分表单用el-form规则校验保证分数在0-100范围内。提交后生成评审记录并更新成绩表。管理员数据看板用ECharts画几个图表展示各学院选题人数分布、论文提交进度、成绩分段统计。数据库统计的SQL在后端Mapper.xml里写窗口函数正好派上用场。6. 部署上线与常见问题排查实录项目写完只是第一步能部署到服务器上跑起来才算完整交付。6.1 后端打包与前端构建的完整流程后端用Maven打包mvn clean package -DskipTests打包产物是target目录下的paper-system-0.0.1-SNAPSHOT.jar。在服务器上执行nohup java -jar paper-system-0.0.1-SNAPSHOT.jar --server.port8080 app.log 21 如果需要后台托管用systemd写一个service文件更专业进程被杀、宕机重启都能自动拉起。前端构建npm run build产物在dist目录。用Nginx托管并配置反向代理server { listen 80; server_name your-domain.com; root /var/www/paper-web/dist; index index.html; location /api/ { proxy_pass http://127.0.0.1:8080/api/; } location / { try_files $uri $uri/ /index.html; } }try_files那行是专门给Vue路由用的刷新页面时不会404而是回退到index.html由前端路由接管。6.2 高频报错排查速查表我把开发这套系统过程中遇到最多的几个问题整理成了一张表按“现象 - 原因 - 解法”列出来现象根本原因解决办法启动报Unable to load authentication plugin caching_sha2_passwordMySQL8.0默认密码插件与旧版JDBC驱动不兼容升级mysql-connector-j到8.0.x或在MySQL里执行ALTER USER rootlocalhost IDENTIFIED WITH mysql_native_password BY 123456数据库查询报The server time zone value is unrecognized连接串没指定时区JDBC URL加serverTimezoneAsia/ShanghaiuseSSLfalse前端请求接口跨域报错开发环境前端5173端口请求8080端口用Vite的proxy代理生产环境用Nginx统一入口刷新Vue页面404前端路由是history模式后端没有回退到index.html在Nginx配置location / 里加try_filesMyBatis-Plus分页查询不生效total一直是0没配置分页插件添加MybatisPlusInterceptor并注册PaginationInnerInterceptor上传大文件超时Nginx默认client_max_body_size太小在Nginx的http或server块里加client_max_body_size 20m中文文件名下载乱码Content-Disposition编码问题使用URLEncoder.encode(name, UTF-8)再拼接6.3 几个独家的部署小技巧上到服务器我一般建议把MySQL5.7和8.0的环境彻底分开避免之前的服务干扰新项目。另外数据库备份这件事别临时抱佛脚直接写进Linux的crontab定时任务每天凌晨备份一次备份文件用tar打包加日期命名保留最近7天防的就是手滑删库或者服务器被黑后恢复数据。MySQL8.0的字符集一定要在数据库创建时就定好而不是建表之后再改CREATE DATABASE paper_system DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;创建后再改字符集不仅麻烦而且改完后已存在表的排序规则可能还是旧的后患不少。7. 项目后续还可以这样扩展这套论文系统的底子搭得比较干净后续扩展方向其实很多。如果要做查重功能可以对接第三方查重API在提交终稿时主动触发查重把查重报告链接存到paper_file表里如果要做消息通知集成WebSocket学生选题被审核通过或者老师发布新题目时实时推送给相关用户如果要做答辩管理再延伸出答辩分组、答辩时间安排、答辩评分这几张表就能撑起一个新模块。我自己在实际跑通这套项目后的体会是这类“带文档的全栈项目”最大的价值不是代码本身而是它让你亲手走完一遍数据库设计、后端接口、前端页面、部署上线的完整链路。很多同学在学校里写过不少Java代码但完整跑通一个前后端分离系统的没有几个。把这条链路走通远比反复刷某个框架的教程更能提升实战能力。最后再分享一个小技巧给项目写文档的时候除了写“怎么启动”一定要把“每个表是干嘛的、每个接口的入参出参长什么样、权限是怎么控制的”三件事写清楚。这样做的好处是过两个月你自己回来看代码才不会对着以前写的接口发呆。这套项目我整理过完整的数据库说明文档和接口文档需要的朋友按着上面的架构自己补全或者做二次开发思路都很清晰。