1. 项目背景与技术选型
相亲网站作为典型的社交类Web应用,对前后端分离架构有着天然的需求。这个基于SpringBoot+Vue的毕设项目采用主流技术栈实现,包含完整的用户管理、匹配算法、即时通讯等核心模块。我去年指导过3个类似项目的毕业设计,发现同学们最常卡壳的环节是前后端数据交互和权限控制,这个项目源码恰好提供了这些痛点的标准解决方案。
技术栈选择上,后端采用SpringBoot 2.7.x(当前企业主流版本)而非最新的3.x系列,这是考虑到毕业设计对稳定性的要求。数据库使用MySQL 8.0,前端搭配Vue 3 + Element Plus,整套技术栈版本经过严格兼容性测试。项目构建工具使用Maven而非Gradle,更符合国内高校的教学体系。
提示:源码中的pom.xml文件已配置好国内镜像源,解决学生群体常遇到的依赖下载慢问题
2. 系统架构与核心模块
2.1 分层架构设计
项目采用经典的三层架构:
- 表现层:Vue 3 + Axios + Element Plus
- 业务层:SpringBoot + MyBatis Plus
- 数据层:MySQL 8.0 + Redis缓存
特别值得注意的是match-algorithm模块,实现了基于标签匹配的推荐算法。核心类MatchingServiceImpl.java中使用了余弦相似度计算用户匹配度:
java复制// 核心匹配算法片段
public List<UserDTO> matchUsers(long userId) {
UserVector currentUser = vectorService.getUserVector(userId);
return userMapper.selectPotentialMatches()
.stream()
.map(user -> {
double similarity = cosineSimilarity(
currentUser.getVector(),
vectorService.getUserVector(user.getId()).getVector()
);
user.setMatchScore(similarity * 100);
return user;
})
.sorted(Comparator.comparing(UserDTO::getMatchScore).reversed())
.limit(20)
.collect(Collectors.toList());
}
2.2 数据库设计关键点
SQL脚本包含18张表,其中核心表关系如下:
| 表名 | 关键字段 | 索引设计 |
|---|---|---|
| user | id, username, tags, location | 联合索引(username,status) |
| match_record | user_id, matched_id, score | 外键+复合索引 |
| message | sender_id, receiver_id, content | 时间范围索引 |
数据库设计中容易踩坑的是user_tags字段的存储方式。项目采用JSON格式存储标签数组,既节省空间又便于查询:
sql复制CREATE TABLE `user` (
`id` bigint NOT NULL AUTO_INCREMENT,
`tags` json DEFAULT NULL COMMENT '用户标签数组',
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_0900_ai_ci;
3. 前后端交互实现
3.1 Axios封装与拦截器
前端src/api/request.js中对Axios进行了企业级封装,包含:
- 请求重试机制(网络波动时自动重试3次)
- 401状态码统一跳转登录页
- 文件上传进度监控
javascript复制const service = axios.create({
baseURL: process.env.VUE_APP_BASE_API,
timeout: 10000,
retry: 3,
retryDelay: 1000
})
service.interceptors.response.use(
response => response.data,
error => {
if (error.config?.retry) {
error.config.__retryCount = error.config.__retryCount || 0
if (error.config.__retryCount < error.config.retry) {
error.config.__retryCount++
return new Promise(resolve =>
setTimeout(() => resolve(service(error.config)), error.config.retryDelay)
)
}
}
return Promise.reject(error)
}
)
3.2 文件上传解决方案
相亲网站必备的照片上传功能采用分片上传方案:
- 前端通过
spark-md5计算文件指纹 - 后端使用Spring的
@RequestPart接收分片 - 通过Redis记录上传进度
关键代码在FileController.java中:
java复制@PostMapping("/upload")
public Result upload(@RequestPart MultipartFile file,
@RequestParam String md5,
@RequestParam Integer chunkIndex) {
String tempDir = "/tmp/upload/" + md5;
FileUtils.forceMkdir(new File(tempDir));
file.transferTo(new File(tempDir + "/" + chunkIndex));
// 更新Redis中的分片记录
redisTemplate.opsForSet().add("upload:" + md5, chunkIndex.toString());
return Result.success();
}
4. 典型业务场景实现
4.1 即时通讯模块
使用WebSocket实现实时聊天,核心类ChatEndpoint.java处理消息路由。为降低复杂度,没有引入STOMP协议,而是采用纯WebSocket+JSON格式消息:
java复制@ServerEndpoint("/chat/{userId}")
@Component
public class ChatEndpoint {
@OnMessage
public void onMessage(String jsonMsg, Session session) {
ChatMessage message = JSON.parseObject(jsonMsg, ChatMessage.class);
if ("heartbeat".equals(message.getType())) {
session.getAsyncRemote().sendText("{\"type\":\"pong\"}");
} else {
// 消息广播逻辑
broadcastMessage(message);
}
}
}
前端对应实现心跳检测机制,防止连接意外断开:
javascript复制setInterval(() => {
if (socket.readyState === WebSocket.OPEN) {
socket.send(JSON.stringify({ type: 'heartbeat' }))
}
}, 30000)
4.2 安全控制方案
采用JWT + RBAC权限模型,亮点在于动态权限控制:
- 后端通过
@PreAuthorize注解控制接口访问 - 前端路由根据权限数据动态生成
权限校验拦截器关键逻辑:
java复制public boolean preHandle(HttpServletRequest request,
HttpServletResponse response,
Object handler) {
String token = request.getHeader("Authorization");
Claims claims = JwtUtil.parseToken(token);
String uri = request.getRequestURI();
// 从Redis获取用户权限列表
Set<String> permissions = redisTemplate.opsForSet()
.members("user:perms:" + claims.getSubject());
if (!permissions.contains(uri)) {
throw new UnauthorizedException("无访问权限");
}
return true;
}
5. 项目部署与调试
5.1 多环境配置
项目提供三种环境配置方案:
- 开发环境:使用H2内存数据库
- 测试环境:连接本地MySQL
- 生产环境:支持Docker容器化部署
application.yml中通过Spring Profiles实现环境隔离:
yaml复制spring:
profiles:
active: dev
---
spring:
profiles: dev
datasource:
url: jdbc:h2:mem:testdb
---
spring:
profiles: prod
datasource:
url: jdbc:mysql://${DB_HOST:localhost}:3306/dating_db
5.2 常见问题排查
根据以往经验,学生运行项目时最常遇到的三个问题:
- 端口冲突:修改
server.port=8081后前端需要同步修改VUE_APP_BASE_API - 跨域问题:开发环境需配置
CorsConfig.java,生产环境应通过Nginx解决 - 时区问题:MySQL连接串需添加
serverTimezone=Asia/Shanghai
注意:如果遇到"Failed to configure a DataSource"错误,检查是否漏了
spring-boot-starter-jdbc依赖
6. 二次开发建议
对于想要扩展功能的同学,推荐以下几个方向:
- 增强匹配算法:在现有标签匹配基础上,加入行为数据分析(如浏览记录)
- 视频相亲功能:集成WebRTC实现实时视频通话
- 智能客服:接入开源NLP模型处理常见咨询
算法优化示例 - 混合加权匹配:
java复制public double enhancedMatchScore(User a, User b) {
double tagScore = cosineSimilarity(a.getTags(), b.getTags());
double behaviorScore = analyzeBehaviorSimilarity(a.getId(), b.getId());
return tagScore * 0.6 + behaviorScore * 0.4;
}
项目中的docs/目录下包含完整的接口文档(Swagger格式)和数据库字典,建议开发前先阅读。对于毕业答辩,重点准备技术选型依据和核心算法部分的讲解,这类实际项目经验往往能获得较高评分。
