简介这份资源是面向计算机专业学生与Java全栈开发学习者的校园兼职平台完整项目源码基于Spring Boot与Vue技术栈实现可作为毕业设计、课程设计或前后端分离练手项目。项目围绕学生求职与企业招聘两大场景后端负责业务逻辑、数据库交互与RESTful接口前端承担页面渲染与用户交互并引入Spring Security做认证授权、HTTPS保障传输安全覆盖需求分析、数据库设计到测试的完整流程。压缩包共1470个文件约74.88MB包含129个Java源文件、69个Vue组件、102个HTML页面、101个CSS样式及大量js、图片与依赖资源另附sql脚本、yml配置与bat启动脚本目录结构清晰便于快速部署与二次开发。目前已有448人学习下载适合希望掌握前后端分离架构、积累真实项目经验的读者参考借鉴。1. 从零到一这套校园兼职平台源码到底能跑通什么业务如果你正在找一套能直接跑起来、代码结构清晰、业务闭环完整的 Spring Boot Vue 全栈项目这套校园兼职平台的设计与实现大概率能省掉你两周的搭建时间。它不是那种只有登录注册的“空壳 Demo”而是把学生找兼职、企业发岗位、管理员审核这三条核心链路都串起来了。我拿到源码后第一件事就是跑通主流程学生端浏览岗位、投递简历、查看投递状态企业端发布岗位、筛选简历、标记录用管理端审核企业资质、下架违规岗位。整个流程走下来没有出现断链或假数据填充的情况数据库表之间的外键关联也是真实存在的。这套资源适合谁第一类是做毕业设计的学生尤其是选题落在“校园服务”“兼职招聘”“信息管理”方向的可以直接拿来做基础框架改改 UI 和业务字段就能变成自己的东西。第二类是想学前后端分离实战的开发者项目里 JWT 鉴权、分页查询、文件上传、角色权限控制这些常见场景都有落地代码比看文档敲示例更贴近真实项目。第三类是小团队接私活时需要一个快速起步的模板省去从零搭权限和基础 CRUD 的时间。需要提前说明的是这套代码用的是 Spring Boot 2.x Vue 2 Element UI 的技术栈如果你非要上 Vue 3 Vite Pinia那得自己动手迁移但后端接口层几乎不用大改。我见过太多人下载完源码解压后看到几十个文件夹就懵了不知道从哪开始。这篇笔记就按我自己的复现路径来先讲清楚项目结构和选型逻辑再一步步把前后端跑起来然后重点说几个我踩过的坑最后给一个能直接抄的接口调试技巧。你跟着走一遍至少能保证本地环境跑通至于二次开发那是跑通之后的事。2. 拆开代码包模块划分与前后端技术选型逻辑2.1 后端目录结构与分层设计解压后端代码你会看到标准的 Maven 多模块结构但别被“多模块”吓到实际上就是按职责拆成了几个包。我习惯先看pom.xml确认依赖版本再顺着controller→service→mapper的调用链摸一遍。这套项目的后端分层很规矩没有把业务逻辑写在 Controller 里也没有在 Service 里直接拼 SQL。!-- pom.xml 关键依赖节选 -- dependency groupIdorg.springframework.boot/groupId artifactIdspring-boot-starter-web/artifactId /dependency dependency groupIdcom.baomidou/groupId artifactIdmybatis-plus-boot-starter/artifactId version3.4.3/version /dependency dependency groupIdio.jsonwebtoken/groupId artifactIdjjwt/artifactId version0.9.1/version /dependency上面这三个依赖基本决定了后端的骨架Web 层用 Spring MVC持久层用 MyBatis-Plus 简化单表 CRUD鉴权用 JWT 做无状态令牌。MyBatis-Plus 的BaseMapper和IService能省掉大量重复代码但要注意复杂联表查询还是得自己写 XML 或注解 SQL别指望它全自动。包结构大致是这样的com.xxx.campusparttime.controller对外接口负责参数校验和响应封装com.xxx.campusparttime.service业务逻辑事务注解加在这一层com.xxx.campusparttime.mapper数据访问接口继承 MyBatis-Plus 的 BaseMappercom.xxx.campusparttime.entity数据库实体类字段与表一一对应com.xxx.campusparttime.config跨域配置、拦截器注册、Swagger 配置com.xxx.campusparttime.utilsJWT 工具类、统一返回结果封装、文件上传工具我一般会先打开application.yml看数据库连接和端口配置这是跑起来的第一道门槛。server: port: 8081 spring: datasource: url: jdbc:mysql://localhost:3306/campus_parttime?useUnicodetruecharacterEncodingutf8serverTimezoneAsia/Shanghai username: root password: 你的密码 driver-class-name: com.mysql.cj.jdbc.Driver mybatis-plus: mapper-locations: classpath:mapper/*.xml configuration: map-underscore-to-camel-case: true这里有个细节serverTimezoneAsia/Shanghai必须加否则 MySQL 8 会报时区错误。map-underscore-to-camel-case开启后数据库的create_time会自动映射到实体的createTime省去手动写 ResultMap。2.2 前端工程结构与路由权限控制前端是 Vue 2 Element UI 的组合用 vue-cli 搭建目录结构比较传统。src/views下按角色分了student、company、admin三个文件夹每个文件夹里是对应的页面组件。src/router/index.js里定义了路由表并通过meta.role字段标记哪些角色可以访问。// router/index.js 路由守卫节选 router.beforeEach((to, from, next) { const token localStorage.getItem(token) const role localStorage.getItem(role) if (to.meta.requireAuth !token) { next(/login) } else if (to.meta.role to.meta.role ! role) { next(/403) } else { next() } })这段守卫逻辑很直白没 token 就踢回登录页角色不匹配就跳 403。但实际用的时候要注意localStorage里的role是登录成功后写进去的如果用户手动改了role值前端路由能绕过但后端接口层还有一层 JWT 解析和角色校验所以不会造成越权操作。这也是前后端分离项目的基本安全底线前端路由控制体验后端接口控制安全。src/api目录下按模块封装了 axios 请求每个请求都带了拦截器统一处理 token 和错误提示。我建议你先看src/utils/request.js里面配置了 baseURL 和请求/响应拦截器改后端端口的时候只改这一个文件就行。2.3 数据库表关系与核心字段说明数据库是整个项目的基石表关系没理清后面写业务就是瞎猜。这套项目一共 8 张核心表我挑几个关键的说明表名作用关键字段user统一用户表id, username, password, role, statusstudent_info学生扩展信息user_id, real_name, school, major, resume_urlcompany_info企业扩展信息user_id, company_name, license_url, audit_statusjob兼职岗位id, company_id, title, salary, work_time, statusdelivery投递记录id, job_id, student_id, status, create_timeaudit_log审核日志id, target_type, target_id, admin_id, resultuser表用role字段区分学生、企业、管理员登录时根据角色返回不同的前端路由。delivery表的status字段控制投递状态流转0 待查看、1 已查看、2 邀请面试、3 已录用、4 已拒绝。这个状态机在 Service 层有对应的枚举类改业务的时候别直接写数字用枚举更稳妥。提示导入 SQL 文件时先建库再导表字符集选utf8mb4否则企业名称里的特殊符号会乱码。3. 本地跑通实战从数据库初始化到前后端联调3.1 数据库初始化与后端启动第一步永远是数据库。源码包里一般会带一个sql文件夹里面是建表语句和初始数据。我习惯用 Navicat 或者命令行导入命令行更快# 登录 MySQL 并创建数据库 mysql -u root -p CREATE DATABASE campus_parttime DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci; USE campus_parttime; SOURCE /path/to/campus_parttime.sql;导入完成后检查一下user表里有没有初始账号。通常会有三个测试账号学生、企业、管理员各一个密码一般是 MD5 加密后的123456。如果没找到可以自己插一条但要注意密码字段的加密方式项目里用的是DigestUtils.md5DigestAsHex你可以在测试类里生成一个。接下来改application.yml里的数据库密码然后启动后端。用 IDEA 的话直接跑Application主类用命令行的话# 在项目根目录执行 mvn clean package -DskipTests java -jar target/campus-parttime-0.0.1-SNAPSHOT.jar启动成功后控制台会打印 Tomcat 端口和 Swagger 地址。我一般先访问http://localhost:8081/swagger-ui.html看看接口文档能不能出来能出来说明后端基本正常。如果报 404检查一下 Swagger 配置类有没有被扫描到或者 Spring Boot 版本和 Swagger 版本是否兼容。3.2 前端依赖安装与代理配置前端跑起来更简单但 node-sass 这个老依赖经常翻车。如果你用的是 Node 16 以上版本npm install大概率会卡在 node-sass 编译上。我的做法是换用sassdart-sass或者直接降 Node 版本到 14。# 进入前端目录 cd campus-parttime-frontend # 安装依赖建议用淘宝源 npm install --registryhttps://registry.npmmirror.com # 启动开发服务器 npm run serve启动前记得改vue.config.js里的代理配置把/api转发到后端端口// vue.config.js module.exports { devServer: { port: 8080, proxy: { /api: { target: http://localhost:8081, changeOrigin: true, pathRewrite: { ^/api: } } } } }pathRewrite的作用是去掉请求路径里的/api前缀因为后端接口本身没有这个前缀。如果你后端加了server.servlet.context-path这里也要对应调整。3.3 核心接口联调与参数验证前后端都起来后用测试账号登录打开浏览器开发者工具看 Network 面板。登录接口一般是POST /user/login请求体是 JSON{ username: student001, password: 123456, role: student }返回结果里会带token和role前端拿到后存localStorage后续请求在 header 里带Authorization: Bearer token。如果登录成功但后续接口报 401检查一下拦截器有没有把 token 加进去或者 JWT 工具类里的密钥和过期时间是否一致。我习惯用 Postman 单独测几个核心接口比如岗位列表GET /job/page?current1size10投递简历POST /delivery/add。测的时候注意参数类型current和size是整型jobId和studentId也是整型传字符串会报参数绑定异常。这种小问题在联调阶段特别常见看控制台报错信息就能定位。注意如果跨域配置没生效浏览器会报 CORS 错误。检查CorsConfig类里有没有放行所有来源和方法或者前端代理有没有配错。4. 避坑指南这套源码我踩过的五个坑4.1 坑一MyBatis-Plus 分页插件没生效查出来还是全量数据现象调用分页接口返回的total是对的但records里是全部数据没有按页截取。原因MyBatis-Plus 的分页功能依赖PaginationInnerInterceptor拦截器如果配置类里只加了MapperScan没注册这个拦截器分页 SQL 就不会被改写。解决在配置类里显式注册拦截器。Configuration public class MybatisPlusConfig { Bean public MybatisPlusInterceptor mybatisPlusInterceptor() { MybatisPlusInterceptor interceptor new MybatisPlusInterceptor(); interceptor.addInnerInterceptor(new PaginationInnerInterceptor(DbType.MYSQL)); return interceptor; } }加完之后重启后端再调分页接口records就正常了。4.2 坑二JWT 令牌过期后前端没跳转登录页现象token 过期后接口返回 401但前端页面没反应用户以为还能操作实际数据没保存。原因axios 响应拦截器里只处理了业务错误码没处理 HTTP 401 状态码。解决在响应拦截器里加一段逻辑遇到 401 就清空本地存储并跳转登录页。// request.js 响应拦截器 service.interceptors.response.use( response response.data, error { if (error.response error.response.status 401) { localStorage.clear() router.push(/login) } return Promise.reject(error) } )这里要注意router需要提前引入否则会报未定义。4.3 坑三文件上传路径写死换台机器就失效现象企业上传营业执照、学生上传简历本地测试正常部署到另一台电脑后图片打不开。原因上传路径写成了绝对路径比如D:/upload/换机器后这个目录不存在。解决改成相对路径或可配置路径在application.yml里定义file.upload-path代码里用Value注入。同时配置静态资源映射让上传的文件能通过 URL 访问。Configuration public class WebMvcConfig implements WebMvcConfigurer { Value(${file.upload-path}) private String uploadPath; Override public void addResourceHandlers(ResourceHandlerRegistry registry) { registry.addResourceHandler(/upload/**) .addResourceLocations(file: uploadPath); } }4.4 坑四Vue 路由模式用 history刷新页面 404现象开发环境正常打包部署到 Nginx 后刷新非首页路由直接 404。原因Vue Router 默认 hash 模式没问题但项目里改成了 history 模式服务器没做 fallback 配置。解决要么改回 hash 模式要么在 Nginx 里加try_files配置。location / { try_files $uri $uri/ /index.html; }我一般建议毕业设计项目直接用 hash 模式省去服务器配置的麻烦虽然 URL 里带#不太好看但稳定。4.5 坑五数据库字段类型不匹配插入中文报错现象企业发布岗位时岗位名称带中文插入数据库报Incorrect string value。原因建表时字符集用了latin1或者utf8不是utf8mb4。解决改表字符集和字段字符集。ALTER TABLE job CONVERT TO CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci;同时检查 JDBC 连接串里有没有加characterEncodingutf8两边都对了才不会乱码。5. 进阶技巧用 AOP 统一日志和接口耗时统计跑通之后我习惯给项目加一层 AOP 切面统计每个接口的耗时和入参出参。这个技巧在排查性能问题和定位参数错误时特别有用而且代码量不大十分钟就能加上。Aspect Component public class LogAspect { private static final Logger log LoggerFactory.getLogger(LogAspect.class); Around(execution(* com.xxx.campusparttime.controller..*(..))) public Object around(ProceedingJoinPoint point) throws Throwable { long start System.currentTimeMillis(); String method point.getSignature().toShortString(); Object[] args point.getArgs(); log.info(请求方法: {}, 入参: {}, method, Arrays.toString(args)); Object result point.proceed(); long cost System.currentTimeMillis() - start; log.info(请求方法: {}, 耗时: {}ms, 出参: {}, method, cost, result); return result; } }这段切面的逻辑很清晰在 Controller 层方法执行前后各打一条日志记录方法名、入参、出参和耗时。Around环绕通知能拿到ProceedingJoinPoint通过proceed()执行原方法。注意Arrays.toString(args)对文件上传接口不太友好会打印一堆字节数组可以加个判断跳过MultipartFile类型的参数。加完切面后控制台会输出类似这样的日志请求方法: JobController.page(..), 入参: [1, 10, null] 请求方法: JobController.page(..), 耗时: 45ms, 出参: {code:200, data:{...}}有了这个哪个接口慢、哪个接口参数传错了一眼就能看出来。我一般还会把耗时超过 500ms 的请求单独打一条 warn 日志方便后续优化。另一个实用技巧是给 JWT 工具类加一个刷新令牌的接口。原项目里 token 过期时间设的是 24 小时实际用的时候如果用户一直在操作突然过期体验很差。可以在拦截器里判断 token 剩余时间小于 30 分钟时自动签发一个新 token 放到响应头里前端拦截器检测到新 token 就替换本地的。这个逻辑不复杂但能明显提升使用体验。// JwtUtil 里加一个方法 public String refreshToken(String oldToken) { Claims claims getClaimsFromToken(oldToken); if (claims null) return null; String username claims.getSubject(); return generateToken(username, claims.get(role, String.class)); }然后在拦截器的postHandle里判断剩余时间决定是否刷新。注意刷新令牌不要改变原有 token 的过期时间逻辑只是延长会话避免安全风险。从那以后我每次拿到新项目都强制先跑一遍登录 → 核心业务 → 退出的完整流程再去看代码细节。这套校园兼职平台的源码结构不算复杂但该有的业务闭环都有拿来练手或者做毕设底子都够用。希望帮到你。本文还有配套的精品资源点击获取
简介这份资源是面向计算机专业学生与Java全栈开发学习者的校园兼职平台完整项目源码基于Spring Boot与Vue技术栈实现可作为毕业设计、课程设计或前后端分离练手项目。项目围绕学生求职与企业招聘两大场景后端负责业务逻辑、数据库交互与RESTful接口前端承担页面渲染与用户交互并引入Spring Security做认证授权、HTTPS保障传输安全覆盖需求分析、数据库设计到测试的完整流程。压缩包共1470个文件约74.88MB包含129个Java源文件、69个Vue组件、102个HTML页面、101个CSS样式及大量js、图片与依赖资源另附sql脚本、yml配置与bat启动脚本目录结构清晰便于快速部署与二次开发。目前已有448人学习下载适合希望掌握前后端分离架构、积累真实项目经验的读者参考借鉴。1. 从零到一这套校园兼职平台源码到底能跑通什么业务如果你正在找一套能直接跑起来、代码结构清晰、业务闭环完整的 Spring Boot Vue 全栈项目这套校园兼职平台的设计与实现大概率能省掉你两周的搭建时间。它不是那种只有登录注册的“空壳 Demo”而是把学生找兼职、企业发岗位、管理员审核这三条核心链路都串起来了。我拿到源码后第一件事就是跑通主流程学生端浏览岗位、投递简历、查看投递状态企业端发布岗位、筛选简历、标记录用管理端审核企业资质、下架违规岗位。整个流程走下来没有出现断链或假数据填充的情况数据库表之间的外键关联也是真实存在的。这套资源适合谁第一类是做毕业设计的学生尤其是选题落在“校园服务”“兼职招聘”“信息管理”方向的可以直接拿来做基础框架改改 UI 和业务字段就能变成自己的东西。第二类是想学前后端分离实战的开发者项目里 JWT 鉴权、分页查询、文件上传、角色权限控制这些常见场景都有落地代码比看文档敲示例更贴近真实项目。第三类是小团队接私活时需要一个快速起步的模板省去从零搭权限和基础 CRUD 的时间。需要提前说明的是这套代码用的是 Spring Boot 2.x Vue 2 Element UI 的技术栈如果你非要上 Vue 3 Vite Pinia那得自己动手迁移但后端接口层几乎不用大改。我见过太多人下载完源码解压后看到几十个文件夹就懵了不知道从哪开始。这篇笔记就按我自己的复现路径来先讲清楚项目结构和选型逻辑再一步步把前后端跑起来然后重点说几个我踩过的坑最后给一个能直接抄的接口调试技巧。你跟着走一遍至少能保证本地环境跑通至于二次开发那是跑通之后的事。2. 拆开代码包模块划分与前后端技术选型逻辑2.1 后端目录结构与分层设计解压后端代码你会看到标准的 Maven 多模块结构但别被“多模块”吓到实际上就是按职责拆成了几个包。我习惯先看pom.xml确认依赖版本再顺着controller→service→mapper的调用链摸一遍。这套项目的后端分层很规矩没有把业务逻辑写在 Controller 里也没有在 Service 里直接拼 SQL。!-- pom.xml 关键依赖节选 -- dependency groupIdorg.springframework.boot/groupId artifactIdspring-boot-starter-web/artifactId /dependency dependency groupIdcom.baomidou/groupId artifactIdmybatis-plus-boot-starter/artifactId version3.4.3/version /dependency dependency groupIdio.jsonwebtoken/groupId artifactIdjjwt/artifactId version0.9.1/version /dependency上面这三个依赖基本决定了后端的骨架Web 层用 Spring MVC持久层用 MyBatis-Plus 简化单表 CRUD鉴权用 JWT 做无状态令牌。MyBatis-Plus 的BaseMapper和IService能省掉大量重复代码但要注意复杂联表查询还是得自己写 XML 或注解 SQL别指望它全自动。包结构大致是这样的com.xxx.campusparttime.controller对外接口负责参数校验和响应封装com.xxx.campusparttime.service业务逻辑事务注解加在这一层com.xxx.campusparttime.mapper数据访问接口继承 MyBatis-Plus 的 BaseMappercom.xxx.campusparttime.entity数据库实体类字段与表一一对应com.xxx.campusparttime.config跨域配置、拦截器注册、Swagger 配置com.xxx.campusparttime.utilsJWT 工具类、统一返回结果封装、文件上传工具我一般会先打开application.yml看数据库连接和端口配置这是跑起来的第一道门槛。server: port: 8081 spring: datasource: url: jdbc:mysql://localhost:3306/campus_parttime?useUnicodetruecharacterEncodingutf8serverTimezoneAsia/Shanghai username: root password: 你的密码 driver-class-name: com.mysql.cj.jdbc.Driver mybatis-plus: mapper-locations: classpath:mapper/*.xml configuration: map-underscore-to-camel-case: true这里有个细节serverTimezoneAsia/Shanghai必须加否则 MySQL 8 会报时区错误。map-underscore-to-camel-case开启后数据库的create_time会自动映射到实体的createTime省去手动写 ResultMap。2.2 前端工程结构与路由权限控制前端是 Vue 2 Element UI 的组合用 vue-cli 搭建目录结构比较传统。src/views下按角色分了student、company、admin三个文件夹每个文件夹里是对应的页面组件。src/router/index.js里定义了路由表并通过meta.role字段标记哪些角色可以访问。// router/index.js 路由守卫节选 router.beforeEach((to, from, next) { const token localStorage.getItem(token) const role localStorage.getItem(role) if (to.meta.requireAuth !token) { next(/login) } else if (to.meta.role to.meta.role ! role) { next(/403) } else { next() } })这段守卫逻辑很直白没 token 就踢回登录页角色不匹配就跳 403。但实际用的时候要注意localStorage里的role是登录成功后写进去的如果用户手动改了role值前端路由能绕过但后端接口层还有一层 JWT 解析和角色校验所以不会造成越权操作。这也是前后端分离项目的基本安全底线前端路由控制体验后端接口控制安全。src/api目录下按模块封装了 axios 请求每个请求都带了拦截器统一处理 token 和错误提示。我建议你先看src/utils/request.js里面配置了 baseURL 和请求/响应拦截器改后端端口的时候只改这一个文件就行。2.3 数据库表关系与核心字段说明数据库是整个项目的基石表关系没理清后面写业务就是瞎猜。这套项目一共 8 张核心表我挑几个关键的说明表名作用关键字段user统一用户表id, username, password, role, statusstudent_info学生扩展信息user_id, real_name, school, major, resume_urlcompany_info企业扩展信息user_id, company_name, license_url, audit_statusjob兼职岗位id, company_id, title, salary, work_time, statusdelivery投递记录id, job_id, student_id, status, create_timeaudit_log审核日志id, target_type, target_id, admin_id, resultuser表用role字段区分学生、企业、管理员登录时根据角色返回不同的前端路由。delivery表的status字段控制投递状态流转0 待查看、1 已查看、2 邀请面试、3 已录用、4 已拒绝。这个状态机在 Service 层有对应的枚举类改业务的时候别直接写数字用枚举更稳妥。提示导入 SQL 文件时先建库再导表字符集选utf8mb4否则企业名称里的特殊符号会乱码。3. 本地跑通实战从数据库初始化到前后端联调3.1 数据库初始化与后端启动第一步永远是数据库。源码包里一般会带一个sql文件夹里面是建表语句和初始数据。我习惯用 Navicat 或者命令行导入命令行更快# 登录 MySQL 并创建数据库 mysql -u root -p CREATE DATABASE campus_parttime DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci; USE campus_parttime; SOURCE /path/to/campus_parttime.sql;导入完成后检查一下user表里有没有初始账号。通常会有三个测试账号学生、企业、管理员各一个密码一般是 MD5 加密后的123456。如果没找到可以自己插一条但要注意密码字段的加密方式项目里用的是DigestUtils.md5DigestAsHex你可以在测试类里生成一个。接下来改application.yml里的数据库密码然后启动后端。用 IDEA 的话直接跑Application主类用命令行的话# 在项目根目录执行 mvn clean package -DskipTests java -jar target/campus-parttime-0.0.1-SNAPSHOT.jar启动成功后控制台会打印 Tomcat 端口和 Swagger 地址。我一般先访问http://localhost:8081/swagger-ui.html看看接口文档能不能出来能出来说明后端基本正常。如果报 404检查一下 Swagger 配置类有没有被扫描到或者 Spring Boot 版本和 Swagger 版本是否兼容。3.2 前端依赖安装与代理配置前端跑起来更简单但 node-sass 这个老依赖经常翻车。如果你用的是 Node 16 以上版本npm install大概率会卡在 node-sass 编译上。我的做法是换用sassdart-sass或者直接降 Node 版本到 14。# 进入前端目录 cd campus-parttime-frontend # 安装依赖建议用淘宝源 npm install --registryhttps://registry.npmmirror.com # 启动开发服务器 npm run serve启动前记得改vue.config.js里的代理配置把/api转发到后端端口// vue.config.js module.exports { devServer: { port: 8080, proxy: { /api: { target: http://localhost:8081, changeOrigin: true, pathRewrite: { ^/api: } } } } }pathRewrite的作用是去掉请求路径里的/api前缀因为后端接口本身没有这个前缀。如果你后端加了server.servlet.context-path这里也要对应调整。3.3 核心接口联调与参数验证前后端都起来后用测试账号登录打开浏览器开发者工具看 Network 面板。登录接口一般是POST /user/login请求体是 JSON{ username: student001, password: 123456, role: student }返回结果里会带token和role前端拿到后存localStorage后续请求在 header 里带Authorization: Bearer token。如果登录成功但后续接口报 401检查一下拦截器有没有把 token 加进去或者 JWT 工具类里的密钥和过期时间是否一致。我习惯用 Postman 单独测几个核心接口比如岗位列表GET /job/page?current1size10投递简历POST /delivery/add。测的时候注意参数类型current和size是整型jobId和studentId也是整型传字符串会报参数绑定异常。这种小问题在联调阶段特别常见看控制台报错信息就能定位。注意如果跨域配置没生效浏览器会报 CORS 错误。检查CorsConfig类里有没有放行所有来源和方法或者前端代理有没有配错。4. 避坑指南这套源码我踩过的五个坑4.1 坑一MyBatis-Plus 分页插件没生效查出来还是全量数据现象调用分页接口返回的total是对的但records里是全部数据没有按页截取。原因MyBatis-Plus 的分页功能依赖PaginationInnerInterceptor拦截器如果配置类里只加了MapperScan没注册这个拦截器分页 SQL 就不会被改写。解决在配置类里显式注册拦截器。Configuration public class MybatisPlusConfig { Bean public MybatisPlusInterceptor mybatisPlusInterceptor() { MybatisPlusInterceptor interceptor new MybatisPlusInterceptor(); interceptor.addInnerInterceptor(new PaginationInnerInterceptor(DbType.MYSQL)); return interceptor; } }加完之后重启后端再调分页接口records就正常了。4.2 坑二JWT 令牌过期后前端没跳转登录页现象token 过期后接口返回 401但前端页面没反应用户以为还能操作实际数据没保存。原因axios 响应拦截器里只处理了业务错误码没处理 HTTP 401 状态码。解决在响应拦截器里加一段逻辑遇到 401 就清空本地存储并跳转登录页。// request.js 响应拦截器 service.interceptors.response.use( response response.data, error { if (error.response error.response.status 401) { localStorage.clear() router.push(/login) } return Promise.reject(error) } )这里要注意router需要提前引入否则会报未定义。4.3 坑三文件上传路径写死换台机器就失效现象企业上传营业执照、学生上传简历本地测试正常部署到另一台电脑后图片打不开。原因上传路径写成了绝对路径比如D:/upload/换机器后这个目录不存在。解决改成相对路径或可配置路径在application.yml里定义file.upload-path代码里用Value注入。同时配置静态资源映射让上传的文件能通过 URL 访问。Configuration public class WebMvcConfig implements WebMvcConfigurer { Value(${file.upload-path}) private String uploadPath; Override public void addResourceHandlers(ResourceHandlerRegistry registry) { registry.addResourceHandler(/upload/**) .addResourceLocations(file: uploadPath); } }4.4 坑四Vue 路由模式用 history刷新页面 404现象开发环境正常打包部署到 Nginx 后刷新非首页路由直接 404。原因Vue Router 默认 hash 模式没问题但项目里改成了 history 模式服务器没做 fallback 配置。解决要么改回 hash 模式要么在 Nginx 里加try_files配置。location / { try_files $uri $uri/ /index.html; }我一般建议毕业设计项目直接用 hash 模式省去服务器配置的麻烦虽然 URL 里带#不太好看但稳定。4.5 坑五数据库字段类型不匹配插入中文报错现象企业发布岗位时岗位名称带中文插入数据库报Incorrect string value。原因建表时字符集用了latin1或者utf8不是utf8mb4。解决改表字符集和字段字符集。ALTER TABLE job CONVERT TO CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci;同时检查 JDBC 连接串里有没有加characterEncodingutf8两边都对了才不会乱码。5. 进阶技巧用 AOP 统一日志和接口耗时统计跑通之后我习惯给项目加一层 AOP 切面统计每个接口的耗时和入参出参。这个技巧在排查性能问题和定位参数错误时特别有用而且代码量不大十分钟就能加上。Aspect Component public class LogAspect { private static final Logger log LoggerFactory.getLogger(LogAspect.class); Around(execution(* com.xxx.campusparttime.controller..*(..))) public Object around(ProceedingJoinPoint point) throws Throwable { long start System.currentTimeMillis(); String method point.getSignature().toShortString(); Object[] args point.getArgs(); log.info(请求方法: {}, 入参: {}, method, Arrays.toString(args)); Object result point.proceed(); long cost System.currentTimeMillis() - start; log.info(请求方法: {}, 耗时: {}ms, 出参: {}, method, cost, result); return result; } }这段切面的逻辑很清晰在 Controller 层方法执行前后各打一条日志记录方法名、入参、出参和耗时。Around环绕通知能拿到ProceedingJoinPoint通过proceed()执行原方法。注意Arrays.toString(args)对文件上传接口不太友好会打印一堆字节数组可以加个判断跳过MultipartFile类型的参数。加完切面后控制台会输出类似这样的日志请求方法: JobController.page(..), 入参: [1, 10, null] 请求方法: JobController.page(..), 耗时: 45ms, 出参: {code:200, data:{...}}有了这个哪个接口慢、哪个接口参数传错了一眼就能看出来。我一般还会把耗时超过 500ms 的请求单独打一条 warn 日志方便后续优化。另一个实用技巧是给 JWT 工具类加一个刷新令牌的接口。原项目里 token 过期时间设的是 24 小时实际用的时候如果用户一直在操作突然过期体验很差。可以在拦截器里判断 token 剩余时间小于 30 分钟时自动签发一个新 token 放到响应头里前端拦截器检测到新 token 就替换本地的。这个逻辑不复杂但能明显提升使用体验。// JwtUtil 里加一个方法 public String refreshToken(String oldToken) { Claims claims getClaimsFromToken(oldToken); if (claims null) return null; String username claims.getSubject(); return generateToken(username, claims.get(role, String.class)); }然后在拦截器的postHandle里判断剩余时间决定是否刷新。注意刷新令牌不要改变原有 token 的过期时间逻辑只是延长会话避免安全风险。从那以后我每次拿到新项目都强制先跑一遍登录 → 核心业务 → 退出的完整流程再去看代码细节。这套校园兼职平台的源码结构不算复杂但该有的业务闭环都有拿来练手或者做毕设底子都够用。希望帮到你。本文还有配套的精品资源点击获取
