拓十年匠心定制 · 商业建站与技术教学双线并行 咨询热线:400-886-1026 service@lmnt.cn
ARTICLE DETAIL

资讯详情

深耕网站建设与运营推广的一线实战洞察。

微信小程序+SpringBoot竞赛管理系统毕业设计实战包

微信小程序+SpringBoot竞赛管理系统毕业设计实战包 简介本资源是一套面向计算机专业本科生的毕业设计实战项目聚焦大学生科技竞赛全流程数字化管理需求采用Spring Boot Vue 微信小程序三层架构实现适用于Java后端、前端及小程序开发初学者综合实训与毕设参考。压缩包含1338个文件77.3MB涵盖319张界面截图png、187个小程序逻辑脚本js、141个Vue组件vue、131个Spring Boot核心业务类java、90个小程序结构文件wxml及92个样式文件wxss完整支撑前后端分离开发与小程序本地调试。已有131人学习下载资源提供可直接运行的源码、MySQL建库脚本、开题报告与论文文档、JDK1.8IDEA/Eclipse环境配置指南以及含3个bat一键部署脚本install/run/build和BreadCrumbs等后台通用组件的工程结构便于快速理解模块化设计与权限分层逻辑。1. 这不是又一个“学生选课系统”微信小程序SpringBoot的科技竞赛全流程闭环真正在校生能跑通的毕业设计实战包你手头那份“基于SpringBoot的XX管理系统”毕业设计是不是部署到本地就404数据库脚本缺字段、Vue页面报Cannot find module vue-router、小程序连不上后台、管理员登录后空白页别急——这个资源不是PPT式Demo而是我去年帮三个学院本科生落地答辩的真实项目从学生扫码报名、主办方审核、成绩公示、收藏竞赛、查排名到管理员一键导出Excel报表全链路可验证。它用的是JDK 1.8 SpringBoot 2.3.12.RELEASE非3.xMySQL 5.7非8.0Vue 2.6.14非Vue3所有依赖版本锁定在pom.xml和package.json里连Eclipse的.project文件都保留着。特别适合计算机/软件工程专业学生论文结构完整含开题报告、任务书、查重稿、文档带截图级操作指引比如“如何在微信开发者工具中配置request合法域名”、甚至附了同框架项目的安装教程1-install.bat实测兼容Windows 10/11。如果你正卡在“写完代码但跑不起来”“答辩被问‘你怎么保证报名并发不超限’答不上来”这份资源就是你的后悔药。2. 从源码结构到运行逻辑拆解三层架构如何支撑“学生-主办方-管理员”三角协作2.1 后端SpringBoot模块划分为什么Controller层要拆成StudentController和CompetitionController两套路由项目采用经典分层架构但关键细节藏在包名里com.example.competition.controller.student处理学生端所有接口如/student/register注册、/student/apply/{id}报名、/student/collection收藏com.example.competition.controller.host主办方专用接口如/host/audit/{applyId}审核报名、/host/uploadScore上传成绩com.example.competition.controller.admin管理员全局接口如/admin/exportExcel?competitionId123导出报名表提示不要把所有接口塞进一个CompetitionController学生端需鉴权JWT token校验主办方端需二次身份核验检查host_id是否匹配当前竞赛管理员端需IP白名单application.yml中admin.ip-whitelist: 127.0.0.1,192.168.1.100。这种拆分让权限控制粒度更细答辩时老师问“怎么防止学生越权看其他竞赛成绩”你能直接指向PreAuthorize(hasRole(STUDENT))注解位置。核心配置在application.ymlspring: datasource: url: jdbc:mysql://localhost:3306/competition_db?useUnicodetruecharacterEncodingutf8serverTimezoneGMT%2B8 username: root password: 123456 jpa: hibernate: ddl-auto: update # 注意仅开发环境用生产环境必须设为validate show-sql: true properties: hibernate: format_sql: true # JWT密钥实际使用时需替换 jwt: secret: competition2024secretkey expiration: 86400000 # 24小时2.2 前端Vue工程结构为什么IndexAsideStatic.vue.bak比IndexAside.vue更重要你看到的.bak文件不是垃圾而是作者留下的调试快照IndexAsideStatic.vue.bak静态菜单版无动态权限过滤用于快速验证路由是否生效IndexAside.vue动态菜单版根据用户角色role请求/menu/list接口生成侧边栏真实运行流程学生登录后前端调用GET /student/menu→ 返回JSON[ {path:/student/home,name:首页,icon:el-icon-s-home}, {path:/student/apply,name:在线报名,icon:el-icon-document-add} ]IndexAside.vue通过v-for渲染菜单同时用v-ifitem.path $route.path高亮当前项若菜单为空常见于role字段存错为student而非STUDENT则回退到IndexAsideStatic.vue.bak手动启用注意BreadCrumbs.vue.bak是面包屑组件备份当this.$route.matched返回空数组时它会fallback显示“首页 竞赛管理”避免页面崩溃。2.3 微信小程序端关键实现如何绕过wx.request的HTTPS强制要求小程序要求所有wx.request必须走HTTPS但本地开发用http://localhost:8080怎么办正确做法非改小程序配置在app.js中统一设置baseURLApp({ globalData: { // 开发环境用代理生产环境换为https域名 baseUrl: http://192.168.1.100:8080, // 用本机局域网IP手机连同一WiFi即可访问 } })在utils/request.js中封装请求function request(url, data {}, method GET) { return new Promise((resolve, reject) { wx.request({ url: getApp().globalData.baseUrl url, data, method, header: { Content-Type: application/json, Authorization: wx.getStorageSync(token) || // JWT token }, success: res resolve(res.data), fail: err reject(err) }) }) }关键点192.168.1.100必须是你电脑的局域网IPipconfig查且防火墙放行8080端口。绝对不要在小程序后台配置http://localhost为合法域名——这是无效的。3. 数据库设计与业务约束为什么competition_apply表有status ENUM(PENDING,APPROVED,REJECTED)却不用外键3.1 核心表关系图文字版聚焦“报名-审核-成绩”主链路表名主键关键字段业务含义studentidopenid,real_name,school,major学生信息openid来自微信授权唯一标识competitionidtitle,start_time,end_time,host_id竞赛基本信息host_id关联host表competition_applyidstudent_id,competition_id,status,apply_time报名记录status三态控制流程competition_scoreidapply_id,score,judge_comment成绩表apply_id反向关联报名非competition_idhostidname,contact_phone,auth_status主办方信息auth_status区分“已认证/待审核”注意competition_apply表没有外键约束原因很实在——MySQL 5.7下InnoDB外键会拖慢批量插入如导入1000条报名数据且答辩演示时删库重装更方便。作者用Service层逻辑保证一致性ApplyService.apply()方法中先查student_id是否存在再查competition_id是否有效最后才INSERT。3.2 业务规则硬编码在哪报名截止时间校验的双重保险学生点击“报名”按钮时前端和后端都有校验前端校验pages/apply/apply.jsonLoad() { const now new Date().getTime() const endTime new Date(this.data.competition.end_time).getTime() if (now endTime) { wx.showToast({ title: 报名已截止, icon: none }) this.setData({ canApply: false }) } }后端校验ApplyController.javaPostMapping(/apply/{competitionId}) public Result apply(PathVariable Long competitionId, RequestBody ApplyDTO dto) { Competition competition competitionService.getById(competitionId); if (System.currentTimeMillis() competition.getEndTime().getTime()) { return Result.fail(报名已截止); } // ...后续逻辑 }为什么双校验前端可被绕过F12改JS后端是最终防线。答辩时老师若问“如何防刷单”你可以说“我们还在competition_apply表加了联合唯一索引(student_id, competition_id)同一学生对同一竞赛只能报一次”。3.3 避坑MySQL字符集与emoji存储的血泪经验现象学生昵称存入数据库后变成??微信头像URL中的/被转义成%2F导致图片加载失败原因MySQL默认字符集latin1不支持UTF-8 emoji如、❤️且URL中/在urlencoded后需原样存储解决创建数据库时指定字符集CREATE DATABASE competition_db CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;修改my.cnfWindows下my.ini[client] default-character-set utf8mb4 [mysqld] character-set-server utf8mb4 collation-server utf8mb4_unicode_ci init_connectSET NAMES utf8mb4 skip-character-set-client-handshake TRUESpringBoot中JDBC URL追加参数spring: datasource: url: jdbc:mysql://localhost:3306/competition_db?useUnicodetruecharacterEncodingutf8mb4serverTimezoneGMT%2B8allowPublicKeyRetrievaltrueuseSSLfalse提示执行完重启MySQL服务然后用SHOW VARIABLES LIKE character_set_%;确认全部为utf8mb4。否则student.nickname字段存emoji会截断答辩演示时学生头像显示异常当场翻车。4. 部署与调试全流程从1-install.bat到小程序真机测试的六步通关4.11-install.bat做了什么三分钟初始化开发环境双击1-install.batWindows实际执行echo off echo 正在初始化数据库... mysql -uroot -p123456 database/competition_db.sql echo 正在安装Maven依赖... cd backend mvn clean install -Dmaven.test.skiptrue echo 正在安装Node依赖... cd ../frontend npm install --registryhttps://registry.npm.taobao.org echo 初始化完成请运行2-run.bat启动服务 pause关键细节database/competition_db.sql包含建库语句CREATE DATABASE IF NOT EXISTS competition_db...和建表语句无需手动创建数据库-Dmaven.test.skiptrue跳过单元测试避免因H2数据库配置问题失败--registryhttps://registry.npm.taobao.org加速npm安装国内镜像注意若提示mysql不是内部命令需将MySQL的bin目录如C:\Program Files\MySQL\MySQL Server 8.0\bin加入系统PATH环境变量。4.22-run.bat启动顺序为什么必须先启后端再开小程序2-run.bat内容echo off echo 启动SpringBoot后端... start cmd /k cd backend mvn spring-boot:run echo 启动Vue前端... start cmd /k cd frontend npm run dev echo 启动完成请按以下顺序操作 echo 1. 浏览器访问 http://localhost:8080 后台管理页 echo 2. 微信开发者工具导入小程序项目project.config.json已配置 echo 3. 小程序中点击授权登录获取openid pause必须顺序的原因Vue前端npm run dev启动在http://localhost:8080注意和SpringBoot端口冲突实际Vue用8081见vue.config.js小程序app.js中baseUrl指向http://localhost:8080即SpringBoot端口若先开小程序请求/student/login会返回net::ERR_CONNECTION_REFUSED4.3 微信开发者工具真机调试如何让手机扫码看到和电脑一样的页面确保手机和电脑在同一WiFi关键在开发者工具顶部菜单栏项目→详情→本地服务器→ 勾选启用端口填8080与SpringBoot一致点击预览→ 生成二维码 → 手机微信扫码重点手机上打开的页面其wx.request请求地址自动变为http://192.168.1.100:8080开发者工具自动注入的局域网IP提示若手机提示“网络错误”检查电脑防火墙是否阻止了8080端口Windows Defender防火墙 → 允许应用通过防火墙 → 勾选java.exe。4.4 避坑常见启动失败场景与定位方法现象原因解决方案2-run.bat运行后SpringBoot控制台报Failed to configure a DataSourceapplication.yml中数据库密码错误或MySQL服务未启动检查spring.datasource.password用Navicat连接MySQL验证账号密码Vue页面空白控制台报Uncaught Error: Cannot find module vue-routernode_modules未正确安装或package-lock.json损坏删除frontend/node_modules和package-lock.json重新npm install小程序登录后/student/info接口返回401 UnauthorizedJWT token未正确存储或过期在小程序开发者工具Storage中查看token字段用JWT官网解码确认exp时间后台管理页登录成功但菜单为空admin角色对应的菜单数据未插入运行database/init_menu.sql脚本含INSERT INTO sys_menu语句3-build.bat打包后Jar运行报java.lang.NoClassDefFoundError: javax/xml/bind/JAXBExceptionJDK 1.8需额外引入JAXB依赖在pom.xml中添加dependencygroupIdjavax.xml.bind/groupIdartifactIdjaxb-api/artifactIdversion2.3.1/version/dependency5. 答辩高频问题预演从技术细节到业务设计的硬核应答策略5.1 “为什么用SpringBoot而不是SSM”——聚焦开发效率与生态整合这不是为了跟风。SSMSpringSpringMVCMyBatis需要手动配置web.xml、spring-mvc.xml、mybatis-config.xml等8个XML文件而SpringBoot内嵌Tomcatmvn spring-boot:run一键启动省去部署WAR包步骤SpringBootApplication自动扫描Controller/Service无需context:component-scanspring-boot-starter-data-jpa自动配置DataSource、EntityManagerFactoryapplication.yml改个URL就能切库spring-boot-starter-security集成JWT只需3个类JwtAuthenticationFilter、JwtUtil、SecurityConfig答辩话术“我对比了两种方案SSM开发一个登录接口需写XML配置ControllerServiceMapperSQL映射约200行SpringBoot用RestControllerPostMappingJPA Repository50行搞定且自动事务管理。毕业设计周期短优先保障功能交付。”5.2 “并发报名怎么保证不超名额”——数据库锁与应用层双保险竞赛设置max_participants100报名人数达100时禁止新报名。实现分两层应用层乐观锁Transactional public Result apply(Long competitionId) { Competition comp competitionService.getById(competitionId); if (comp.getCurrentParticipants() comp.getMaxParticipants()) { return Result.fail(报名人数已满); } // 更新当前人数UPDATE competition SET current_participants current_participants 1 WHERE id ? AND current_participants max_participants boolean updated competitionService.updateCurrentParticipants(competitionId); if (!updated) { return Result.fail(报名人数已满请稍后再试); } // 插入报名记录... }数据库层WHERE条件锁UPDATE语句中的AND current_participants max_participants确保并发时只有一条更新成功提示答辩时可补充“我们压测了1000并发超名额拦截准确率100%日志中current_participants最大值始终≤100”。5.3 “小程序如何保证成绩公示的公平性”——时间戳审核流操作留痕成绩不是主办方填完就发布而是主办方上传成绩 → 状态为SUBMITTED管理员审核 → 状态变PUBLISHED同时写入publish_time字段小程序端查询成绩时只返回statusPUBLISHED AND publish_time NOW()的记录关键代码ScoreService.javapublic ListScoreVO getPublishedScores(Long competitionId) { return scoreMapper.selectPublishedScores(competitionId); // SQL中WHERE status PUBLISHED AND publish_time NOW() }答辩加分点“所有状态变更都记录在sys_log表含操作人、时间、IP、变更前/后值”“公示时间精确到秒避免‘刚发布就查不到’的体验问题”5.4 避坑答辩现场演示必踩的五个雷区雷区一演示前没清缓存现象学生A报名后学生B登录看到A的报名信息原因Vue前端localStorage存了旧token未及时清理应对演示前执行localStorage.clear()或用无痕模式雷区二MySQL时间与系统时间不同步现象报名截止时间到了但系统仍允许报名原因MySQL时区为SYSTEM可能为UTC而Java读取new Date()是本地时区应对application.yml中加spring.jpa.properties.hibernate.jdbc.time_zone: GMT%2B8雷区三小程序真机演示时网络切换现象手机从WiFi切到4GbaseUrl失效应对提前在小程序app.js中加容错baseUrl: wx.getNetworkTypeSync() wifi ? http://192.168.1.100:8080 : https://yourdomain.com雷区四管理员导出Excel中文乱码原因HttpServletResponse未设置Content-Type和Content-Disposition应对ExportController.java中response.setContentType(application/vnd.ms-excel;charsetutf-8); response.setHeader(Content-Disposition, attachment;filename URLEncoder.encode(报名表.xlsx, UTF-8));雷区五答辩PPT没展示核心代码片段应对PPT中放3张图competition_apply表结构截图标红status字段ApplyController.java中PostMapping方法截图标红Transactional和if校验小程序pages/result/result.js中getScoreList调用截图标红publish_time条件6. 从“能跑通”到“拿高分”毕业设计加分项落地指南与我的血泪习惯6.1 论文写作避坑技术章节必须出现的四个硬指标很多同学论文写“采用了SpringBoot框架”这等于没写。高分论文必须量化性能指标在README.md中补充压测结果——“使用JMeter模拟100并发用户报名接口平均响应时间≤200ms错误率0%”安全指标在SecurityConfig.java中强调——“所有API均需JWT Token登录接口启用BCrypt加密密码盐值长度12位”扩展性指标在application.yml中说明——“通过spring.profiles.activeprod切换生产配置数据库连接池最大连接数设为50”可维护性指标在pom.xml中指出——“统一管理依赖版本SpringBoot父POM版本2.3.12.RELEASE杜绝jar包冲突”我的习惯写完每一章技术描述立刻打开源码对应文件截图粘贴到论文中并在图下方标注“图3-5 学生报名接口实现ApplyController.java第45行”。老师一眼看到代码真实存在信任感拉满。6.2 答辩PPT黄金结构用“问题-解法-证据”替代功能罗列别做“系统有XX个模块”的流水账。按此结构组织页标题内容要点证据来源痛点传统竞赛报名靠Excel收集易丢、难统计学院反馈2023年3场竞赛共丢失17份报名表人工统计耗时23小时附《XX学院竞赛管理现状调研报告》截图解法微信小程序扫码即报数据实时入库学生端3步完成报名授权→选赛→提交后端自动校验学号唯一性pages/apply/apply.wxml截图 ApplyService.java校验逻辑证据上线后报名效率提升400%统计耗时降为0导出Excel报表功能实测1000条数据导出用时1.2秒格式兼容WPS/OfficeExportController.java中GetMapping(/export)方法 JMeter压测报告6.3 源码级优化技巧让老师觉得“这学生真懂”技巧1给关键方法加ApiOperation注解Swagger文档在StudentController.java中ApiOperation(value 学生报名竞赛, notes 需传competitionId自动关联当前登录学生) PostMapping(/apply/{competitionId}) public Result apply(PathVariable Long competitionId) { ... }然后在pom.xml引入springfox-swagger2启动后访问http://localhost:8080/swagger-ui.html自动生成API文档。答辩时说“所有接口都有Swagger文档支持在线调试这是企业级开发规范”。技巧2用Scheduled实现每日凌晨清理过期报名在CleanTask.java中Component EnableScheduling public class CleanTask { Scheduled(cron 0 0 0 * * ?) // 每天0点执行 public void cleanExpiredApply() { // 删除statusPENDING且apply_time超过7天的记录 applyMapper.deleteExpiredPending(); } }价值体现“系统长期运维思维”不是一次性Demo。技巧3小程序端加wx.setStorageSync持久化关键数据在app.js中onLaunch() { // 首次启动时从服务器拉取竞赛分类缓存到本地减少重复请求 wx.getStorage({ key: competitionCategories }).catch(() { this.getCategories().then(categories { wx.setStorageSync(competitionCategories, categories) }) }) }答辩话术“我们做了离线缓存即使网络短暂中断学生仍能浏览竞赛分类这是用户体验的细节”。从那以后我每次帮学生改毕设都会强制走一遍“删库→重跑1-install.bat→真机扫码→导出Excel”全流程确保每一步都能在答辩现场5分钟内复现。因为老师最想看到的不是你写了多少代码而是你能否在压力下让系统稳稳地跑起来。希望帮到你。本文还有配套的精品资源点击获取
返回列表