尧图网页设计 
简介这是一套基于SpringBoot与Vue的房屋租赁管理系统完整源码包面向Java毕业设计、课程设计及初入行的Web开发者。系统采用B/S架构与MVC分层设计后端使用SpringBoot、Mybatis与MySQL前端使用Vue覆盖租赁管理场景下的核心业务逻辑可作为理解前后端分离项目与管理系统开发流程的参考。资源包约18MB共892个文件以162个Java源码文件、56个Vue组件、152个JavaScript脚本、56个HTML页面、44个CSS样式为主另包含XML、YML等配置文件并附带一键启动与初始化脚本便于在IDEA或Eclipse中快速部署运行。包内还整合了项目文档与说明文件梳理了系统架构与功能模块。目前已有60人学习浏览适合正在搭建管理系统类毕设或希望掌握主流框架整合流程的开发者。通过阅读源码目录与配置文件可以较快理清前后端交互、权限设计与数据库表结构对独立完成同类项目有直接参考价值。1. 一套能跑的房屋租赁系统先看它拆成了什么一个毕设级房屋租赁系统真正拉开差距的不是代码量而是业务链路能不能闭环。这套基于 SpringBoot MyBatis Vue 的源码目录里躺着一堆.bak备份比如update-password.vue.bak、IndexAsideStatic.vue.bak说明它经历过真实开发中反复改版的动作。它的核心价值在于前端 Vue 组件、后端 Java 接口、MySQL 表结构三部分都有可运行雏形覆盖房源发布、预约看房、合同管理等场景。这正好满足三类人需要 Java Web 毕设源码的学生、想快速熟悉 SpringBoot 工程落地的初级开发、以及用一套真实 Web 项目做二次改造的从业者。下文直接按“工程结构 → 环境搭建 → 核心实现 → 部署排错”拆给你看。2. 技术选型与工程结构SpringBoot MyBatis Vue 的分工边界2.1 为什么是 SpringBoot MyBatis 而不是 JPA房屋租赁系统的查询条件变化特别频繁租客按区域筛、按价格区间筛、按户型筛管理员还要按录入时间、审核状态筛。JPA/Hibernate 这类全自动 ORM 在简单 CRUD 上确实省事但一旦涉及多个可选条件的组合查询要么写复杂的 Specification要么退回到原生 SQL反而绕。MyBatis 干脆把 SQL 的编写权交还给开发者配合if、where标签做动态 SQL改一个筛选条件基本就是改一行标签。SpringBoot 在这套组合里负责把数据源、事务、SpringMVC 的配置全部托管让项目从配置地狱里解放出来。JDK1.8 环境下Spring Boot 2.3.x MyBatis starter 2.2.x MySQL 5.7 是非常稳的搭配Tomcat 8/9 都能直接承载。一个标准 web 工程的pom.xml里这段依赖是最小集合dependency groupIdorg.springframework.boot/groupId artifactIdspring-boot-starter-web/artifactId /dependency dependency groupIdorg.mybatis.spring.boot/groupId artifactIdmybatis-spring-boot-starter/artifactId version2.2.2/version /dependency dependency groupIdmysql/groupId artifactIdmysql-connector-java/artifactId scoperuntime/scope /dependency逻辑说明spring-boot-starter-web引入内嵌 Tomcat 和 SpringMVCmybatis-spring-boot-starter负责把 Mapper 接口代理和 SqlSessionFactory 注册进容器mysql-connector-java是运行时驱动。参数上不要把 MyBatis starter 的版本随便升太高2.3.x 对应 Spring Boot 2.7如果父工程还在 2.3.x容易引发 servlet API 版本冲突所以 2.2.2 是这组合里的保守选择。2.2 B/S 架构下的前后端共存方式摘要里写了“架构:B/S、MVC”这里容易让人疑惑有 Vue 组件怎么还是 MVC实际上这套项目是“非前后端分离的混合模式”。src/main/resources/static下放着编译后的index.html和 JS/CSS 文件Vue 组件在开发时通过npm run build打进 static 目录后端直接以静态资源方式访问浏览器打开http://localhost:8080就能看到整个界面不需要额外启动 Node 服务。这个方案的好处是部署简单一个 Tomcat/内嵌容器搞定缺点是前端改动需要重新构建不适合复杂团队协作。对于毕设和课程设计这条路最省心。目录结构和备份文件的作用可以从下面这张表看清楚路径或文件名角色说明src/main/java后端代码Controller、Service、Mapper 三层结构src/main/resources/application.yml配置端口、数据源、MyBatis 映射位置src/main/resources/static/app.816b774e.css前端构建产物Vue 打包后的 CSShash 用于缓存控制src/main/resources/static/index.html入口页后端根路径访问时返回的 HTML 模板*.vue.bak / *.html.bak前端源文件备份对应组件的开发版供参考或恢复实际开发中我一般会把.vue源文件放在独立frontend/目录维护开发期用 devServer 代理后端发布时再构建到 static。这套源码里看到index.html.bak和update-password.vue.bak说明作者在改版过程中保留了旧版用的时候可以直接把.bak去掉恢复或者参考其中组件写法迁移到自己的工程。2.3 从备份文件反推功能模块单看这几个文件名就能猜到前端框架的大致骨架IndexAsideStatic.vue侧边栏菜单通常用el-menu渲染用于切换房源、预约、合同等页面。BreadCrumbs.vue面包屑导航根据路由meta自动生成层级。IndexHeader.vue顶部栏一般放系统标题、用户下拉框含退出登录。update-password.vue修改密码对话框调后端/api/user/updatePassword接口。这说明项目至少有一个管理员端布局后端也有对应用户/权限模块。至于房东和租客的角色一般会通过 user 表里的role字段区分或者在预约流程中用两个独立入口实现。接下来我们直接看环境怎么跑起来。3. 环境搭建与一键启动脚本里的隐藏信息3.1 版本匹配表摘要给了一套非常具体的环境JDK1.8、Maven3.6、MySQL5.7、Tomcat 8/9。为什么要这么配JDK1.8 是 Spring Boot 2.x 的最低要求MySQL5.7 对utf8mb4和 JSON 类型的支持足够Maven3.6 和 Spring Boot 2.3.x 的插件兼容性公认最稳定。如果把 MySQL 换成 8.0需要把驱动改为com.mysql.cj.jdbc.Driver并且连接串里要加serverTimezoneAsia/Shanghai否则报时间区错误。如果你用 IDEA 自带的 Maven 版本过高遇到org.apache.maven.artifact.transfer相关报错建议直接切回 3.6.3。软件推荐版本关键配置JDK1.8JAVA_HOME 指向 jdk1.8 根目录Maven3.6.3settings.xml 配置阿里云镜像MySQL5.7字符集设为 utf8mb4Tomcat8.5/9.0如果外置部署端口 8080IDEA2019/2020确保 Project SDK 为 1.8这里要特别提醒不要只看大版本。Spring Boot 2.3.x 在 Maven 3.8.x 上打包时可能遇到maven-resources-plugin版本异常最省事的方案是下载 Maven 3.6.3 后在 IDEA 的 Settings 里指定为当前项目的 Maven home。数据库这边SQLyog 或 Navicat 连接 MySQL 5.7 时如果报 “Public Key Retrieval is not allowed”是连接串缺allowPublicKeyRetrievaltrue后续在 3.3 里一并说明。3.2 1-install.bat 和 2-run.bat 的等价逻辑源码根目录放着1-install.bat和2-run.bat看名字就是典型的 Windows 一键部署。1-install.bat做的是“初始化和打包”2-run.bat做的是“启动服务”。常见写法如下echo off set JAVA_HOMEC:\Program Files\Java\jdk1.8.0_202 set MAVEN_HOMED:\apache-maven-3.6.3 set PATH%JAVA_HOME%\bin;%MAVEN_HOME%\bin;%PATH% echo [1/2] installing dependencies... mvn clean install -DskipTests echo [2/2] build finished, please run 2-run.bat pauseecho off cd /d %~dp0 set JAVA_HOMEC:\Program Files\Java\jdk1.8.0_202 java -jar target\house-rental-0.0.1-SNAPSHOT.jar pause逻辑说明第一条脚本用mvn clean install -DskipTests跳过测试执行把 jar 生成到 target 目录第二条脚本用java -jar启动内嵌 Tomcatcd /d %~dp0是切换到脚本所在目录避免相对路径偏差。注意-DskipTests只跳过测试执行仍会编译测试类如果测试类有语法错误还是会失败可以改成-Dmaven.test.skiptrue彻底跳过测试编译。开发中如果不想每次 full install直接mvn spring-boot:run也可以启动效果一样区别在于前者会先打包成可执行 jar后者直接编译运行。3.3 数据库初始化与字符集坑系统导入 MySQL 脚本时通常在 sql 目录下或者根目录的house_rental.sql。用 SQLyog/Navicat 导入前一定要先创建库指定utf8mb4否则后面中文乱码很难查CREATE DATABASE IF NOT EXISTS house_rental DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci; USE house_rental; SOURCE D:/sql/house_rental.sql;然后application.yml里的数据源配置server: port: 8080 spring: datasource: url: jdbc:mysql://localhost:3306/house_rental?useSSLfalsecharacterEncodingutf8serverTimezoneAsia/Shanghai username: root password: 123456 driver-class-name: com.mysql.jdbc.Driver注意serverTimezoneAsia/Shanghai是 MySQL 8.0 驱动需要的5.7 低版本驱动不识别也没关系useSSLfalse是防止本地连接时 SSL 警告刷屏。如果导入后发现中文乱码先查建库字符集再查连接串里是不是漏了characterEncodingutf8。另外MyBatis 还需要在配置里声明 XML 位置mybatis.mapper-locationsclasspath:mapper/*.xml否则后面 4.2 的动态 SQL 无法被扫描到。4. 核心业务与接口实现从房源发布到预约看房的状态流转4.1 分层设计Controller-Service-Mapper房源模块是整套系统的门面采用标准 MVC 分层。Controller 只接收参数、返回 JSONService 处理业务规则比如房源状态校验、关联预约Mapper 负责 SQL 交互。下面是一个典型的房源列表接口RestController RequestMapping(/api/house) public class HouseController { private final HouseService houseService; public HouseController(HouseService houseService) { this.houseService houseService; } GetMapping(/list) public ResultPageResultHouseVO list(RequestParam(defaultValue 1) Integer page, RequestParam(defaultValue 10) Integer size, HouseQueryDto query) { PageResultHouseVO page houseService.queryPage(page, size, query); return Result.success(page); } }注意这里用的是构造器注入而不是字段Autowired好处是单元测试时可以手动new也便于final修饰避免属性被重新赋值。RequestParam里的defaultValue保证了参数缺失时前端零报错。HouseQueryDto通常包含 keyword、houseType、minPrice、maxPrice、status由前端表单直接绑过来。Service 内部判断 DTO 里的字段是否为空再传给 Mapper。这套模式在 java 面试八股文里叫“控制层薄、业务层厚”代码可读性和可测性都会好很多。4.2 MyBatis 动态 SQL 实现多条件筛选房源列表页一般有“区域、户型、租金区间、朝向”等筛选项每个条件都是可选的。用 MyBatis 的where和if写起来最干净select idselectHouseList resultTypecom.example.entity.House SELECT id, title, area_id, price, house_type, status, create_time FROM house where if testquery.keyword ! null and query.keyword ! AND title LIKE CONCAT(%, #{query.keyword}, %) /if if testquery.houseType ! null AND house_type #{query.houseType} /if if testquery.minPrice ! null AND price #{query.minPrice} /if if testquery.maxPrice ! null AND price lt; #{query.maxPrice} /if if testquery.status ! null AND status #{query.status} /if /where ORDER BY create_time DESC LIMIT #{offset}, #{limit} /select逻辑说明where会自动去掉第一个多余的 AND避免手抖在 if 里多写。if判断的是 DTO 字段是否为空存在才进入条件#{query.minPrice}走 PreparedStatement能防止 SQL 注入千万不要用${}拼接。分页直接用LIMIT offset, limit是 MySQL 5.7 最原始的方式数据量超过一万条时建议改成 PageHelper 或基于主键游标分页否则深分页性能会明显下降。这里的lt;是 XML 中对的转义忘了转义会导致 MyBatis 解析失败。4.3 预约看房状态机与数据表设计租赁系统的核心业务闭环不只是展示房源还有“用户约看 → 房东确认 → 看房 → 成交”。状态字段建议用tinyint不要直接存中文否则状态增加时要改数据。预约表可以这样设计CREATE TABLE appointment ( id int NOT NULL AUTO_INCREMENT, house_id int NOT NULL COMMENT 房源ID, user_id int NOT NULL COMMENT 租客用户ID, appoint_time datetime DEFAULT NULL COMMENT 预约看房时间, status tinyint NOT NULL DEFAULT 0 COMMENT 0待确认 1已确认 2已看房 3已取消 4已成交, remark varchar(255) DEFAULT NULL COMMENT 备注, create_time timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP, PRIMARY KEY (id), KEY idx_house_status (house_id, status) ) ENGINEInnoDB AUTO_INCREMENT1 DEFAULT CHARSETutf8mb4;状态流转可以约定为租客创建预约后status0房东确认后status1到了约定时间租客点“我已看房”status2线下签约后后台改为4取消则置为3。关键点是每次修改要带旧状态条件避免并发覆盖。比如确认操作应该执行UPDATE appointment SET status 1 WHERE id #{id} AND status 0;如果影响行数为 0说明该预约已经被取消或状态已变更Service 层要抛业务异常提示“预约已失效”。这正是 java 面试里常考的“乐观锁抵消并发更新”的应用场景只是在数据库层面用条件更新实现比在代码里加 synchronized 更可靠。状态值含义触发操作0待确认租客提交预约1已确认房东确认2已看房租客标记到达3已取消任意一方取消4已成交管理员/房东标记签约4.4 Vue 组件里怎么对接这些接口回到源码包里的.vue.bak文件前端这部分是 Element UI Vue 2 的标准写法。以update-password.vue为例逻辑是先校验两次密码一致再调用后端接口export default { data() { return { form: { oldPassword: , newPassword: , confirmPassword: } }; }, methods: { handleUpdate() { if (this.form.newPassword ! this.form.confirmPassword) { this.$message.error(两次输入密码不一致); return; } this.$http.post(/api/user/updatePassword, this.form) .then(() { this.$message.success(修改成功请重新登录); this.$router.push(/login); }) .catch(err { this.$message.error(err.response?.data?.message || 修改失败); }); } } };这里绑定了全局$http在项目入口main.js里通常用 axios 实例挂载到 Vue.prototype。/api前缀是前后端约定的接口前缀因为这套项目最终把前端构建进了static同源访问不存在跨域所以没有配代理。如果以后抽成独立前端工程开发就需要在 vue.config.js 里配devServer.proxy把/api转发到后端端口不然浏览器会直接拦截跨域请求。修改密码成功后跳登录页面是为了强制用户用新密码重新认证这也是后台管理系统的一个通用习惯。5. 部署到服务器Nginx 反向代理和跨域排查5.1 打包成 jar 还是 warSpring Boot 默认打成可执行 jar内置 Tomcat直接java -jar就能跑。如果按摘要说的外置 Tomcat 8/9需要改 packaging 为 war 并继承SpringBootServletInitializer但维护成本高不推荐。线上启动我一般用下面这行nohup java -jar house-rental-0.0.1-SNAPSHOT.jar --spring.profiles.activeprod logs/app.log 21 --spring.profiles.activeprod是启动参数指定加载application-prod.yml里的生产环境配置比如更严格的数据库密码和日志级别。nohup让进程在托管 shell 断开后继续运行 logs/app.log 21把标准输出和错误输出一起写入日志文件。新手最容易漏掉21一旦启动报错错误信息只在终端显示关掉终端就丢了排查时非常被动。启动后先看logs/app.log里的Started Application in xx seconds字段确认端口是否被占用。5.2 Nginx 下部署多个 Web 项目如果一台机器上既要跑用户端又要跑管理后台可以在 Nginx 里按路径分流这也是“Nginx 部署多个 Web 项目”最常见的做法。假设用户端监听 8080管理端监听 8081server { listen 80; server_name your.domain.com; location /rental/ { proxy_pass http://127.0.0.1:8080; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; } location /admin/ { proxy_pass http://127.0.0.1:8081; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; } }注意proxy_pass后面如果不带路径会把原始 URI 原样传过去Java 后端能拿到/rental/house/list的完整路径如果带上了/比如http://127.0.0.1:8080/原始 URI 里的/rental会被剥掉后端接口路由就匹配不上了。前端 axios 的baseURL也要对应加上/rental前缀否则 Nginx 找不到匹配的 location。调试时可以用curl http://127.0.0.1:8080/rental/house/list -H Host: your.domain.com验证转发是否正常。5.3 上线前要处理的三件小事以及源码改造技巧第一MySQL 5.7 的sql_mode如果包含ONLY_FULL_GROUP_BY而统计 SQL 没按聚合规则写会直接报语法错误。去 my.cnf 里查看并调整或者改 SQL。第二application.yml里不要写死生产密码用${DB_PASSWORD}占位部署时通过export DB_PASSWORDxxx注入避免源码泄露。第三日志别只落在后台在 logback.xml 里按天滚动至少保留 7 天避免磁盘被app.log撑满。源码改造时优先动带.bak的 Vue 组件。把.bak复制一份去掉后缀在对应组件里调整样式和字段然后重新执行npm run build生成的资源替换static目录。这样既保留了原备份又能在出错时快速回滚。开发时改完.vue源文件后留意static/下app.xxxxxxxx.css的 hash 值变化hash 变了说明新资源已生成浏览器强制刷新后就能命中新版本。本文还有配套的精品资源点击获取 SpringBoot+MyBatis+Vue房屋租赁系统实战：从工程结构到部署
简介这是一套基于SpringBoot与Vue的房屋租赁管理系统完整源码包面向Java毕业设计、课程设计及初入行的Web开发者。系统采用B/S架构与MVC分层设计后端使用SpringBoot、Mybatis与MySQL前端使用Vue覆盖租赁管理场景下的核心业务逻辑可作为理解前后端分离项目与管理系统开发流程的参考。资源包约18MB共892个文件以162个Java源码文件、56个Vue组件、152个JavaScript脚本、56个HTML页面、44个CSS样式为主另包含XML、YML等配置文件并附带一键启动与初始化脚本便于在IDEA或Eclipse中快速部署运行。包内还整合了项目文档与说明文件梳理了系统架构与功能模块。目前已有60人学习浏览适合正在搭建管理系统类毕设或希望掌握主流框架整合流程的开发者。通过阅读源码目录与配置文件可以较快理清前后端交互、权限设计与数据库表结构对独立完成同类项目有直接参考价值。1. 一套能跑的房屋租赁系统先看它拆成了什么一个毕设级房屋租赁系统真正拉开差距的不是代码量而是业务链路能不能闭环。这套基于 SpringBoot MyBatis Vue 的源码目录里躺着一堆.bak备份比如update-password.vue.bak、IndexAsideStatic.vue.bak说明它经历过真实开发中反复改版的动作。它的核心价值在于前端 Vue 组件、后端 Java 接口、MySQL 表结构三部分都有可运行雏形覆盖房源发布、预约看房、合同管理等场景。这正好满足三类人需要 Java Web 毕设源码的学生、想快速熟悉 SpringBoot 工程落地的初级开发、以及用一套真实 Web 项目做二次改造的从业者。下文直接按“工程结构 → 环境搭建 → 核心实现 → 部署排错”拆给你看。2. 技术选型与工程结构SpringBoot MyBatis Vue 的分工边界2.1 为什么是 SpringBoot MyBatis 而不是 JPA房屋租赁系统的查询条件变化特别频繁租客按区域筛、按价格区间筛、按户型筛管理员还要按录入时间、审核状态筛。JPA/Hibernate 这类全自动 ORM 在简单 CRUD 上确实省事但一旦涉及多个可选条件的组合查询要么写复杂的 Specification要么退回到原生 SQL反而绕。MyBatis 干脆把 SQL 的编写权交还给开发者配合if、where标签做动态 SQL改一个筛选条件基本就是改一行标签。SpringBoot 在这套组合里负责把数据源、事务、SpringMVC 的配置全部托管让项目从配置地狱里解放出来。JDK1.8 环境下Spring Boot 2.3.x MyBatis starter 2.2.x MySQL 5.7 是非常稳的搭配Tomcat 8/9 都能直接承载。一个标准 web 工程的pom.xml里这段依赖是最小集合dependency groupIdorg.springframework.boot/groupId artifactIdspring-boot-starter-web/artifactId /dependency dependency groupIdorg.mybatis.spring.boot/groupId artifactIdmybatis-spring-boot-starter/artifactId version2.2.2/version /dependency dependency groupIdmysql/groupId artifactIdmysql-connector-java/artifactId scoperuntime/scope /dependency逻辑说明spring-boot-starter-web引入内嵌 Tomcat 和 SpringMVCmybatis-spring-boot-starter负责把 Mapper 接口代理和 SqlSessionFactory 注册进容器mysql-connector-java是运行时驱动。参数上不要把 MyBatis starter 的版本随便升太高2.3.x 对应 Spring Boot 2.7如果父工程还在 2.3.x容易引发 servlet API 版本冲突所以 2.2.2 是这组合里的保守选择。2.2 B/S 架构下的前后端共存方式摘要里写了“架构:B/S、MVC”这里容易让人疑惑有 Vue 组件怎么还是 MVC实际上这套项目是“非前后端分离的混合模式”。src/main/resources/static下放着编译后的index.html和 JS/CSS 文件Vue 组件在开发时通过npm run build打进 static 目录后端直接以静态资源方式访问浏览器打开http://localhost:8080就能看到整个界面不需要额外启动 Node 服务。这个方案的好处是部署简单一个 Tomcat/内嵌容器搞定缺点是前端改动需要重新构建不适合复杂团队协作。对于毕设和课程设计这条路最省心。目录结构和备份文件的作用可以从下面这张表看清楚路径或文件名角色说明src/main/java后端代码Controller、Service、Mapper 三层结构src/main/resources/application.yml配置端口、数据源、MyBatis 映射位置src/main/resources/static/app.816b774e.css前端构建产物Vue 打包后的 CSShash 用于缓存控制src/main/resources/static/index.html入口页后端根路径访问时返回的 HTML 模板*.vue.bak / *.html.bak前端源文件备份对应组件的开发版供参考或恢复实际开发中我一般会把.vue源文件放在独立frontend/目录维护开发期用 devServer 代理后端发布时再构建到 static。这套源码里看到index.html.bak和update-password.vue.bak说明作者在改版过程中保留了旧版用的时候可以直接把.bak去掉恢复或者参考其中组件写法迁移到自己的工程。2.3 从备份文件反推功能模块单看这几个文件名就能猜到前端框架的大致骨架IndexAsideStatic.vue侧边栏菜单通常用el-menu渲染用于切换房源、预约、合同等页面。BreadCrumbs.vue面包屑导航根据路由meta自动生成层级。IndexHeader.vue顶部栏一般放系统标题、用户下拉框含退出登录。update-password.vue修改密码对话框调后端/api/user/updatePassword接口。这说明项目至少有一个管理员端布局后端也有对应用户/权限模块。至于房东和租客的角色一般会通过 user 表里的role字段区分或者在预约流程中用两个独立入口实现。接下来我们直接看环境怎么跑起来。3. 环境搭建与一键启动脚本里的隐藏信息3.1 版本匹配表摘要给了一套非常具体的环境JDK1.8、Maven3.6、MySQL5.7、Tomcat 8/9。为什么要这么配JDK1.8 是 Spring Boot 2.x 的最低要求MySQL5.7 对utf8mb4和 JSON 类型的支持足够Maven3.6 和 Spring Boot 2.3.x 的插件兼容性公认最稳定。如果把 MySQL 换成 8.0需要把驱动改为com.mysql.cj.jdbc.Driver并且连接串里要加serverTimezoneAsia/Shanghai否则报时间区错误。如果你用 IDEA 自带的 Maven 版本过高遇到org.apache.maven.artifact.transfer相关报错建议直接切回 3.6.3。软件推荐版本关键配置JDK1.8JAVA_HOME 指向 jdk1.8 根目录Maven3.6.3settings.xml 配置阿里云镜像MySQL5.7字符集设为 utf8mb4Tomcat8.5/9.0如果外置部署端口 8080IDEA2019/2020确保 Project SDK 为 1.8这里要特别提醒不要只看大版本。Spring Boot 2.3.x 在 Maven 3.8.x 上打包时可能遇到maven-resources-plugin版本异常最省事的方案是下载 Maven 3.6.3 后在 IDEA 的 Settings 里指定为当前项目的 Maven home。数据库这边SQLyog 或 Navicat 连接 MySQL 5.7 时如果报 “Public Key Retrieval is not allowed”是连接串缺allowPublicKeyRetrievaltrue后续在 3.3 里一并说明。3.2 1-install.bat 和 2-run.bat 的等价逻辑源码根目录放着1-install.bat和2-run.bat看名字就是典型的 Windows 一键部署。1-install.bat做的是“初始化和打包”2-run.bat做的是“启动服务”。常见写法如下echo off set JAVA_HOMEC:\Program Files\Java\jdk1.8.0_202 set MAVEN_HOMED:\apache-maven-3.6.3 set PATH%JAVA_HOME%\bin;%MAVEN_HOME%\bin;%PATH% echo [1/2] installing dependencies... mvn clean install -DskipTests echo [2/2] build finished, please run 2-run.bat pauseecho off cd /d %~dp0 set JAVA_HOMEC:\Program Files\Java\jdk1.8.0_202 java -jar target\house-rental-0.0.1-SNAPSHOT.jar pause逻辑说明第一条脚本用mvn clean install -DskipTests跳过测试执行把 jar 生成到 target 目录第二条脚本用java -jar启动内嵌 Tomcatcd /d %~dp0是切换到脚本所在目录避免相对路径偏差。注意-DskipTests只跳过测试执行仍会编译测试类如果测试类有语法错误还是会失败可以改成-Dmaven.test.skiptrue彻底跳过测试编译。开发中如果不想每次 full install直接mvn spring-boot:run也可以启动效果一样区别在于前者会先打包成可执行 jar后者直接编译运行。3.3 数据库初始化与字符集坑系统导入 MySQL 脚本时通常在 sql 目录下或者根目录的house_rental.sql。用 SQLyog/Navicat 导入前一定要先创建库指定utf8mb4否则后面中文乱码很难查CREATE DATABASE IF NOT EXISTS house_rental DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci; USE house_rental; SOURCE D:/sql/house_rental.sql;然后application.yml里的数据源配置server: port: 8080 spring: datasource: url: jdbc:mysql://localhost:3306/house_rental?useSSLfalsecharacterEncodingutf8serverTimezoneAsia/Shanghai username: root password: 123456 driver-class-name: com.mysql.jdbc.Driver注意serverTimezoneAsia/Shanghai是 MySQL 8.0 驱动需要的5.7 低版本驱动不识别也没关系useSSLfalse是防止本地连接时 SSL 警告刷屏。如果导入后发现中文乱码先查建库字符集再查连接串里是不是漏了characterEncodingutf8。另外MyBatis 还需要在配置里声明 XML 位置mybatis.mapper-locationsclasspath:mapper/*.xml否则后面 4.2 的动态 SQL 无法被扫描到。4. 核心业务与接口实现从房源发布到预约看房的状态流转4.1 分层设计Controller-Service-Mapper房源模块是整套系统的门面采用标准 MVC 分层。Controller 只接收参数、返回 JSONService 处理业务规则比如房源状态校验、关联预约Mapper 负责 SQL 交互。下面是一个典型的房源列表接口RestController RequestMapping(/api/house) public class HouseController { private final HouseService houseService; public HouseController(HouseService houseService) { this.houseService houseService; } GetMapping(/list) public ResultPageResultHouseVO list(RequestParam(defaultValue 1) Integer page, RequestParam(defaultValue 10) Integer size, HouseQueryDto query) { PageResultHouseVO page houseService.queryPage(page, size, query); return Result.success(page); } }注意这里用的是构造器注入而不是字段Autowired好处是单元测试时可以手动new也便于final修饰避免属性被重新赋值。RequestParam里的defaultValue保证了参数缺失时前端零报错。HouseQueryDto通常包含 keyword、houseType、minPrice、maxPrice、status由前端表单直接绑过来。Service 内部判断 DTO 里的字段是否为空再传给 Mapper。这套模式在 java 面试八股文里叫“控制层薄、业务层厚”代码可读性和可测性都会好很多。4.2 MyBatis 动态 SQL 实现多条件筛选房源列表页一般有“区域、户型、租金区间、朝向”等筛选项每个条件都是可选的。用 MyBatis 的where和if写起来最干净select idselectHouseList resultTypecom.example.entity.House SELECT id, title, area_id, price, house_type, status, create_time FROM house where if testquery.keyword ! null and query.keyword ! AND title LIKE CONCAT(%, #{query.keyword}, %) /if if testquery.houseType ! null AND house_type #{query.houseType} /if if testquery.minPrice ! null AND price #{query.minPrice} /if if testquery.maxPrice ! null AND price lt; #{query.maxPrice} /if if testquery.status ! null AND status #{query.status} /if /where ORDER BY create_time DESC LIMIT #{offset}, #{limit} /select逻辑说明where会自动去掉第一个多余的 AND避免手抖在 if 里多写。if判断的是 DTO 字段是否为空存在才进入条件#{query.minPrice}走 PreparedStatement能防止 SQL 注入千万不要用${}拼接。分页直接用LIMIT offset, limit是 MySQL 5.7 最原始的方式数据量超过一万条时建议改成 PageHelper 或基于主键游标分页否则深分页性能会明显下降。这里的lt;是 XML 中对的转义忘了转义会导致 MyBatis 解析失败。4.3 预约看房状态机与数据表设计租赁系统的核心业务闭环不只是展示房源还有“用户约看 → 房东确认 → 看房 → 成交”。状态字段建议用tinyint不要直接存中文否则状态增加时要改数据。预约表可以这样设计CREATE TABLE appointment ( id int NOT NULL AUTO_INCREMENT, house_id int NOT NULL COMMENT 房源ID, user_id int NOT NULL COMMENT 租客用户ID, appoint_time datetime DEFAULT NULL COMMENT 预约看房时间, status tinyint NOT NULL DEFAULT 0 COMMENT 0待确认 1已确认 2已看房 3已取消 4已成交, remark varchar(255) DEFAULT NULL COMMENT 备注, create_time timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP, PRIMARY KEY (id), KEY idx_house_status (house_id, status) ) ENGINEInnoDB AUTO_INCREMENT1 DEFAULT CHARSETutf8mb4;状态流转可以约定为租客创建预约后status0房东确认后status1到了约定时间租客点“我已看房”status2线下签约后后台改为4取消则置为3。关键点是每次修改要带旧状态条件避免并发覆盖。比如确认操作应该执行UPDATE appointment SET status 1 WHERE id #{id} AND status 0;如果影响行数为 0说明该预约已经被取消或状态已变更Service 层要抛业务异常提示“预约已失效”。这正是 java 面试里常考的“乐观锁抵消并发更新”的应用场景只是在数据库层面用条件更新实现比在代码里加 synchronized 更可靠。状态值含义触发操作0待确认租客提交预约1已确认房东确认2已看房租客标记到达3已取消任意一方取消4已成交管理员/房东标记签约4.4 Vue 组件里怎么对接这些接口回到源码包里的.vue.bak文件前端这部分是 Element UI Vue 2 的标准写法。以update-password.vue为例逻辑是先校验两次密码一致再调用后端接口export default { data() { return { form: { oldPassword: , newPassword: , confirmPassword: } }; }, methods: { handleUpdate() { if (this.form.newPassword ! this.form.confirmPassword) { this.$message.error(两次输入密码不一致); return; } this.$http.post(/api/user/updatePassword, this.form) .then(() { this.$message.success(修改成功请重新登录); this.$router.push(/login); }) .catch(err { this.$message.error(err.response?.data?.message || 修改失败); }); } } };这里绑定了全局$http在项目入口main.js里通常用 axios 实例挂载到 Vue.prototype。/api前缀是前后端约定的接口前缀因为这套项目最终把前端构建进了static同源访问不存在跨域所以没有配代理。如果以后抽成独立前端工程开发就需要在 vue.config.js 里配devServer.proxy把/api转发到后端端口不然浏览器会直接拦截跨域请求。修改密码成功后跳登录页面是为了强制用户用新密码重新认证这也是后台管理系统的一个通用习惯。5. 部署到服务器Nginx 反向代理和跨域排查5.1 打包成 jar 还是 warSpring Boot 默认打成可执行 jar内置 Tomcat直接java -jar就能跑。如果按摘要说的外置 Tomcat 8/9需要改 packaging 为 war 并继承SpringBootServletInitializer但维护成本高不推荐。线上启动我一般用下面这行nohup java -jar house-rental-0.0.1-SNAPSHOT.jar --spring.profiles.activeprod logs/app.log 21 --spring.profiles.activeprod是启动参数指定加载application-prod.yml里的生产环境配置比如更严格的数据库密码和日志级别。nohup让进程在托管 shell 断开后继续运行 logs/app.log 21把标准输出和错误输出一起写入日志文件。新手最容易漏掉21一旦启动报错错误信息只在终端显示关掉终端就丢了排查时非常被动。启动后先看logs/app.log里的Started Application in xx seconds字段确认端口是否被占用。5.2 Nginx 下部署多个 Web 项目如果一台机器上既要跑用户端又要跑管理后台可以在 Nginx 里按路径分流这也是“Nginx 部署多个 Web 项目”最常见的做法。假设用户端监听 8080管理端监听 8081server { listen 80; server_name your.domain.com; location /rental/ { proxy_pass http://127.0.0.1:8080; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; } location /admin/ { proxy_pass http://127.0.0.1:8081; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; } }注意proxy_pass后面如果不带路径会把原始 URI 原样传过去Java 后端能拿到/rental/house/list的完整路径如果带上了/比如http://127.0.0.1:8080/原始 URI 里的/rental会被剥掉后端接口路由就匹配不上了。前端 axios 的baseURL也要对应加上/rental前缀否则 Nginx 找不到匹配的 location。调试时可以用curl http://127.0.0.1:8080/rental/house/list -H Host: your.domain.com验证转发是否正常。5.3 上线前要处理的三件小事以及源码改造技巧第一MySQL 5.7 的sql_mode如果包含ONLY_FULL_GROUP_BY而统计 SQL 没按聚合规则写会直接报语法错误。去 my.cnf 里查看并调整或者改 SQL。第二application.yml里不要写死生产密码用${DB_PASSWORD}占位部署时通过export DB_PASSWORDxxx注入避免源码泄露。第三日志别只落在后台在 logback.xml 里按天滚动至少保留 7 天避免磁盘被app.log撑满。源码改造时优先动带.bak的 Vue 组件。把.bak复制一份去掉后缀在对应组件里调整样式和字段然后重新执行npm run build生成的资源替换static目录。这样既保留了原备份又能在出错时快速回滚。开发时改完.vue源文件后留意static/下app.xxxxxxxx.css的 hash 值变化hash 变了说明新资源已生成浏览器强制刷新后就能命中新版本。本文还有配套的精品资源点击获取