1. 为什么用这套技术栈做校园便利平台选型逻辑拆解1.1 从需求倒推选型毕业设计最怕的不是技术难而是给自己挖坑做校园便利平台这类毕业设计最核心的问题不是“哪个框架更牛”而是“我能不能在答辩前把它完整交付”。我和不少同学聊过有些人一上来就选微服务、中间件队列、分布式锁结果数据库都没理清楚最后代码有几十个报错部署文档写得像天书。我的建议是用自己最有把握的技术把核心功能做扎实比堆砌花哨但跑不顺的技术更能拿高分。校园便利平台的典型场景无非是这几块用户注册登录学生、管理员两种角色商品信息的发布、浏览、搜索、分类筛选下单流程加购物车、提交订单、卖家确认、完成交易个人中心我发布的商品、我买到的、我卖出的、订单状态变化后台管理用户管理、商品审核、分类管理、基础统计。这套业务用单体应用完全够。SpringBoot 负责提供接口Vue 负责页面交互MySQL 负责数据落地三个各司其职逻辑清晰答辩时也容易讲明白。更重要的是这套组合的资料多、问题解法成熟遇到坑基本搜一下就有答案不会卡死你。1.2 开发环境与版本搭配先把地基铺稳了再动手我见过太多项目死在一开始的版本兼容问题上。这里给出一套我实测下来很稳的组合直接照着配就行组件推荐版本说明JDK1.8 或 111.8 最稳11 也兼容别贪新上 17 给自己找麻烦Maven3.6.3管理后端依赖SpringBoot2.7.x2.7 生态成熟和 MyBatis Plus、JWT 等集成案例最多MySQL5.7 或 8.05.7 保守8.0 也无妨注意驱动和时区配置Vue2.x 或 3.x看你自己熟悉度Vue3 Vite 更现代Vue2 Vue CLI 资料更多Node.js14运行前端构建工具链这里有个很关键的细节SpringBoot 2.7 对应的是javax.*包名SpringBoot 3.x 对应的是jakarta.*包名。如果你在参考别人的代码发现包名对不上很可能就是这个原因。对于毕业设计我会直接锁定 SpringBoot 2.7.x因为很多现成的 JWT 工具类、拦截器示例都是基于这个版本写的抄起来不容易翻车。1.3 项目目录规划别等代码写到一半才后悔很多同学建项目的时候很随意所有 Controller 堆在一个包Service 写成“面条代码”到后期改一个需求拉一个文件都要找半天。我的习惯是在一开始就定好包结构哪怕是简单的单体项目也要脉络清楚com.example.campusplatform ├── config // 配置类CORS、拦截器注册、WebMvcConfig ├── controller // 接口层只做参数接收和结果封装 ├── service // 业务层事务、业务判断都在这里 ├── mapper // 数据访问层与 MyBatis 接口对应 ├── entity // 数据库实体 ├── dto // 前端传参和后端返回的数据对象避免实体直接暴露 ├── common // 通用返回结果、状态码、异常处理 ├── utils // 工具类JWT 生成解析、文件上传等 └── interceptor // 登录拦截、权限校验前端目录也建议在动手前就拆好src ├── api // 所有接口请求封装 ├── router // 路由配置 ├── store // 全局状态登录用户信息、购物车等 ├── views // 页面组件 ├── components // 复用组件商品卡片、分页、弹窗等 ├── utils // 请求封装 axios 实例、工具函数 └── assets // 静态资源你可以在论文里专门用一节画这个“系统架构图”和“功能模块图”答辩老师看到的时候会觉得你是真做过设计的不是随便拼的。2. 数据库设计与核心表结构业务闭环的地基2.1 用户、商品、订单三大核心表的字段取舍数据库设计是这套项目里最不能省的部分。校园便利平台的核心业务实体至少有用户表、商品表、订单表、订单明细表、分类表、评论/留言表、收藏表。下面挑几个重点表说说我的设计思路。用户表user字段类型说明idbigint主键自增usernamevarchar(50)登录名唯一索引passwordvarchar(255)存加密后的密码不是明文nicknamevarchar(50)显示昵称avatarvarchar(255)头像地址phonevarchar(20)联系电话roletinyint0表示普通用户1表示管理员statustinyint0禁用1正常create_timedatetime注册时间商品表goods字段类型说明idbigint主键titlevarchar(100)商品标题descriptiontext商品描述pricedecimal(10,2)价格我用 Decimal 不用 float避免金额精度问题original_pricedecimal(10,2)原价可选cover_imagevarchar(255)封面图路径imagesvarchar(1000)多图路径用逗号分隔category_idint分类 IDseller_idbigint发布者 IDstatustinyint状态机字段见下面说明view_countint浏览数create_timedatetime发布时间订单表orders字段类型说明idbigint主键order_novarchar(32)订单号业务上要唯一goods_idbigint商品 IDbuyer_idbigint买家 IDseller_idbigint卖家 ID注意这个字段要冗余一份pricedecimal(10,2)成交价格quantityint数量statustinyint0待付款/1待发货/2已发货/3已完成/4已取消create_timedatetime下单时间update_timedatetime状态更新时间为什么要强调“订单表冗余 seller_id”因为如果订单只关联 goods_id那么查询“我卖出的订单”时每次都要 join 商品表拿到卖家 ID查询效率低代码也啰嗦。在做数据库设计时适度冗余能换来查询简单和性能这在答辩时是能讲出道理的。2.2 外键与状态机的平衡让数据变动可控又不被绊住关于外键我的实际经验是代码层面控制逻辑数据库层面尽量不加物理外键。很多同学喜欢在 MySQL 里加上CONSTRAINT FOREIGN KEY看起来严谨但实际操作时经常出问题比如你要删除分类时发现被商品表引用还要先去改商品数据。毕业设计阶段最怕的就是这种“改动一点就牵一发动全身”的麻烦。不加物理外键不代表不做约束而是靠后端 Service 层来保证数据一致。比如删除分类时我先检查该分类下有没有商品有就提示“请先处理该分类下的商品”再决定是直接拒绝还是把商品置为“已下架”。这个逻辑写在代码里比数据库自动报错要友好得多。商品订单状态的变化也要用状态机思维来管理不要随意跳状态。我通常会定义一套状态枚举并在 Service 里写清楚各个状态的流转规则用户发布商品状态为“在售”有人下单后商品状态不能继续被其他人购买买家确认完成或者超时自动完成订单结束“已完成”的订单可以互相评价有违规情况管理员可强制下架。2.3 初始化 SQL 的准备一份脚本要能一键跑通数据库脚本不是“自己本地能跑就行”而是要给别人也能顺畅导入。我在写项目的init.sql时会做三件事在所有表前面加DROP TABLE IF EXISTS这样重复导入不报错建完表后插入必要的初始数据包括管理员账号、默认分类注释每一张表的用途方便答辩老师看脚本。管理员账号的密码建议用 BCrypt 加密后插入不要直接在 SQL 里写明文。很多在线工具可以生成 BCrypt 哈希生成后粘到 insert 语句里即可。你可以在答辩时说“密码不是明文存储而是使用 Spring Security 的 BCryptPasswordEncoder 加密后入库”这是一个加分项。3. 后端服务端实现细节权限、鉴权与业务闭环3.1 JWT 登录态与拦截器的组合实践校园平台的接口不能人人都能调用比如“发布商品”“修改订单”必须登录后才行“管理用户”只能管理员操作。我用的方案是 JWT 拦截器。原理很简单用户登录成功后后端用签名生成一个 token 返回给前端前端把 token 存在本地localStorage 或 Pinia之后每次请求在请求头带上Authorization: Bearer token。后端拦截器在请求进入 Controller 前校验 token校验通过就把用户信息放入请求上下文里。下面是拦截器里做校验的核心逻辑用到了一个我在项目里常用的UserHolder工具类ThreadLocal 保存当前登录用户避免到处传参public class LoginInterceptor implements HandlerInterceptor { Override public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception { // 放行预检请求 if (OPTIONS.equalsIgnoreCase(request.getMethod())) { return true; } String token request.getHeader(Authorization); if (token ! null token.startsWith(Bearer )) { token token.substring(7); try { Claims claims JwtUtil.parseToken(token); // 解析出用户ID后放入ThreadLocal Long userId Long.parseLong(claims.get(userId).toString()); Integer role (Integer) claims.get(role); UserHolder.set(userId, role); return true; } catch (Exception e) { // token无效继续走下面的拒绝逻辑 } } response.setStatus(401); response.setContentType(application/json;charsetutf-8); response.getWriter().write({\code\:401,\msg\:\未登录或登录已过期\}); return false; } }管理员接口的鉴权我是在拦截器基础上加一层判断的因为有些接口只允许管理员访问比如后台用户列表、商品强制下架。一个比较优雅的做法是自定义一个RequireRole注解在 Controller 方法上标注然后拦截器根据注解值判断。这样代码看着专业答辩也有内容讲。3.2 商品发布与订单状态流转的接口设计商品发布接口看起来简单其实有一些隐藏细节。前端传给后端的不是简单的表单字段还包含图片路径列表、分类 ID、价格等。后端收到后要做几件事必填字段校验title、price、categoryId 不能为空价格合法性校验必须大于0设置初始状态默认“在售”把多图路径从 List 转成逗号分隔字符串存入数据库。订单提交接口则需要加事务控制这是重点。用户提交订单时系统要做的是先检查商品是否存在且状态为“在售”然后检查不能是自己买的商品接着创建订单最后把商品状态改成“已下单”。这里特别容易漏的是并发问题如果两个用户同时抢同一件商品两个请求都先读到“在售”都创建了订单商品就被卖出去了两次。虽然毕业设计通常不会真的压测但你在论文里可以写“通过数据库行锁防止超卖”一开始就在代码里加上Override Transactional public OrderVO createOrder(Long goodsId, Long buyerId) { // 使用悲观锁查询时把商品行锁住 Goods goods goodsMapper.selectByIdWithLock(goodsId); if (goods null || goods.getStatus() ! GoodsStatus.ON_SALE) { throw new BusinessException(商品不存在或已下架); } if (goods.getSellerId().equals(buyerId)) { throw new BusinessException(不能购买自己发布的商品); } // ... 创建订单更新商品状态等逻辑 }对应的 Mapper 里这样写select idselectByIdWithLock resultTypecom.example.campusplatform.entity.Goods select * from goods where id #{id} for update /selectselect ... for update就是把这一行锁住等事务提交后其他请求才能读到数据。这个设计在答辩时是很有说服力的亮点建议大家在写到这块时认真体会一下。3.3 上传文件路径的底层坑别把图片存进数据库商品图片上传是校园平台的刚需。我的建议是图片文件存磁盘数据库只存访问路径。上传接口接收 MultipartFile 后生成一个新的文件名避免同名覆盖写到服务器某个目录下比如/www/uploads/goods/然后把对应的访问路径返回给前端。前端拿到路径拼在 baseUrl 后面就能访问图片。要注意几个容易踩的坑文件名一定要重写不要用用户原始文件名。否则两个用户都传个1.jpg后传的会把前面的覆盖掉。我习惯用 UUID 时间戳组合命名。校验文件类型前端虽然做了限制后端也要校验扩展名和大小防止有人直接调接口传超大文件或恶意脚本文件。配置虚拟路径映射SpringBoot 默认只映射classpath:/static/下的静态资源外部磁盘的目录不会自动可访问。需要加一个 WebMvcConfigurer把磁盘路径映射成 URL 路径Configuration public class WebMvcConfig implements WebMvcConfigurer { Override public void addResourceHandlers(ResourceHandlerRegistry registry) { // 访问 /uploads/** 时去 /www/uploads/ 这个磁盘目录找文件 registry.addResourceHandler(/uploads/**) .addResourceLocations(file:/www/uploads/); } }不然辛辛苦苦传上去的图片一刷新就 404页面上一堆破图答辩演示的时候特别尴尬。4. Vue 前端开发要点状态管理与页面解耦4.1 路由守卫加登录态的完整链路前端我用 Vue 的 Router 来做页面跳转控制。校园便利平台需要区分“游客可访问”和“登录后可用”的页面。比如浏览商品列表是公开的但“发布商品”“个人中心”“购物车结算”必须登录。实现思路给需要登录的路由加一个meta: { requiresAuth: true }标记然后在全局前置守卫里检查router.beforeEach((to, from, next) { const token localStorage.getItem(token) if (to.meta.requiresAuth !token) { // 没登录就跳去登录页同时记录下是从哪来的 next({ path: /login, query: { redirect: to.fullPath } }) } else { next() } })登录成功后前端把 token 存在 localStorage同时把用户信息存入全局状态管理里。这里存的用户信息不能是从 token 里解出来的因为 token 过期后信息不准正确做法是登录接口里后端会返回用户基本信息前端存这份数据。4.2 借助 Pinia/Vuex 管理用户与购物车状态如果你的前端是 Vue3我建议用 Pinia如果是 Vue2就继续用 Vuex。核心思路是一样的把“当前用户信息”“购物车商品列表”“待处理订单数量”这种多处页面都要用到的数据放进全局 store而不是在组件里通过 props 一层层传。以购物车为例我通常定义这样一个 store// stores/cart.js (以 Pinia 为例) import { defineStore } from pinia export const useCartStore defineStore(cart, { state: () ({ items: [], // 购物车中的商品 }), getters: { totalPrice() { return this.items.reduce((sum, item) sum item.price * item.quantity, 0) }, totalCount() { return this.items.reduce((sum, item) sum item.quantity, 0) } }, actions: { addItem(goods) { const existing this.items.find(item item.goodsId goods.id) if (existing) { existing.quantity } else { this.items.push({ goodsId: goods.id, title: goods.title, price: goods.price, quantity: 1 }) } }, clear() { this.items [] } } })这样在商品详情页点击“加入购物车”调用cartStore.addItem(goods)在导航栏显示购物车数量直接读cartStore.totalCount。组件之间完全解耦改起来很舒服。4.3 用户界面的破局点从原型到可用很多做毕业设计的同学都栽在“前端不知道怎么搭页面”上。我的建议是不要一开始就想着做得华丽先把所有页面的骨架用最简单的卡片列表搭出来再去调样式。校园便利平台的典型页面清单首页商品卡片瀑布流、分类筛选栏、搜索框商品详情页图片轮播、价格、描述、卖家信息、立即购买/加购物车按钮发布商品页表单 图片上传个人中心我的发布、我的买/卖订单、个人资料编辑后台管理用户列表、商品列表、分类管理、数据看板。页面布局我用的是 Element PlusVue3 版本或 Element UIVue2 版本因为里面已经有现成的表格、表单、分页、弹窗、上传组件直接复制示例改数据源就行比自己手写一个分页组件靠谱多了。有一个细节不要把接口请求乱塞进组件里。我在src/api/下为每个模块建一个文件类似// src/api/goods.js import request from /utils/request export function getGoodsList(params) { return request({ url: /goods/list, method: get, params }) } export function publishGoods(data) { return request({ url: /goods/publish, method: post, data }) }这样后期接口有变动只改一个文件所有页面自动生效。答辩时老师问“你觉得你的项目结构怎么样”你就可以拿着这个目录结构讲比空口说自己“代码很规范”有说服力得多。5. 本地到线上的部署从零到可运行的完整链路5.1 打包前端、后端与数据库导出毕业设计交付往往包含两个层面一是源码包二是可演示的在线地址或者本机可运行环境。无论是哪个你都得会打包。后端打包在项目根目录运行mvn clean package -DskipTests成功后target/目录下会生成一个.jar文件。如果用了多环境配置可以这样指定生产环境变量java -jar campus-platform.jar --spring.profiles.activeprod前端打包在src目录下执行npm run build几分钟后dist/目录就是构建好的静态文件里面是 html、css、js 等资源。数据库导出我推荐用 Navicat 或命令行mysqldump导出为.sql文件。注意导出时包含数据而不仅仅是结构这样部署到服务器上导入之后才有一批现成数据方便演示。导入 MySQL 的命令mysql -u root -p campus_platform init.sql5.2 Nginx 静态部署与反向代理配置前端和后端都打包好之后服务器上最常用的部署方式就是 Nginx 托管前端静态文件反代后端接口。Nginx 配置我通常会写成这样server { listen 80; server_name yourdomain.com; # 前端静态资源 location / { root /var/www/campus-platform/dist; index index.html; # Vue 是单页应用刷新路由时要回退到 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; } # 图片访问路径 location /uploads/ { alias /www/uploads/; } }这里最容易被忽略的是try_files $uri $uri/ /index.html;。如果不加前端用 Vue Router 的 history 模式时刷新一个/goods/detail/1页面会 404因为服务器去找这个路径下的文件找不到。加上这行所有不存在的路径都会回到index.html由前端路由接管。后端的跨域问题如果在本地开发时已通过 CORS 配置解决那么在部署阶段走 Nginx 反代后前端访问的是同源/api/**反而不存在跨域了。这也是我推荐 Nginx 反代而不是直接把前后端分成两个端口访问的原因。5.3 部署文档必写的几项核心内容很多人的部署文档就是简单写“安装 JDK、安装 MySQL、运行 jar 包”太简略。一份能让别人照着做就成功的部署文档至少应该包含这几部分环境要求列出操作系统、JDK、MySQL、Node 的具体版本避免读者装了新版结果不兼容数据库初始化创建数据库的命令、导入 SQL 的方式、初始账号密码后端配置修改application.yml里数据库连接地址、用户名密码、上传目录路径前端构建安装依赖、打包命令、dist 目录说明Nginx 配置示例直接把可用配置贴出来并解释每段的作用常见问题排查比如端口被占用、数据库连不上、图片 404 等项目目录结构说明让二开的人知道从哪下手。写文档这件事本身答辩老师是很看重的。因为毕业设计考察的不只是编码还有工程化交付能力。一份用心写的部署文档能让你在答辩时省很多力气。6. 实战中的坑与经验答辩前的自我检查清单6.1 高频问题点时区、跨域、文件路径我在辅导和评审毕业设计时反复看到以下几类问题你可以对照检查自己的项目数据库时区问题。SpringBoot 2.x 连接 MySQL 8.0 时如果连接串不指定时区启动可能直接报错。解决方案是在application.yml的 JDBC URL 中加上url: jdbc:mysql://localhost:3306/campus_platform?useUnicodetruecharacterEncodingutf8serverTimezoneAsia/Shanghai之前我遇到过同事把serverTimezone漏掉前端传过来的时间在库里差了 8 个小时排查了半天才发现是时区配置问题。前端跨域问题。本地开发时前端在localhost:5173后端在localhost:8080两个端口不同就是跨域。处理办法在后端加一个全局 CORS 配置类或者用前端 Vite 的 proxy 代理。不要只设置响应头里的Access-Control-Allow-Origin: *因为如果接口请求头带了 token浏览器发的是 OPTIONS 预检请求后端的拦截器必须先放行 OPTIONS否则报跨域错误。上面拦截器代码里我先判断了OPTIONS方法就返回 true就是为了避免这个问题。图片上传后访问不到的路径问题。前面已经提到磁盘路径映射这里再补充一个要注意的点不同操作系统路径写法不同。Windows 下是file:D:/upload/Linux 下是file:/www/uploads/。部署文档里要明确告诉使用者修改哪个配置项。6.2 演示过程中的常见翻车点毕业答辩现场演示通常是用自己的笔记本或者服务器我总结了几个高频翻车场景提前做个预防数据库忘记启动或密码错误提前把 MySQL 服务设为开机自启并反复验证从命令行能连接成功后端启动时报端口占用可以用lsof -i:8080查看是谁占用了端口或者直接用server.port换一个端口前端刷新后 404本地开发用的是 Vite不存在这个问题但如果部署到 Nginx 后没写try_files就会出现。建议部署后完整走一遍用户流程再收工上传大图片卡死或空白前端上传组件要配置大小限制后端也要限制。缺了限制现场网速不好时图片传半天很影响节奏演示数据太干净商品列表空荡荡的看起来像没做完。建议初始化脚本里多准备 20 条真实感的商品数据和几位测试用户演示时页面才有说服力。6.3 从开发到毕业设计交付的复盘最后聊聊我对这套 SpringBootVueMySQL 校园便利平台项目的一点体会。做毕业设计最忌讳的是“到最后一刻还在写代码”。我建议把时间轴拉成三阶段前 1/3 时间把所有接口和数据库调通中间 1/3 时间补前端页面和交互最后 1/3 时间专门用于测试、写文档、录演示视频、准备答辩稿。很多项目其实功能都做完了就是因为部署文档草率、测试用例不足、演示流程没演练答辩现场才掉了链子。写论文的时候不要只堆功能截图还要把你为什么这样设计讲出来。比如“订单表为什么要冗余卖家 ID”“商品状态为什么用状态机而不是简单布尔值”“并发下单时怎么防止超卖”——这些我在上面的章节里都做了说明你在论文里能说清两三点亮点分基本就到手了。这套项目做完之后你还可以往里面加“消息通知”“收藏夹”“评论系统”甚至“学生二手书籍专区”作为创新点。不过前提是把当前的核心链路跑顺别急着扩张需求。项目不怕简单怕的是挖了很多坑填不完。保证交付质量答辩自然稳稳过关。