首页 / 资讯中心 / 文章详情

Spring Boot+Vue养老管理系统落地部署指南

Spring Boot+Vue养老管理系统落地部署指南 ★ FEATURED ARTICLE
简介本资源是一套完整的养老院管理信息系统毕业设计项目面向计算机专业本科生及Java全栈开发初学者聚焦智慧养老场景下的业务数字化落地。系统采用Spring Boot构建后端服务Vue.js开发响应式前端界面配套MySQL数据库脚本与详细说明文档覆盖用户管理、老人档案、房间调度、日常护理、膳食计划、文娱活动、消息通知、财务结算及安防监控等九大核心模块并支持数据导入导出与多维统计报表生成。压缩包为ZIP格式大小19.85MB包含前后端源码、建库SQL脚本、接口文档及部署说明等关键文件结构清晰、注释完整便于二次开发与课程实践。目前已有92人学习下载适合用于毕业设计参考、Spring BootVue技术栈综合实训或养老信息化系统原型验证。1. 这不是又一个“毕业设计模板”而是一套能真正在小型养老机构跑起来的 Spring Boot Vue 管理系统含可落地的数据库脚本与配置细节你手头那份标着“毕业设计”的养老院管理系统 ZIP 包大概率正躺在下载目录里吃灰——因为多数人点开后第一眼看到的是pom.xml里一堆没配过的 MySQL 地址、Vue 项目里报红的axios请求路径、还有application.yml里写着localhost:3306却连不上自己本机数据库的玄学报错。这不是代码质量差而是它压根没按「本地可复现」设计数据库脚本缺初始化数据、Vue 代理配置写死在vue.config.js里却没说明怎么改、Spring Boot 的 JPA 实体类字段和 SQL 脚本字段名对不上……我去年帮三家社区养老中心部署同类系统时光是修sys_user表的id_card字段长度不一致就花了 2 小时。这套资源真正价值在于它把「从解压到登录后台」压缩到 15 分钟内完成——前提是你要知道哪三处配置必须改、哪两个 SQL 文件必须先执行、以及为什么npm run serve启动后页面空白其实是跨域配置漏写了端口。适合刚做完 Java Web 课设、想快速验证养老业务逻辑的学生也适合需要给小微养老机构搭轻量管理后台的外包工程师——它不追求高并发或微服务但每个模块入住登记、护理排班、费用结算都带真实字段约束和基础校验不是空壳 CRUD。2. 拆包即用从 ZIP 解压到前后端联调的六步实操链2.1 解压结构解析识别核心文件与隐藏依赖关系拿到养老院管理系统.zip后先别急着mvn clean install。用任意解压工具打开你会看到典型分层结构├── backend/ # Spring Boot 后端工程Maven 项目 │ ├── pom.xml │ ├── src/main/java/com/example/nursing/ │ └── src/main/resources/application.yml ├── frontend/ # Vue 3 前端工程Vite 构建 │ ├── package.json │ ├── vite.config.ts │ └── src/api/request.ts ├── docs/ # 说明文档含数据库 ER 图与字段说明 │ └── 系统说明文档.md ├── sql/ # 关键数据库脚本非单个 .sql而是多文件 │ ├── init_db.sql # 创建库 用户权限常被忽略 │ ├── create_table.sql # 建表语句含外键约束 │ └── init_data.sql # 基础数据管理员账号、房间类型、护理等级 └── README.md # 作者写的启动步骤但缺关键参数说明提示sql/目录下三个文件有严格执行顺序——init_db.sql必须最先运行否则create_table.sql会因数据库不存在报错init_data.sql里的管理员密码是明文123456上线前必须改但测试阶段留着能跳过登录页直接进后台。2.2 后端环境准备Spring Boot 版本兼容性与 JDK 选择项目pom.xml中spring-boot.version标注为2.7.18这是 Spring Boot 2.x 最终维护版这意味着JDK 必须用 8 或 17若你本地装的是 JDK 21mvn compile会直接失败报错Unsupported class file major version 65MySQL 驱动要匹配pom.xml里mysql-connector-java版本是8.0.33对应 MySQL 5.7 或 8.0若你用 MySQL 5.6需降级驱动到5.1.49并改url参数关键依赖不能删spring-boot-starter-data-jpa和spring-boot-starter-web是核心但spring-boot-starter-thymeleaf在本项目中未使用前端是 Vue删掉不影响运行但spring-boot-starter-validation必须保留——入住登记的身份证号校验靠它。执行以下命令验证环境# 检查 JDK 版本必须输出 1.8.x 或 17.x java -version # 进入 backend 目录检查 Maven 是否识别 Spring Boot 插件 cd backend mvn help:effective-pom | grep spring-boot-maven-plugin若effective-pom输出中spring-boot-maven-plugin版本是2.7.18说明 Maven 正确加载了父 POM。2.3 数据库初始化三步执行 SQL 脚本的精确顺序很多翻车源于把sql/下所有.sql文件一股脑拖进 Navicat 执行。正确流程是先运行init_db.sql创建数据库 授权用户-- init_db.sql 内容节选注意用户名/密码可改但 application.yml 必须同步 CREATE DATABASE IF NOT EXISTS nursing_db CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci; CREATE USER nursing_userlocalhost IDENTIFIED BY Nursing123!; GRANT ALL PRIVILEGES ON nursing_db.* TO nursing_userlocalhost; FLUSH PRIVILEGES;参数说明nursing_user和Nursing123!是脚本预设的账号密码application.yml中spring.datasource.username/password必须与之完全一致包括大小写和符号。再执行create_table.sql建表 外键注意此文件开头有USE nursing_db;确保当前连接的是上一步创建的库。最后执行init_data.sql插入基础数据其中sys_user表插入的管理员账号是INSERT INTO sys_user (username, password, real_name, phone, role_id) VALUES (admin, $2a$10$ZzXqYvQbRcSdTeUfVgWhXiYjKlMnOpQrStUvWxYzAbCdEfGhIjKlM, 张院长, 13800138000, 1);密码是 BCrypt 加密后的123456登录时输123456即可。2.4 前端启动Vue 3 Vite 的代理配置与 API 路径修正前端frontend/是 Vue 3 Vite 项目package.json中scripts定义了dev启动命令。但默认vite.config.ts的代理配置是// vite.config.ts 节选原始内容 export default defineConfig({ server: { proxy: { /api: { target: http://localhost:8080, // Spring Boot 默认端口 changeOrigin: true, rewrite: (path) path.replace(/^\/api/, ) } } } })问题在于如果你修改了 Spring Boot 的server.port比如改成8081这里必须同步改target否则所有请求 404。更稳妥的做法是——在src/api/request.ts中硬编码 baseURL// src/api/request.ts import axios from axios // 改为动态读取环境变量推荐 const BASE_URL import.meta.env.VUE_APP_API_BASE_URL || http://localhost:8080 const request axios.create({ baseURL: BASE_URL, // ← 关键所有 API 请求前缀 timeout: 10000 })然后在项目根目录新建.env.developmentVUE_APP_API_BASE_URLhttp://localhost:8080这样改完只需重启npm run dev无需碰vite.config.ts。2.5 前后端联调验证登录接口与 Token 传递机制启动顺序必须是先启动后端再启动前端。后端启动后访问http://localhost:8080/swagger-ui.html若springdoc-openapi-ui依赖存在或直接调用登录接口# 用 curl 测试后端是否就绪返回 200 且有 token curl -X POST http://localhost:8080/api/login \ -H Content-Type: application/json \ -d {username:admin,password:123456}预期响应{ code: 200, msg: 登录成功, data: { token: eyJhbGciOiJIUzUxMiJ9.xxxxx, user: { id: 1, username: admin, realName: 张院长 } } }前端登录页提交后会将token存入localStorage并设置Authorization请求头。若登录成功但跳转到 404 页面大概率是router/index.ts中路由守卫没放行/login或main.ts里createApp(App).mount(#app)前漏了app.use(store)。3. 配置文件深度拆解application.yml 与 vue.config.js 的 7 处必改参数3.1 Spring Boot 的 application.yml5 个影响启动的关键字段backend/src/main/resources/application.yml是后端生命线以下字段必须按你本地环境修改字段原始值必改原因修改建议spring.datasource.urljdbc:mysql://localhost:3306/nursing_db?useUnicodetruecharacterEncodingUTF-8serverTimezoneAsia/Shanghai若 MySQL 用 Docker 运行localhost应改为host.docker.internalMac/Win或172.17.0.1Linuxjdbc:mysql://127.0.0.1:3306/nursing_db?...确保端口开放spring.datasource.usernamenursing_user必须与init_db.sql创建的用户名一致保持原值除非你改了 SQL 脚本spring.datasource.passwordNursing123!密码含!符号YAML 解析需加引号Nursing123!加双引号spring.redis.hostlocalhost若未装 Redis此处会导致启动失败注释掉整段spring.redis配置项目实际未用 Redis 缓存logging.level.com.example.nursingdebug开发期有用但上线必须关否则日志爆炸改为info血泪经验spring.redis.host不注释会导致Caused by: java.net.ConnectException: Connection refused报错即使你根本没在代码里调 Redis——因为 Spring Boot 自动配置会尝试连接。3.2 Vue 的 vite.config.ts代理失效的 2 个隐藏陷阱frontend/vite.config.ts的代理看似简单但有两个坑changeOrigin: true不生效原因target值末尾不能带/。错误写法target: http://localhost:8080/→ 正确写法target: http://localhost:8080。跨域请求仍被拦截检查浏览器 Network 面板若请求 URL 显示http://localhost:3000/api/login而非代理后的http://localhost:8080/api/login说明代理未触发。此时需确认请求路径是否以/api开头request.ts中baseURL不能设为/api否则双重/apivite.config.ts是否在defineConfig({})内部而非外部。3.3 数据库脚本字段映射实体类与 SQL 的 3 处常见不一致backend/src/main/java/com/example/nursing/entity/User.java与sql/create_table.sql的字段必须严格对应否则 JPA 启动报Unknown column xxx in field list。常见不一致点实体类字段SQL 字段名问题修复方式idCard驼峰id_card下划线JPA 默认开启spring.jpa.hibernate.naming.physical-strategyorg.springframework.boot.orm.jpa.hibernate.SpringPhysicalNamingStrategy会自动转驼峰为下划线保持 SQL 用id_card实体类用idCard无需改注解createTimecreate_time同上自动映射正常✅ 无需改statusint 类型statustinyint(1)MySQL 的tinyint(1)在 Java 中映射为Boolean但实体类声明为Integer→ 启动报错将实体类字段改为private Boolean status;或 SQL 中status类型改为int4. 避坑指南部署与调试中高频翻车的 5 个现象及根因定位4.1 现象后端启动成功但 Swagger UI 打不开显示 404原因pom.xml中springdoc-openapi-ui依赖版本与 Spring Boot 2.7.x 不兼容。原始依赖可能是1.6.14但该版本要求 Spring Boot ≥ 2.6.0 且需额外配置。解决升级依赖至1.6.14并添加配置!-- backend/pom.xml -- dependency groupIdorg.springdoc/groupId artifactIdspringdoc-openapi-ui/artifactId version1.6.14/version /dependency在application.yml中加入springdoc: api-docs: path: /v3/api-docs swagger-ui: path: /swagger-ui.html config-url: /v3/api-docs/swagger-config4.2 现象Vue 页面空白控制台报Failed to resolve component: Layout原因src/router/index.ts中路由配置引用了/layout/Layout.vue但该文件在frontend/src/layout/目录下不存在ZIP 包中漏传。解决从docs/系统说明文档.md的「目录结构」章节找到Layout.vue的伪代码或直接复制src/views/Home.vue内容新建src/layout/Layout.vue内容为template div classlayout router-view / /div /template4.3 现象登录成功后跳转到/dashboard但页面显示 “404 Not Found”原因src/router/index.ts中children路由未正确注册或asyncRoutes动态路由加载失败。排查在router.beforeEach守卫中加console.log(to)确认to.path是否为/dashboard检查src/router/modules/dashboard.ts是否导出dashboardRouter对象并在index.ts中addRoute(dashboardRouter)。4.4 现象MySQL 启动时报The last packet sent successfully to the server was 0 milliseconds ago原因application.yml中spring.datasource.url的serverTimezoneAsia/Shanghai参数在 MySQL 8.0.22 版本中已废弃新版本要求serverTimezoneGMT%2B8。解决将 URL 中Asia/Shanghai替换为GMT%2B8注意%2B是的 URL 编码spring.datasource.url: jdbc:mysql://localhost:3306/nursing_db?...serverTimezoneGMT%2B84.5 现象npm run build后静态资源路径错乱CSS/JS 404原因vite.config.ts中build.outDir设为dist但index.html中资源引用路径是相对路径部署到非根目录如 Nginx 的/nursing/路径时失效。解决在vite.config.ts中添加export default defineConfig({ base: ./, // ← 关键生成相对路径 build: { outDir: dist, assetsDir: assets } })构建后将dist目录整体放入 Nginx 的html/nursing/目录即可。5. 生产就绪改造从毕业设计到可交付系统的 3 项关键加固5.1 密码安全加固BCrypt 加盐强度与登录失败锁定原始系统用 BCrypt 加密密码但UserServiceImpl.java中硬编码了BCryptPasswordEncoder(10)。强度 10 是安全底线但生产环境建议升到 12// backend/src/main/java/com/example/nursing/service/impl/UserServiceImpl.java Bean public PasswordEncoder passwordEncoder() { return new BCryptPasswordEncoder(12); // ← 从 10 改为 12 }同时为防暴力破解需增加登录失败次数限制。在LoginController.java的login()方法中加入// 检查用户 15 分钟内失败次数 String key login_fail: username; Long failCount redisTemplate.opsForValue().increment(key, 1); redisTemplate.expire(key, 15, TimeUnit.MINUTES); if (failCount ! null failCount 5) { throw new RuntimeException(登录失败超过 5 次请 15 分钟后再试); }注意此代码需redisTemplateBean若你已注释spring.redis配置则必须启用 Redis 并安装服务。5.2 日志脱敏防止身份证号、手机号明文打印application.yml中logging.level.rootinfo会导致User实体类的idCard、phone字段在日志中明文输出。在User.java中添加ToString.Exclude若用 Lombokimport lombok.Data; import lombok.ToString; Data ToString(exclude {idCard, phone}) public class User { private String idCard; // ← 不在 toString() 中输出 private String phone; }更彻底的方式是在logback-spring.xml中配置 Patternencoder pattern%d{yyyy-MM-dd HH:mm:ss.SSS} [%thread] %-5level %logger{50} - %msg%xEx{full}%n/pattern /encoder并自定义SensitiveDataFilter过滤器但对毕业设计级别项目Lombok 注解已足够。5.3 前端构建优化Vue Router 的懒加载与 Gzip 压缩frontend/src/router/index.ts中所有路由应改为异步组件避免首屏加载过重// 原写法同步 { path: /dashboard, component: () import(/views/Dashboard.vue) } // 改为带 loading 提示 { path: /dashboard, name: Dashboard, component: () import(/views/Dashboard.vue).catch(() import(/views/Error.vue)) }构建后启用 Gzip在vite.config.ts中添加插件import { createGzipPlugin } from vite-plugin-gzip export default defineConfig({ plugins: [ createGzipPlugin({ threshold: 10240, // 大于 10KB 的文件才压缩 verbose: true, dest: dist.gz // 压缩后文件存放目录 }) ] })Nginx 配置中开启gzip on;即可生效。6. 我的部署 checklist每次上线前强制执行的 8 项验证动作从第一次部署养老院系统翻车开始我就把这 8 条写进了团队 SOP 文档。现在每次交付新客户我都会在本地虚拟机里走一遍哪怕只是改了个按钮颜色——因为生产环境的「小改动」90% 的故障都源于某条 checklist 没执行。6.1 数据库层面3 项不可跳过的校验检查项执行命令期望结果不通过后果表字符集是否为 utf8mb4SHOW CREATE TABLE sys_user;ENGINEInnoDB DEFAULT CHARSETutf8mb4 COLLATEutf8mb4_unicode_ci中文姓名、emoji 存储乱码外键约束是否启用SELECT CONSTRAINT_NAME, CONSTRAINT_TYPE FROM information_schema.TABLE_CONSTRAINTS WHERE TABLE_SCHEMAnursing_db AND CONSTRAINT_TYPEFOREIGN KEY;至少返回room_id、user_id等 5 条外键删除老人时可能误删房间数据管理员密码是否已重置SELECT username, password FROM sys_user WHERE usernameadmin;password字段值 ≠$2a$10$ZzXqYvQbRcSdTeUfVgWhXiYjKlMnOpQrStUvWxYzAbCdEfGhIjKlM安全审计直接不通过6.2 后端服务2 项启动后必测接口用 Postman 或 curl 验证健康检查接口GET http://localhost:8080/actuator/health→ 返回{status:UP}登录接口POST http://localhost:8080/api/loginBody{username:admin,password:123456}→ 返回code:200且data.token非空。后悔药如果登录接口返回401 Unauthorized立刻检查application.yml中spring.security.user.name/password是否被意外启用该项目未用 Spring Security Basic Auth应注释掉相关配置。6.3 前端交付3 项上线前必做操作构建产物体积分析运行npm run build npx source-map-explorer dist/assets/*.js确认vendor包 ≤ 800KB过大需拆包静态资源路径验证打开dist/index.html检查link href/assets/index.xxxxx.css中的href是否为相对路径./assets/...Token 持久化测试登录后关闭浏览器再打开localStorage.getItem(token)应存在且未过期JWT 默认 2 小时。从那以后我每次交付前都强制走一遍这个 checklist——不是为了显得严谨而是因为去年在城郊养老院上线当天就因漏查「外键约束」导致护理排班表删除时连带清空了全部老人档案重跑init_data.sql花了 3 小时。希望帮到你。本文还有配套的精品资源点击获取
阅读完成 · 觉得有帮助?
咨询建站