ARTICLE DETAIL

建站实战干货

来自一线的建站与推广经验沉淀,每一条都经过真实交付验证。

SpringBoot3+Vue3+MySQL相亲系统源码 前后端分离实战项目

2026/8/2 16:35:01 拓冰建站 浏览量
SpringBoot3+Vue3+MySQL相亲系统源码 前后端分离实战项目

一、项目简介

这是一套基于 Spring Boot 3 + Vue 3 + MySQL 构建的相亲交友平台,采用前后端分离架构。系统包含普通用户端与管理员端两大角色,覆盖婚恋社交场景的完整业务链路:用户注册登录、个人资料与相册管理、择偶要求设置、多条件搜索与智能匹配、即时聊天、动态发布与互动(点赞/评论/通知)、收藏关注、举报反馈,以及管理员侧的用户管理、动态审核、举报处理、轮播图配置与系统设置。后端提供 RESTful API,前端通过 Vue Router 管理页面路由,Pinia 维护全局用户状态,整体代码结构清晰,适合作为毕业设计或企业级项目的二次开发基础。

二、技术栈

技术说明
后端框架Spring Boot 3
ORMMyBatis-Plus(分页插件、自动填充、逻辑删除)
权限认证JWT(jjwt)+ 自定义拦截器 AuthInterceptor
前端框架Vue 3(Composition API +<script setup>
状态管理Pinia(userStore)
路由Vue Router 4(createWebHistory)
UI 组件库Element Plus
构建工具Vite
数据库MySQL 8
文件上传MultipartFile 本地存储(uploads 目录)
工具库Hutool(MD5 加密)、Lombok

三、功能模块

管理员端

  • 系统数据看板:统计总用户数、男女用户数、VIP 用户数、今日新增用户数、动态总数、待处理举报数,以卡片形式展示核心运营指标。
  • 用户管理:支持按关键词(用户名/昵称/手机号)搜索、按状态(启用/禁用)筛选,分页展示用户列表;可执行禁用/启用、设置 VIP 等级(0-3)、删除用户、重置密码为 123456 等操作。
  • 动态审核:查看所有动态及其发布用户,按审核状态(待审核/通过/不通过)筛选;审核通过或不通过后,系统自动发送通知给动态作者。
  • 举报处理:按处理状态筛选举报列表,查看举报详情(被举报用户、举报原因、类型、举报人信息);填写处理结果后提交,系统自动发送通知给举报人。
  • 轮播图管理:按排序字段正序展示轮播图列表;支持新增(标题、图片 URL、链接 URL、排序、状态)、编辑、删除;可上传轮播图图片至本地存储。
  • 系统设置:查看所有系统配置项的键值对,支持修改指定配置项的 value 值,用于动态调整系统参数。

普通用户端

  • 注册与登录:注册时校验用户名唯一性,自动设置角色为 USER、状态为启用、VIP 等级为 0;登录使用用户名 + 密码,密码经 MD5 加密校验,成功后返回 JWT Token 及用户信息。
  • 个人资料管理:查看并编辑昵称、头像、性别、年龄、生日、身高、体重、学历、职业、收入、省/市、自我介绍、兴趣爱好等字段;修改密码需验证原密码。
  • 头像与相册:上传头像图片至本地 uploads 目录,返回可访问 URL 并更新用户头像字段;相册支持上传照片、查看照片列表、删除指定照片。
  • 择偶要求设置:保存/更新年龄范围(minAge/maxAge)、身高范围、学历、省/市、收入、描述等择偶条件,用于智能匹配和搜索筛选。
  • 多条件搜索用户:按关键词(昵称/职业/自我介绍)、性别、城市、学历、年龄范围组合筛选,分页返回结果。
  • 智能匹配:根据当前用户性别、城市、爱好、择偶要求等维度计算匹配度分数,按分数从高到低推荐最多 10 位候选人。
  • 用户详情与收藏:查看任意用户的基本资料、相册照片、择偶要求,同时返回是否已收藏;支持收藏/取消收藏,收藏列表按时间倒序展示。
  • 即时聊天:获取聊天列表(含最后一条消息及未读数);查看与某用户的聊天历史记录;发送文本消息;标记消息为已读。
  • 动态发布与互动:发布动态(文字 + 多图),初始状态为待审核;浏览已审核通过的动态列表(支持按用户筛选);点赞后点赞数 +1,若非作者则自动发送通知;评论后评论数 +1,若非作者则自动发送通知;可删除本人发布的动态。
  • 通知中心:查看系统通知、聊天消息提醒、动态互动通知列表(按时间倒序);查看未读通知数量、标记单条已读、一键全部已读。
  • 举报功能:选择被举报用户、填写举报原因、选择举报类型(如虚假信息/骚扰/诈骗),提交后状态为待处理。

四、项目总结

本系统的技术亮点在于:后端采用 Spring Boot 3 结合 MyBatis-Plus 的自动填充与逻辑删除,配合 JWT 拦截器实现无状态鉴权;前端使用 Vue 3 Composition API + Pinia 管理用户状态,Element Plus 提供统一 UI;智能匹配模块通过多维度权重计算匹配度,是业务逻辑中较有参考价值的部分。聊天模块、通知系统、动态审核流构成了完整的社交闭环。项目代码分层清晰(controller/service/mapper),注释完整,附带数据库初始化脚本,适合作为 Spring Boot 3 + Vue 3 全栈项目的学习范本,也可快速扩展为其他垂直社交领域的原型。

界面展示

交付内容

本项目为完整交付,包含:

  • 完整后端源码
  • 完整前端源码
  • 数据库初始化脚本(SQL)
  • 万字项目文档(设计文档 / 论文,可作课程设计、毕业设计参考)

获取完整源码

完整前后端源码 + 数据库脚本 + 万字项目文档见 Gitee 仓库:https://gitee.com/kangxihuang/src-K232