MinX System v8.0：从零构建一个现代内容创作与变现平台
本项目仅作技术交流--许多关键细节并没有实现不可上线运营
代码内容主要由AI生成和测试
项目概述
MinX System 是一个全栈内容创作与变现平台，支持创作者上传图文、视频、文章等多媒体内容，通过订阅制 + 单次付费 + 多级访问控制实现知识变现。项目采用前后端分离架构，后端基于 Spring Boot 3.3 + Java 21，前端基于 Vue 3 + TypeScript + Pinia，已通过 38 个自动化测试，代码量约 300 文件。
GitHub: jianmin5xin/Minx
技术栈一览
| 层级 | 技术选型 |
|---|---|
| 后端框架 | Spring Boot 3.3.0 |
| 语言版本 | Java 21 |
| 数据库 | H2 (开发) / MySQL (生产) |
| ORM | Spring Data JPA + Hibernate 6.5 |
| 安全 | Spring Security + JWT (双 Token 刷新) |
| 缓存 | Caffeine Cache |
| 搜索引擎 | Elasticsearch (可选) |
| 前端框架 | Vue 3 (Composition API) |
| 构建工具 | Vite 5 |
| 语言 | TypeScript 5 |
| 状态管理 | Pinia (13 个 Store) |
| 路由 | Vue Router 4 (懒加载 + 角色守卫) |
| PWA | vite-plugin-pwa |
| DevOps | Docker + CI/CD |
核心功能模块
1. 用户与认证系统
JWT 双 Token 机制：Access Token（短时效）+ Refresh Token（长时效），前端 Axios 拦截器自动检测 401 并静默刷新，请求队列去重
多角色体系：ROLE_USER / ROLE_ADMIN，路由级别守卫 + API 级别
@PreAuthorize个人资料管理：头像上传（multipart）、Bio、密码修改
多标签同步：Token 写入 localStorage 后通过
storage事件跨标签同步登录态
2. 资源管理与多级访问控制
这是平台的核心差异化能力。每个资源支持四种访问类型：
| 访问类型 | 规则 | 适用场景 |
|---|---|---|
| PUBLIC | 任何人可查看 | 免费引流内容 |
| LOGIN_REQUIRED | 需登录 | 注册用户专享 |
| MEMBERS_ONLY | 需订阅作者 | 粉丝专属内容 |
| PAID_ONLY | 需单独购买 | 高价精品内容 |
批量上传：支持拖拽 + 多文件 + 进度回调
三种资源类型：IMAGE / VIDEO / ARTICLE
内容审核流：DRAFT → PENDING_REVIEW → PUBLISHED / REJECTED
资源搜索：关键词 + 类型 + 访问级别多维度筛选，ES 全文搜索（可选）
文件存储：本地文件系统 + 缩略图自动生成
3. 订阅制付费体系
创作者可设置订阅价格（
subscriptionPrice）并开启订阅功能用户购买订阅后获得该创作者全部 MEMBERS_ONLY 内容访问权
支持订阅到期自动过期、退款等完整生命周期
4. 微信/支付宝钱包系统
v8.0 新增的完整钱包模块：
充值：模拟微信/支付宝扫码充值（可对接真实支付网关）
提现：用户申请提现 → 管理员审核 → 审批通过/拒绝
交易流水：完整的 WalletTransaction 记录，支持类型筛选
余额管理：充值、购买、退款、提现全链路余额变动追踪
5. 直播系统
多级访问控制：PUBLIC / SUBSCRIBERS / PAID / FRIENDS
直播购买：付费直播支持单次购买后观看
实时状态管理：LiveStreamStore 管理直播列表与当前直播状态
前端页面：LiveStreamPage（直播列表） + LiveStreamViewer（直播观看）
6. 评论与互动系统
嵌套回复：支持多层级回复，前端递归渲染
评论点赞：独立点赞系统，资源与评论分别管理
用户屏蔽：创作者可屏蔽特定用户评论
评论分页：后端分页 + 前端加载更多
7. 消息与通知系统
一对一私信：对话列表 + 聊天气泡 + 回车发送 + 自动滚动到底部
未读计数：导航栏铃铛 Badge 实时显示
通知类型：评论回复、点赞、订阅、购买等事件通知
冷消息限制：未互关用户每天 3 条消息限额
8. 管理后台
仪表盘：用户数、资源数、订单数、收入概览
用户管理：封禁/解封、强制删除
资源审核：待审核列表、通过/驳回、审核备注
订单管理：全部订单查看、退款处理
举报处理：举报列表、处理标记
站点配置：系统参数动态调整
数据统计：用户增长趋势、热门资源排行
后端架构
分层设计
Controller 层 (24 个 REST 控制器) ↓ Service 层 (业务逻辑 + 事务管理) ↓ Repository 层 (Spring Data JPA + 自定义查询) ↓ Entity 层 (JPA 实体映射)
安全架构
Client Request → CORS Filter → Rate Limit Filter (300 req/min) → JWT Authentication Filter → Authorization Filter (@PreAuthorize) → Controller → Service → Repository
关键控制器
| 控制器 | 端点前缀 | 核心功能 |
|---|---|---|
| AuthController | /api/auth | 注册、登录、Token 刷新 |
| ResourceController | /api/resources | 资源 CRUD、搜索、审核 |
| PaymentController | /api/payment | 微信/支付宝充值、提现 |
| WalletController | /api/wallet | 钱包余额、交易流水 |
| LiveStreamController | /api/livestreams | 直播创建、购买、观看 |
| CommentController | /api/resources/{id}/comments | 评论、屏蔽、点赞 |
| SubscriptionController | /api/subscriptions | 订阅管理 |
| OrderController | /api/orders | 订单管理、退款 |
| AdminController | /api/admin | 管理后台聚合接口 |
| StatisticsController | /api/statistics | 数据统计 |
前端架构
分层设计
Views (19 个页面视图) ↓ Components (40+ 个可复用组件) ↓ Composables (业务逻辑 Hook) ↓ Stores (13 个 Pinia 状态模块) ↓ API Layer (21 个 API 模块 + Axios 拦截器) ↓ Types (12 个 TypeScript 类型模块)
状态管理
| Store | 职责 |
|---|---|
| authStore | 用户认证、Token 管理、多标签同步 |
| resourceStore | 资源 CRUD、上传进度 |
| subscriptionStore | 订阅状态、订阅列表 |
| purchaseStore | 购买记录、购买检查 |
| commentStore | 评论分页、嵌套回复 |
| favoriteStore | 收藏状态、收藏列表 |
| likeStore | 点赞状态、点赞数 |
| notificationStore | 通知列表、未读数 |
| orderStore | 订单列表、订单状态 |
| walletStore | 钱包余额、充值、交易流水 |
| messageStore | 对话列表、消息发送 |
| subscribeStore | 订阅支付流程 |
| liveStreamStore | 直播管理、直播购买 |
路由表（部分）
| 路径 | 页面 | 需认证 | 角色 |
|---|---|---|---|
| / | 资源列表（首页） | 否 | - |
| /upload | 上传资源 | 是 | USER |
| /resource/:id | 资源详情 | 否 | - |
| /profile | 个人资料 | 是 | USER |
| /wallet | 钱包管理 | 是 | USER |
| /messages | 消息中心 | 是 | USER |
| /live | 直播广场 | 否 | - |
| /admin | 管理后台 | 是 | ADMIN |
| /statistics | 数据统计 | 是 | ADMIN |
工程化与 DevOps
Docker 容器化：后端 + 前端独立 Dockerfile，docker-compose 一键部署
PWA 支持：通过 vite-plugin-pwa 实现离线访问、桌面安装
CI/CD：GitHub Actions 自动化构建与测试
代码质量：结构化日志（SLF4J）、健康检查端点（/actuator/health）、Prometheus Metrics
XSS 防护：前端输出转义 + 安全 Headers
知识图谱：通过 Graphify 自动分析 2104 节点 / 2994 边的代码依赖关系
测试覆盖
后端测试：38 个测试用例，100% 通过
访问控制集成测试（Public/Login/Members/Paid 四种规则全覆盖）
支付系统测试
JWT 认证流程测试
前端测试：15+ 个测试用例通过
本地运行
# 后端 cd backend mvn spring-boot:run # 启动在 localhost:8080 # 前端 cd frontend npm install npm run dev # 启动在 localhost:5173
默认测试账户：admin/testuser/creator（密码均为password）
路线图
- 多级访问控制 (PUBLIC → PAID_ONLY)
- 订阅制付费体系
- 微信/支付宝钱包系统
- 直播系统
- 管理后台与数据统计
- Docker 部署 + PWA 支持
- 真实支付网关集成
- MySQL 生产环境迁移
- WebSocket 直播推流
- Elasticsearch 全文搜索优化
MinX System 是一个从零独立构建的全栈项目，涵盖内容平台几乎所有核心能力——从用户认证到内容管理，从付费变现到直播系统，从管理后台到数据统计。适合作为 Spring Boot + Vue 3 全栈学习的参考项目，也可直接作为内容社区/知识付费平台的起步模板。