1. 版本管理

• 展示最近 N 次 Tag 构建记录列表，包含版本号、构建时间、构建状态、提交信息等
• 支持查看每个版本的详细信息（构建产物列表、构建日志链接、关联的 Git 提交）
• CI/CD 流水线通过 Webhook 自动注册新版本到系统

2. 发布与回滚

• 一键发布：选择目标版本，切换 active 版本指针，秒级生效
• 一键回滚：从历史发布记录中选择版本，快速回退
• 发布前二次确认弹窗，展示当前版本与目标版本的 diff 信息
• 发布后自动触发 CDN 缓存刷新

3. 灰度发布

• 按用户比例灰度：设置百分比（如 10%），基于用户标识 hash 取模分流
• 按用户 ID / 白名单灰度：指定用户 ID 列表，精确匹配命中的用户看到新版本
• 按环境灰度：test / staging / prod 三套环境独立管理发布版本
• 支持多条灰度规则叠加，按优先级依次匹配

4. 操作审计

• 所有发布、回滚、灰度配置变更操作记录操作人、操作时间、目标版本、操作类型
• 审计日志列表页，支持按时间范围、操作人、操作类型筛选
• 关键操作（生产环境发布/回滚）支持审批流

5. 权限管理

• RBAC 权限模型：超级管理员、项目管理员、开发者、只读用户四种角色
• 超级管理员管理所有项目；项目管理员管理本项目发布和灰度；开发者可发起发布请求；只读用户仅查看
• 生产环境发布操作需项目管理员或以上角色审批

6. 高可用与异常兜底

• 资源多副本存储于对象存储，版本指针原子切换
• 健康检查机制：发布后自动检测新版本可用性，异常时自动回滚到上一稳定版本
• 降级兜底：当版本指针读取失败时，资源网关回退到默认稳定版本
• 系统状态仪表盘展示各环境当前版本、健康状态

技术栈选择

前端

• 框架: React 18 + TypeScript
• UI 组件库: Ant Design 5.x（企业级后台管理系统最佳选择）
• 状态管理: Zustand（轻量高效）
• 路由: React Router v6
• 请求库: Axios + React Query（缓存与自动刷新）
• 样式: Tailwind CSS + Ant Design 主题定制
• 构建工具: Vite 5
• 图表: ECharts（发布趋势、灰度流量分布可视化）

后端

• 框架: Node.js + Express.js + TypeScript
• ORM: Prisma（类型安全的数据库访问）
• 数据库: PostgreSQL（关系型数据，ACID 事务保障版本指针原子切换）
• 缓存: Redis（灰度策略缓存、版本指针缓存、分布式锁）
• 认证: JWT + Refresh Token
• 日志: Winston
• API 文档: Swagger / OpenAPI 3.0
• 任务队列: BullMQ（CDN 刷新、健康检查等异步任务）

基础设施

• 对象存储: S3/COS（存储构建产物）
• 资源网关: Nginx + Lua（OpenResty）实现灰度路由
• CDN: 配合 CDN 缓存刷新 API
• 容器化: Docker + Docker Compose（本地开发与部署）

实现方案

秒级发布切换原理

所有版本的构建产物预先上传到对象存储，按 /{project_id}/{version}/ 目录组织。"发布"操作仅修改数据库中的 active_version 指针（一条 SQL UPDATE），资源网关每次请求时读取 Redis 缓存的版本指针，路由到对应版本目录。版本指针变更后通过 Pub/Sub 机制通知所有网关节点刷新本地缓存，实现秒级生效。

灰度路由策略

资源网关（Nginx + Lua）处理每个静态资源请求时：

1. 提取用户标识（Cookie/Header 中的 user_id 或自动生成的 anonymous_id）
2. 查询 Redis 中的灰度规则（按优先级排序）
3. 依次匹配：白名单命中 → 比例灰度（hash(user_id) % 100 < percentage）→ 默认版本
4. 路由到对应版本的资源目录

高可用设计

• 版本指针原子切换: PostgreSQL 事务 + Redis 原子操作（MULTI/EXEC）
• 健康检查: 发布后异步任务检测新版本入口文件（index.html）可用性，3 次检测失败触发自动回滚
• 降级兜底: Nginx Lua 脚本中，当 Redis 不可用或版本指针读取失败时，回退到配置文件中的 fallback_version
• 多副本存储: 对象存储天然支持多副本，构建产物一旦上传不可变（immutable）