简介面向SpringBoot毕业设计与课程设计的冬奥会科普平台完整项目适合计算机专业学生用于毕设选题、期末大作业或课程实践参考。系统基于SpringBootVueMySQL搭建包含前台展示、后台管理及数据库设计功能覆盖赛事介绍、场馆展示、科普资讯、用户交互等模块界面美观、操作流畅源码注释详细新手也能较快理解核心逻辑。压缩包共1618个文件约65.32MB其中238个Java文件实现后端服务92个Vue组件构建前端界面另含SQL数据库脚本、部署说明文档、Maven配置及HTML/CSS/JS等静态资源目录划分清晰便于快速导入运行。配套部署教程保证了项目可复现已有167人学习下载作为已高分通过的毕设项目具备较高的完整性与参考价值可帮助使用者节约选题与开发时间直接作为毕业答辩或课程展示的实用蓝本。1. 基于SpringBoot的冬奥会科普平台到底在做什么“基于springboot的基于SpringBoot的冬奥会科普平台数据库毕业设计包括源码教程.zip”这个压缩包名字有点重复但作为毕业设计来看反而很直白这是一个把冬奥赛事知识做成可浏览、可检索、可后台维护的网站。用户端看运动项目、场馆、奖牌榜和科普文章管理端往数据库里录入新内容不用改代码。SpringBoot把数据库记录变成HTTP接口前端页面再把接口数据渲染出来。拿到这个压缩包的人核心工作不在“写代码”而在三件事把数据库脚本导入本地MySQL、让SpringBoot项目在IDEA里正常启动、看懂页面数据来自哪张表和哪条接口。这三条线理清楚答辩时老师问“表结构怎么设计”或“分页怎么实现”都能接住。下文按数据库设计、后端接口、页面渲染、打包验收四个顺序讲每段都给出能直接抄的配置、SQL或代码。2. 科普平台的数据库设计先给冬奥内容建模2.1 选型为什么是SpringBoot MySQL MyBatis-Plus毕业设计最怕两件事环境装不上、代码改不动。SpringBoot的好处是内置TomcatIDEA里点一下启动不用单独配服务器MySQL在大学本地和机房环境里资料多遇到问题能很快检索到答案MyBatis-Plus在MyBatis之上补了单表CRUD和分页插件做科普列表这类接口不需要手写SQL。对“科普平台”这种以内容展示为主、表不超过六张、关系只有一层的项目这套组合是成本最低的选择。科普网站的核心访问特点是“读多写少”用户浏览文章、查项目、看奖牌榜管理员偶尔录入和修改内容。数据库设计不用追求存储过程或触发器关键是字段直白让人从字段名就能看出业务含义。这是答辩时的加分项能说明白“为什么要给category建索引”“为什么用DATETIME不用TIMESTAMP”比单纯“能跑”更有说服力。2.2 数据建模科普内容拆成哪几张表冬奥会科普平台至少要覆盖三类内容有哪些比赛项目、在哪儿比赛、谁拿了奖牌。围绕这三个场景再补上文章内容和后台用户就得到下面这套适合毕业设计的表结构。表名用途核心字段sport_item冰上/雪上/滑行运动项目id, name, category, intro, cover_urlvenue比赛场馆id, name, location, capacity, descriptionmedal_rank奖牌榜id, country, gold, silver, bronze, totalarticle科普文章id, title, summary, content, viewssys_user后台管理员id, username, password, rolecomment文章评论id, article_id, user_id, content, create_timearticle 和 comment 之间是一对多关系但平台的数据量根本不走到需要数据库约束那一步。常见做法是只在 comment 里保留 article_id 作为逻辑外键不加 FOREIGN KEY。原因很实际管理员删除文章时物理外键会阻塞DELETE需要在代码里先删评论不用外键虽然失去数据库级约束但Service层手动控制删除顺序代码流程更直观这对毕业设计是合理的取舍。comment 表在毕业设计里可以做也可以不做。如果演示时想展示“用户交互”这个功能点就加上如果时间紧张只保留前五张表也说得通。加了评论表以后文章详情页的评论列表和发布表单就是一个完整的读写场景答辩时好展开。2.3 建表SQL与初始化数据脚本在Navicat或者MySQL Workbench里创建数据库 aoyun_db排序规则选 utf8mb4_general_ci然后执行建表SQL。以下是最核心的三张表CREATE TABLE sport_item ( id BIGINT AUTO_INCREMENT PRIMARY KEY COMMENT 主键, name VARCHAR(64) NOT NULL COMMENT 项目名称, category VARCHAR(32) NOT NULL COMMENT 分类冰上/雪上/滑行, intro TEXT COMMENT 项目介绍, cover_url VARCHAR(500) DEFAULT COMMENT 封面图片地址, create_time DATETIME DEFAULT CURRENT_TIMESTAMP COMMENT 创建时间, update_time DATETIME DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT 更新时间, KEY idx_category (category) ) ENGINEInnoDB DEFAULT CHARSETutf8mb4 COMMENT冬奥运动项目表; CREATE TABLE venue ( id BIGINT AUTO_INCREMENT PRIMARY KEY COMMENT 主键, name VARCHAR(100) NOT NULL COMMENT 场馆名称, location VARCHAR(255) DEFAULT COMMENT 场馆位置, capacity INT DEFAULT 0 COMMENT 可容纳人数, description TEXT COMMENT 场馆介绍, create_time DATETIME DEFAULT CURRENT_TIMESTAMP ) ENGINEInnoDB DEFAULT CHARSETutf8mb4 COMMENT比赛场馆表; CREATE TABLE medal_rank ( id BIGINT AUTO_INCREMENT PRIMARY KEY COMMENT 主键, country VARCHAR(64) NOT NULL COMMENT 国家/地区, gold INT DEFAULT 0 COMMENT 金牌数, silver INT DEFAULT 0 COMMENT 银牌数, bronze INT DEFAULT 0 COMMENT 铜牌数, total INT DEFAULT 0 COMMENT 奖牌总数, update_time DATETIME DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP, KEY idx_total (total) ) ENGINEInnoDB DEFAULT CHARSETutf8mb4 COMMENT奖牌榜;初始化数据一般单独放在 data.sql 里不要和建表语句混在一起。sport_item 插入几条样例记录时使用如下写法INSERT INTO sport_item (name, category, intro) VALUES (短道速滑, 冰上, 在长度较短的冰道上进行的竞速比赛考验弯道技术和团队配合。), (花样滑冰, 冰上, 运动员在冰面上完成跳跃、旋转和步伐编排兼具技术和艺术表现。), (高山滑雪, 雪上, 选手从高山赛道高速滑降比拼速度和过门技术。);数据插入完成后用SELECT * FROM sport_item;检查记录是否出现中文乱码。出现乱码时先查数据库和连接串两处的字符集是不是都指定了 utf8mb4而不是在 show variables 里看着是utf8就完事。这步检查放在项目启动之前能节约后面排查后端显示乱码的时间。2.4 时间字段与逻辑删除的几个细节时间字段统一用 DATETIME不要用 TIMESTAMP。原因是可读性好Navicat直接查表不会有时区换算干扰而且 TIMESTAMP 的2038问题虽然短期遇不到但 DATETIME 的语义更不容易被答辩老师追问。逻辑删除字段 deleted 要不要加取决于需求。如果平台只有管理员删文章物理 DELETE 足够如果后面打算加“回收站”就在表里加deleted TINYINT DEFAULT 0实体类字段加 MyBatis-Plus 的TableLogic查询时框架自动追加deleted0。提示两段式脚本schema.sql data.sql用spring.sql.init.modealways可以在每次启动时执行但注意它只在你已经建好库的前提下执行不会创建数据库本身。aoyun_db 这个库还是要手动建。另外注意密码不要明文入库。sys_user 表的密码字段至少用 BCrypt 或 MD5 加密后写入SpringBoot 集成 spring-security-crypto 的 BCryptPasswordEncoder注册时编码、登录时 matches 比对。虽然毕业设计不强制但老师问到安全问题时能答上来印象分会高不少。3. SpringBoot后端从application.yml到Controller3.1 SpringBoot项目结构与版本差异拿到源码后用IDEA打开等待Maven下载依赖第一次启动的时间取决于网络。科普平台后端的依赖集中在 spring-boot-starter-web、mybatis-plus-boot-starter、mysql-connector-j、thymeleaf 这四个包。项目包名一般是 com.example.aoyun下面分 controller、service、mapper、entity、config 五层包/类职责关键注解controller接收HTTP请求返回JSON或视图RestController / Controllerservice业务逻辑组装查询条件Servicemapper数据库访问接口Mapperentity表结构对应的Java对象TableNameconfig分页插件等配置Configuration这里需要留意 pom.xml 里的 SpringBoot 版本。SpringBoot 2.7.x 用 JDK 8 编译javax.servlet 包名SpringBoot 3.x 要求 JDK 17 以上包名换成 jakarta.servlet。如果本地装的 JDK 版本和项目对不上启动时会出现 UnsupportedClassVersionError。毕业设计项目如果是 3.x连接MySQL的驱动坐标也变成了 com.mysql:mysql-connector-j而不是老的 mysql:mysql-connector-java改版本时容易踩这个坑。如果 config 包里没有分页插件配置说明项目可能把 MybatisPlusInterceptor 写在启动类里了。MyBatis-Plus 3.x 不手动注册分页插件时Page 对象返回的 records 只有一条数据这是最典型的“代码没报错但结果不对”的问题。下面这段配置贴到 config 包即可Configuration public class MybatisPlusConfig { Bean public MybatisPlusInterceptor mybatisPlusInterceptor() { MybatisPlusInterceptor interceptor new MybatisPlusInterceptor(); PaginationInnerInterceptor pagination new PaginationInnerInterceptor(DbType.MYSQL); pagination.setMaxLimit(100L); interceptor.addInnerInterceptor(pagination); return interceptor; } }PaginationInnerInterceptor 里的 setMaxLimit(100L) 是单页最大条数限制不设置时如果有人传 size999999MyBatis-Plus 会真的执行一条没有 LIMIT 的查询数据库内存容易被撑爆。这个参数属于安全兜底建议保留。3.2 数据源配置数据库连接和MyBatis-Plus设置application.yml 是整个后端能否启动的关键文件。下面这份配置覆盖了数据源、时区、编码和SQL日志可以直接换成自己的账号密码使用server: port: 8080 spring: datasource: driver-class-name: com.mysql.cj.jdbc.Driver url: jdbc:mysql://localhost:3306/aoyun_db?useUnicodetruecharacterEncodingutf8serverTimezoneAsia/Shanghai username: root password: 123456 thymeleaf: cache: false mybatis-plus: configuration: log-impl: org.apache.ibatis.logging.stdout.StdOutImpl global-config: db-config: id-type: autourl 里的 serverTimezoneAsia/Shanghai 解决 mysql 8 的时区报错characterEncodingutf8 解决中文乱码。使用 MySQL 8.0 时驱动类必须写 com.mysql.cj.jdbc.Driver旧的 com.mysql.jdbc.Driver 在 SpringBoot 2.7 以上会启动失败。控制台看不到SQL时检查 mybatis-plus.configuration.log-impl 是否能打出日志这行配置对排查“接口返回但字段为空”特别有用项目上线前删掉即可。3.3 从实体类到Controller的接口开发实体类用 TableName 映射表名字段用 TableField 处理下划线转驼峰。MyBatis-Plus 默认开启驼峰映射cover_url 会自动对应 coverUrl显式加 TableField 是防止字段被改动时可读性更好Data TableName(sport_item) public class SportItem { TableId(type IdType.AUTO) private Long id; private String name; private String category; private String intro; private String coverUrl; private LocalDateTime createTime; }Mapper 接口继承 BaseMapper 后单表增删改查就全部就绪不需要写 XMLMapper public interface SportItemMapper extends BaseMapperSportItem { }Service 层负责组装查询条件。比如按分类查询列表用 LambdaQueryWrapper 构造条件Service public class SportItemService extends ServiceImplSportItemMapper, SportItem { public ListSportItem listByCategory(String category) { LambdaQueryWrapperSportItem wrapper new LambdaQueryWrapper(); wrapper.eq(StringUtils.hasText(category), SportItem::getCategory, category); wrapper.orderByAsc(SportItem::getId); return this.list(wrapper); } }Controller 把 HTTP 请求接入 Service。列表接口和详情接口分别对应两个方法RestController RequestMapping(/api/sport) public class SportItemController { Autowired private SportItemService sportItemService; GetMapping(/list) public Result list(RequestParam(required false) String category) { return Result.success(sportItemService.listByCategory(category)); } GetMapping(/{id}) public Result detail(PathVariable Long id) { return Result.success(sportItemService.getById(id)); } }Result 是统一响应包装类包含 code、message、data 三个字段。项目里一般已经写好了如果源码里没有自己加一个也很简单。类上用 RestController 表示所有方法都返回 JSON如果是 Controller返回的字符串会被当成视图名去 templates 里找文件前后端分离时最容易犯这个错。三个层次使用的注解里RequestParam(required false)表示 category 可以不传接口返回全部列表。PathVariable接收 /api/sport/5 这种路径上的 idMyBatis-Plus 的 getById 在记录不存在时返回 null不会抛异常前端拿到 null 后自行处理“数据不存在”提示。3.4 分页、搜索与参数校验文章列表不能一次查全部数据分页接口的写法如下GetMapping(/page) public Result page(RequestParam(defaultValue 1) Integer current, RequestParam(defaultValue 10) Integer size) { PageArticle page new Page(current, size); LambdaQueryWrapperArticle wrapper new LambdaQueryWrapper(); wrapper.orderByDesc(Article::getCreateTime); return Result.success(articleService.page(page, wrapper)); }前端从返回体里取 records 渲染当前页用 total 计算总页数。搜索功能把 like 条件拼到同一个 wrapper 上wrapper.like(StringUtils.hasText(keyword), Article::getTitle, keyword);这里StringUtils.hasText(keyword)是让条件在 keyword 为空时不参与拼SQL换成keyword ! null的话空字符串也会导致like %%全表查询。新增和编辑的接口参数用 RequestBody 接收 JSON如果想在实体类字段上加校验注解Controller 方法参数前还要加 ValidatedPostMapping(/save) public Result save(Validated RequestBody SportItem sportItem) { sportItemService.saveOrUpdate(sportItem); return Result.success(); }实体类的 name 字段加NotBlank(message 项目名称不能为空)SpringBoot 就会在到达 Service 之前拦截非法请求返回400错误。这样 Controller 里就不用写 if (name null) 之类的判断了。4. 页面渲染与接口联调让数据在前端出现4.1 模板方案选Thymeleaf还是Vue科普平台的用户端主要做列表和详情展示交互不复杂。前端方案上Thymeleaf 服务端渲染和 Vue 前后端分离都能实现但对毕业设计的演示场景Thymeleaf 更有利模板文件放在 resources/templates 下Controller 返回视图名打包后单个 jar 可以直接跑不用解释为什么有两个服务。Vue 方案虽然页面体验好但部署时要么额外起一个 node 服务要么把打包后的 dist 文件拷进静态目录多出来的环节在答辩现场都是风险点。对比维度ThymeleafVue 前后端分离启动复杂度单jar直接运行前端需build并配置跨域数据渲染服务端渲染浏览器直接看到页面浏览器执行JS后渲染适合场景内容型、展示型交互重、后台系统答辩演示风险低中高如果压缩包里是 Vue 项目最简单的做法是用npm run build生成 dist 目录将 dist 里的内容复制到后端 resources/static然后确保 Controller 返回 JSON。这种改造方式对代码侵入最小比在后端里面硬写 HTML 要省事。4.2 科普列表页的模板渲染Thymeleaf 模板在 HTML 标签里加 th: 开头的属性。sport/list.html 的卡片列表部分div classsport-card th:eachitem : ${sportList} img th:src${item.coverUrl} alt封面/ h3 th:text${item.name}项目名称/h3 p th:text${item.category}分类/p a th:href{/sport/detail/{id}(id${item.id})}查看详情/a /divController 在返回视图名之前把查询结果放到 Model 里GetMapping(/sport/list) public String sportList(Model model, RequestParam(required false) String category) { model.addAttribute(sportList, sportItemService.listByCategory(category)); return sport/list; }th:href 的写法要注意{/sport/detail/{id}(id${item.id})}会把参数拼成 /sport/detail/3模板引擎会做URL编码比手动字符串拼接更安全。详情页也用同样的方式通过 th:object 绑定查询出来的实体h1 th:text${sport.name}标题/h1 div th:text${sport.intro}介绍内容/div文章详情的浏览量递增一般在详情页 Controller 里加一次 updatearticleService.updateViews(article.getId());对应 Service 里写一条UPDATE article SET views views 1 WHERE id ?。用 SQL 自增而不是先查出来再加一避免两个用户同时访问时丢更新。4.3 搜索与分类筛选的参数传递分类筛选用 form GET 提交生成一个可收藏的URL刷新页面不会提示重复提交。模板form th:action{/sport/list} methodget input typetext namecategory th:value${category} placeholder输入分类/ button typesubmit筛选/button /formController 接收 category 后回传 Model页面在 th:value 里回显已输入的关键词。前端校验放在 input 的 required 属性上后端在 Service 层再兜底一次比如 category 如果传了不存在的值查询结果为空页面应显示“暂无数据”而不是一片空白。这个空状态的判断写在前端模板里p th:if${#lists.isEmpty(sportList)}暂无数据/p4.4 后台管理页的数据库增删改查后台管理是典型的“数据库增删改查”落地场景。每一张业务表都对应一组 Controller 方法模板里用 form 提交请求方式上区分 GET 和 POST操作请求方式接口地址说明查询列表GET/admin/sport/list按需传category筛选新增保存POST/admin/sport/save保存前判空修改保存POST/admin/sport/saveid存在时更新删除POST/admin/sport/delete/{id}删完重定向删除按钮的模板和对应 Controllerform th:action{/admin/sport/delete/{id}(id${item.id})} methodpost button typesubmit onclickreturn confirm(确定删除吗)删除/button /formPostMapping(/admin/sport/delete/{id}) public String delete(PathVariable Long id) { sportItemService.removeById(id); return redirect:/admin/sport/list; }删除后必须重定向redirect否则刷新页面时会重复提交同一个删除请求。新增和编辑共用一个保存接口通过 id 是否为空区分这种写法在毕业设计里足够简洁。如果管理员需要上传图片表单要加 enctypemultipart/form-dataController 用 MultipartFile 接收并保存到本地目录同时把访问路径写进 cover_url 字段。5. 打包部署与验收接口5.1 Maven打包与jar启动项目根目录执行mvn clean package -DskipTests或者在 IDEA 右侧 Maven 面板双击 package。打包完成后 target/ 下生成可执行 jar。启动命令java -jar target/aoyun-0.0.1-SNAPSHOT.jar看到Started Application in xx seconds就是启动成功。用curl http://localhost:8080/api/sport/list验证接口是否响应。注意区分 SpringBoot 的 8080 端口和 MySQL 的 3306 端口打包前先确认 application.yml 中密码已改成当前环境的值否则 jar 连不上数据库只会报 SQL 错误页面上全是500。5.2 三个高频报错现场第一个是时区错误或Cannot create PoolableConnectionFactory。检查两处url 是否带 serverTimezoneAsia/ShanghaiMySQL 服务是否在运行。Windows 下用netstat -ano | findstr 3306检查端口监听状态再用 Navicat 连一次分清楚是数据库没启动还是账号密码错了。第二个是 IDEA 里能跑、命令行 jar 跑不了。多半是当前目录不对jar 并没有读取 target/ 外的配置文件这不影响正常运行换个目录执行 jar 即可或者用--spring.config.location指定外部配置文件路径。第三个是页面打开但图片/JS不显示。检查控制器是不是被 RestController 标注了导致返回JSON而不是视图这会让浏览器直接看到一串数据而看不到HTML。静态资源统一放 resources/static 下模板引用用 /css/、/js/、/img/ 作为前缀。5.3 用Postman验收接口的完整顺序按“列表、详情、新增、修改、删除”五个动作过一遍。GET /api/sport/list 返回200且 records 数组非空GET /api/sport/1 返回对应记录POST /api/sport/save 提交 name、category、intro 后再次查列表确认记录数加一修改时把 id 传进 save 方法删除后记录从列表消失。如果项目引入了 springdoc 或 knife4j启动后访问 /swagger-ui/index.html页面上可以直接展开每个接口调试比 Postman 方便。最后把数据库脚本、jar 包和 README 放进同一个目录README 里写清三行命令建库、执行SQL、java -jar 启动。做到数据库有数据、接口有响应、页面有内容这个压缩包才算真正完整的毕业设计交付物。本文还有配套的精品资源点击获取
SpringBoot冬奥会科普平台：数据库设计到接口开发与部署
简介面向SpringBoot毕业设计与课程设计的冬奥会科普平台完整项目适合计算机专业学生用于毕设选题、期末大作业或课程实践参考。系统基于SpringBootVueMySQL搭建包含前台展示、后台管理及数据库设计功能覆盖赛事介绍、场馆展示、科普资讯、用户交互等模块界面美观、操作流畅源码注释详细新手也能较快理解核心逻辑。压缩包共1618个文件约65.32MB其中238个Java文件实现后端服务92个Vue组件构建前端界面另含SQL数据库脚本、部署说明文档、Maven配置及HTML/CSS/JS等静态资源目录划分清晰便于快速导入运行。配套部署教程保证了项目可复现已有167人学习下载作为已高分通过的毕设项目具备较高的完整性与参考价值可帮助使用者节约选题与开发时间直接作为毕业答辩或课程展示的实用蓝本。1. 基于SpringBoot的冬奥会科普平台到底在做什么“基于springboot的基于SpringBoot的冬奥会科普平台数据库毕业设计包括源码教程.zip”这个压缩包名字有点重复但作为毕业设计来看反而很直白这是一个把冬奥赛事知识做成可浏览、可检索、可后台维护的网站。用户端看运动项目、场馆、奖牌榜和科普文章管理端往数据库里录入新内容不用改代码。SpringBoot把数据库记录变成HTTP接口前端页面再把接口数据渲染出来。拿到这个压缩包的人核心工作不在“写代码”而在三件事把数据库脚本导入本地MySQL、让SpringBoot项目在IDEA里正常启动、看懂页面数据来自哪张表和哪条接口。这三条线理清楚答辩时老师问“表结构怎么设计”或“分页怎么实现”都能接住。下文按数据库设计、后端接口、页面渲染、打包验收四个顺序讲每段都给出能直接抄的配置、SQL或代码。2. 科普平台的数据库设计先给冬奥内容建模2.1 选型为什么是SpringBoot MySQL MyBatis-Plus毕业设计最怕两件事环境装不上、代码改不动。SpringBoot的好处是内置TomcatIDEA里点一下启动不用单独配服务器MySQL在大学本地和机房环境里资料多遇到问题能很快检索到答案MyBatis-Plus在MyBatis之上补了单表CRUD和分页插件做科普列表这类接口不需要手写SQL。对“科普平台”这种以内容展示为主、表不超过六张、关系只有一层的项目这套组合是成本最低的选择。科普网站的核心访问特点是“读多写少”用户浏览文章、查项目、看奖牌榜管理员偶尔录入和修改内容。数据库设计不用追求存储过程或触发器关键是字段直白让人从字段名就能看出业务含义。这是答辩时的加分项能说明白“为什么要给category建索引”“为什么用DATETIME不用TIMESTAMP”比单纯“能跑”更有说服力。2.2 数据建模科普内容拆成哪几张表冬奥会科普平台至少要覆盖三类内容有哪些比赛项目、在哪儿比赛、谁拿了奖牌。围绕这三个场景再补上文章内容和后台用户就得到下面这套适合毕业设计的表结构。表名用途核心字段sport_item冰上/雪上/滑行运动项目id, name, category, intro, cover_urlvenue比赛场馆id, name, location, capacity, descriptionmedal_rank奖牌榜id, country, gold, silver, bronze, totalarticle科普文章id, title, summary, content, viewssys_user后台管理员id, username, password, rolecomment文章评论id, article_id, user_id, content, create_timearticle 和 comment 之间是一对多关系但平台的数据量根本不走到需要数据库约束那一步。常见做法是只在 comment 里保留 article_id 作为逻辑外键不加 FOREIGN KEY。原因很实际管理员删除文章时物理外键会阻塞DELETE需要在代码里先删评论不用外键虽然失去数据库级约束但Service层手动控制删除顺序代码流程更直观这对毕业设计是合理的取舍。comment 表在毕业设计里可以做也可以不做。如果演示时想展示“用户交互”这个功能点就加上如果时间紧张只保留前五张表也说得通。加了评论表以后文章详情页的评论列表和发布表单就是一个完整的读写场景答辩时好展开。2.3 建表SQL与初始化数据脚本在Navicat或者MySQL Workbench里创建数据库 aoyun_db排序规则选 utf8mb4_general_ci然后执行建表SQL。以下是最核心的三张表CREATE TABLE sport_item ( id BIGINT AUTO_INCREMENT PRIMARY KEY COMMENT 主键, name VARCHAR(64) NOT NULL COMMENT 项目名称, category VARCHAR(32) NOT NULL COMMENT 分类冰上/雪上/滑行, intro TEXT COMMENT 项目介绍, cover_url VARCHAR(500) DEFAULT COMMENT 封面图片地址, create_time DATETIME DEFAULT CURRENT_TIMESTAMP COMMENT 创建时间, update_time DATETIME DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT 更新时间, KEY idx_category (category) ) ENGINEInnoDB DEFAULT CHARSETutf8mb4 COMMENT冬奥运动项目表; CREATE TABLE venue ( id BIGINT AUTO_INCREMENT PRIMARY KEY COMMENT 主键, name VARCHAR(100) NOT NULL COMMENT 场馆名称, location VARCHAR(255) DEFAULT COMMENT 场馆位置, capacity INT DEFAULT 0 COMMENT 可容纳人数, description TEXT COMMENT 场馆介绍, create_time DATETIME DEFAULT CURRENT_TIMESTAMP ) ENGINEInnoDB DEFAULT CHARSETutf8mb4 COMMENT比赛场馆表; CREATE TABLE medal_rank ( id BIGINT AUTO_INCREMENT PRIMARY KEY COMMENT 主键, country VARCHAR(64) NOT NULL COMMENT 国家/地区, gold INT DEFAULT 0 COMMENT 金牌数, silver INT DEFAULT 0 COMMENT 银牌数, bronze INT DEFAULT 0 COMMENT 铜牌数, total INT DEFAULT 0 COMMENT 奖牌总数, update_time DATETIME DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP, KEY idx_total (total) ) ENGINEInnoDB DEFAULT CHARSETutf8mb4 COMMENT奖牌榜;初始化数据一般单独放在 data.sql 里不要和建表语句混在一起。sport_item 插入几条样例记录时使用如下写法INSERT INTO sport_item (name, category, intro) VALUES (短道速滑, 冰上, 在长度较短的冰道上进行的竞速比赛考验弯道技术和团队配合。), (花样滑冰, 冰上, 运动员在冰面上完成跳跃、旋转和步伐编排兼具技术和艺术表现。), (高山滑雪, 雪上, 选手从高山赛道高速滑降比拼速度和过门技术。);数据插入完成后用SELECT * FROM sport_item;检查记录是否出现中文乱码。出现乱码时先查数据库和连接串两处的字符集是不是都指定了 utf8mb4而不是在 show variables 里看着是utf8就完事。这步检查放在项目启动之前能节约后面排查后端显示乱码的时间。2.4 时间字段与逻辑删除的几个细节时间字段统一用 DATETIME不要用 TIMESTAMP。原因是可读性好Navicat直接查表不会有时区换算干扰而且 TIMESTAMP 的2038问题虽然短期遇不到但 DATETIME 的语义更不容易被答辩老师追问。逻辑删除字段 deleted 要不要加取决于需求。如果平台只有管理员删文章物理 DELETE 足够如果后面打算加“回收站”就在表里加deleted TINYINT DEFAULT 0实体类字段加 MyBatis-Plus 的TableLogic查询时框架自动追加deleted0。提示两段式脚本schema.sql data.sql用spring.sql.init.modealways可以在每次启动时执行但注意它只在你已经建好库的前提下执行不会创建数据库本身。aoyun_db 这个库还是要手动建。另外注意密码不要明文入库。sys_user 表的密码字段至少用 BCrypt 或 MD5 加密后写入SpringBoot 集成 spring-security-crypto 的 BCryptPasswordEncoder注册时编码、登录时 matches 比对。虽然毕业设计不强制但老师问到安全问题时能答上来印象分会高不少。3. SpringBoot后端从application.yml到Controller3.1 SpringBoot项目结构与版本差异拿到源码后用IDEA打开等待Maven下载依赖第一次启动的时间取决于网络。科普平台后端的依赖集中在 spring-boot-starter-web、mybatis-plus-boot-starter、mysql-connector-j、thymeleaf 这四个包。项目包名一般是 com.example.aoyun下面分 controller、service、mapper、entity、config 五层包/类职责关键注解controller接收HTTP请求返回JSON或视图RestController / Controllerservice业务逻辑组装查询条件Servicemapper数据库访问接口Mapperentity表结构对应的Java对象TableNameconfig分页插件等配置Configuration这里需要留意 pom.xml 里的 SpringBoot 版本。SpringBoot 2.7.x 用 JDK 8 编译javax.servlet 包名SpringBoot 3.x 要求 JDK 17 以上包名换成 jakarta.servlet。如果本地装的 JDK 版本和项目对不上启动时会出现 UnsupportedClassVersionError。毕业设计项目如果是 3.x连接MySQL的驱动坐标也变成了 com.mysql:mysql-connector-j而不是老的 mysql:mysql-connector-java改版本时容易踩这个坑。如果 config 包里没有分页插件配置说明项目可能把 MybatisPlusInterceptor 写在启动类里了。MyBatis-Plus 3.x 不手动注册分页插件时Page 对象返回的 records 只有一条数据这是最典型的“代码没报错但结果不对”的问题。下面这段配置贴到 config 包即可Configuration public class MybatisPlusConfig { Bean public MybatisPlusInterceptor mybatisPlusInterceptor() { MybatisPlusInterceptor interceptor new MybatisPlusInterceptor(); PaginationInnerInterceptor pagination new PaginationInnerInterceptor(DbType.MYSQL); pagination.setMaxLimit(100L); interceptor.addInnerInterceptor(pagination); return interceptor; } }PaginationInnerInterceptor 里的 setMaxLimit(100L) 是单页最大条数限制不设置时如果有人传 size999999MyBatis-Plus 会真的执行一条没有 LIMIT 的查询数据库内存容易被撑爆。这个参数属于安全兜底建议保留。3.2 数据源配置数据库连接和MyBatis-Plus设置application.yml 是整个后端能否启动的关键文件。下面这份配置覆盖了数据源、时区、编码和SQL日志可以直接换成自己的账号密码使用server: port: 8080 spring: datasource: driver-class-name: com.mysql.cj.jdbc.Driver url: jdbc:mysql://localhost:3306/aoyun_db?useUnicodetruecharacterEncodingutf8serverTimezoneAsia/Shanghai username: root password: 123456 thymeleaf: cache: false mybatis-plus: configuration: log-impl: org.apache.ibatis.logging.stdout.StdOutImpl global-config: db-config: id-type: autourl 里的 serverTimezoneAsia/Shanghai 解决 mysql 8 的时区报错characterEncodingutf8 解决中文乱码。使用 MySQL 8.0 时驱动类必须写 com.mysql.cj.jdbc.Driver旧的 com.mysql.jdbc.Driver 在 SpringBoot 2.7 以上会启动失败。控制台看不到SQL时检查 mybatis-plus.configuration.log-impl 是否能打出日志这行配置对排查“接口返回但字段为空”特别有用项目上线前删掉即可。3.3 从实体类到Controller的接口开发实体类用 TableName 映射表名字段用 TableField 处理下划线转驼峰。MyBatis-Plus 默认开启驼峰映射cover_url 会自动对应 coverUrl显式加 TableField 是防止字段被改动时可读性更好Data TableName(sport_item) public class SportItem { TableId(type IdType.AUTO) private Long id; private String name; private String category; private String intro; private String coverUrl; private LocalDateTime createTime; }Mapper 接口继承 BaseMapper 后单表增删改查就全部就绪不需要写 XMLMapper public interface SportItemMapper extends BaseMapperSportItem { }Service 层负责组装查询条件。比如按分类查询列表用 LambdaQueryWrapper 构造条件Service public class SportItemService extends ServiceImplSportItemMapper, SportItem { public ListSportItem listByCategory(String category) { LambdaQueryWrapperSportItem wrapper new LambdaQueryWrapper(); wrapper.eq(StringUtils.hasText(category), SportItem::getCategory, category); wrapper.orderByAsc(SportItem::getId); return this.list(wrapper); } }Controller 把 HTTP 请求接入 Service。列表接口和详情接口分别对应两个方法RestController RequestMapping(/api/sport) public class SportItemController { Autowired private SportItemService sportItemService; GetMapping(/list) public Result list(RequestParam(required false) String category) { return Result.success(sportItemService.listByCategory(category)); } GetMapping(/{id}) public Result detail(PathVariable Long id) { return Result.success(sportItemService.getById(id)); } }Result 是统一响应包装类包含 code、message、data 三个字段。项目里一般已经写好了如果源码里没有自己加一个也很简单。类上用 RestController 表示所有方法都返回 JSON如果是 Controller返回的字符串会被当成视图名去 templates 里找文件前后端分离时最容易犯这个错。三个层次使用的注解里RequestParam(required false)表示 category 可以不传接口返回全部列表。PathVariable接收 /api/sport/5 这种路径上的 idMyBatis-Plus 的 getById 在记录不存在时返回 null不会抛异常前端拿到 null 后自行处理“数据不存在”提示。3.4 分页、搜索与参数校验文章列表不能一次查全部数据分页接口的写法如下GetMapping(/page) public Result page(RequestParam(defaultValue 1) Integer current, RequestParam(defaultValue 10) Integer size) { PageArticle page new Page(current, size); LambdaQueryWrapperArticle wrapper new LambdaQueryWrapper(); wrapper.orderByDesc(Article::getCreateTime); return Result.success(articleService.page(page, wrapper)); }前端从返回体里取 records 渲染当前页用 total 计算总页数。搜索功能把 like 条件拼到同一个 wrapper 上wrapper.like(StringUtils.hasText(keyword), Article::getTitle, keyword);这里StringUtils.hasText(keyword)是让条件在 keyword 为空时不参与拼SQL换成keyword ! null的话空字符串也会导致like %%全表查询。新增和编辑的接口参数用 RequestBody 接收 JSON如果想在实体类字段上加校验注解Controller 方法参数前还要加 ValidatedPostMapping(/save) public Result save(Validated RequestBody SportItem sportItem) { sportItemService.saveOrUpdate(sportItem); return Result.success(); }实体类的 name 字段加NotBlank(message 项目名称不能为空)SpringBoot 就会在到达 Service 之前拦截非法请求返回400错误。这样 Controller 里就不用写 if (name null) 之类的判断了。4. 页面渲染与接口联调让数据在前端出现4.1 模板方案选Thymeleaf还是Vue科普平台的用户端主要做列表和详情展示交互不复杂。前端方案上Thymeleaf 服务端渲染和 Vue 前后端分离都能实现但对毕业设计的演示场景Thymeleaf 更有利模板文件放在 resources/templates 下Controller 返回视图名打包后单个 jar 可以直接跑不用解释为什么有两个服务。Vue 方案虽然页面体验好但部署时要么额外起一个 node 服务要么把打包后的 dist 文件拷进静态目录多出来的环节在答辩现场都是风险点。对比维度ThymeleafVue 前后端分离启动复杂度单jar直接运行前端需build并配置跨域数据渲染服务端渲染浏览器直接看到页面浏览器执行JS后渲染适合场景内容型、展示型交互重、后台系统答辩演示风险低中高如果压缩包里是 Vue 项目最简单的做法是用npm run build生成 dist 目录将 dist 里的内容复制到后端 resources/static然后确保 Controller 返回 JSON。这种改造方式对代码侵入最小比在后端里面硬写 HTML 要省事。4.2 科普列表页的模板渲染Thymeleaf 模板在 HTML 标签里加 th: 开头的属性。sport/list.html 的卡片列表部分div classsport-card th:eachitem : ${sportList} img th:src${item.coverUrl} alt封面/ h3 th:text${item.name}项目名称/h3 p th:text${item.category}分类/p a th:href{/sport/detail/{id}(id${item.id})}查看详情/a /divController 在返回视图名之前把查询结果放到 Model 里GetMapping(/sport/list) public String sportList(Model model, RequestParam(required false) String category) { model.addAttribute(sportList, sportItemService.listByCategory(category)); return sport/list; }th:href 的写法要注意{/sport/detail/{id}(id${item.id})}会把参数拼成 /sport/detail/3模板引擎会做URL编码比手动字符串拼接更安全。详情页也用同样的方式通过 th:object 绑定查询出来的实体h1 th:text${sport.name}标题/h1 div th:text${sport.intro}介绍内容/div文章详情的浏览量递增一般在详情页 Controller 里加一次 updatearticleService.updateViews(article.getId());对应 Service 里写一条UPDATE article SET views views 1 WHERE id ?。用 SQL 自增而不是先查出来再加一避免两个用户同时访问时丢更新。4.3 搜索与分类筛选的参数传递分类筛选用 form GET 提交生成一个可收藏的URL刷新页面不会提示重复提交。模板form th:action{/sport/list} methodget input typetext namecategory th:value${category} placeholder输入分类/ button typesubmit筛选/button /formController 接收 category 后回传 Model页面在 th:value 里回显已输入的关键词。前端校验放在 input 的 required 属性上后端在 Service 层再兜底一次比如 category 如果传了不存在的值查询结果为空页面应显示“暂无数据”而不是一片空白。这个空状态的判断写在前端模板里p th:if${#lists.isEmpty(sportList)}暂无数据/p4.4 后台管理页的数据库增删改查后台管理是典型的“数据库增删改查”落地场景。每一张业务表都对应一组 Controller 方法模板里用 form 提交请求方式上区分 GET 和 POST操作请求方式接口地址说明查询列表GET/admin/sport/list按需传category筛选新增保存POST/admin/sport/save保存前判空修改保存POST/admin/sport/saveid存在时更新删除POST/admin/sport/delete/{id}删完重定向删除按钮的模板和对应 Controllerform th:action{/admin/sport/delete/{id}(id${item.id})} methodpost button typesubmit onclickreturn confirm(确定删除吗)删除/button /formPostMapping(/admin/sport/delete/{id}) public String delete(PathVariable Long id) { sportItemService.removeById(id); return redirect:/admin/sport/list; }删除后必须重定向redirect否则刷新页面时会重复提交同一个删除请求。新增和编辑共用一个保存接口通过 id 是否为空区分这种写法在毕业设计里足够简洁。如果管理员需要上传图片表单要加 enctypemultipart/form-dataController 用 MultipartFile 接收并保存到本地目录同时把访问路径写进 cover_url 字段。5. 打包部署与验收接口5.1 Maven打包与jar启动项目根目录执行mvn clean package -DskipTests或者在 IDEA 右侧 Maven 面板双击 package。打包完成后 target/ 下生成可执行 jar。启动命令java -jar target/aoyun-0.0.1-SNAPSHOT.jar看到Started Application in xx seconds就是启动成功。用curl http://localhost:8080/api/sport/list验证接口是否响应。注意区分 SpringBoot 的 8080 端口和 MySQL 的 3306 端口打包前先确认 application.yml 中密码已改成当前环境的值否则 jar 连不上数据库只会报 SQL 错误页面上全是500。5.2 三个高频报错现场第一个是时区错误或Cannot create PoolableConnectionFactory。检查两处url 是否带 serverTimezoneAsia/ShanghaiMySQL 服务是否在运行。Windows 下用netstat -ano | findstr 3306检查端口监听状态再用 Navicat 连一次分清楚是数据库没启动还是账号密码错了。第二个是 IDEA 里能跑、命令行 jar 跑不了。多半是当前目录不对jar 并没有读取 target/ 外的配置文件这不影响正常运行换个目录执行 jar 即可或者用--spring.config.location指定外部配置文件路径。第三个是页面打开但图片/JS不显示。检查控制器是不是被 RestController 标注了导致返回JSON而不是视图这会让浏览器直接看到一串数据而看不到HTML。静态资源统一放 resources/static 下模板引用用 /css/、/js/、/img/ 作为前缀。5.3 用Postman验收接口的完整顺序按“列表、详情、新增、修改、删除”五个动作过一遍。GET /api/sport/list 返回200且 records 数组非空GET /api/sport/1 返回对应记录POST /api/sport/save 提交 name、category、intro 后再次查列表确认记录数加一修改时把 id 传进 save 方法删除后记录从列表消失。如果项目引入了 springdoc 或 knife4j启动后访问 /swagger-ui/index.html页面上可以直接展开每个接口调试比 Postman 方便。最后把数据库脚本、jar 包和 README 放进同一个目录README 里写清三行命令建库、执行SQL、java -jar 启动。做到数据库有数据、接口有响应、页面有内容这个压缩包才算真正完整的毕业设计交付物。本文还有配套的精品资源点击获取
