github/claude-relay-service
1
0
Fork 0
mirror of https://github.com/Wei-Shaw/claude-relay-service.git synced 2026-01-22 16:43:35 +00:00
Code Issues Packages Projects Releases Wiki Activity
Files
1458d609cacac0c8b508e8f4c8c6667d6b8b17df
claude-relay-service/web/admin-spa
History
sususu98 1458d609ca feat: 为 Claude Console 账户添加并发控制机制 
实现了完整的 Claude Console 账户并发任务数控制功能，防止单账户过载，提升服务稳定性。

  **核心功能**

  - 🔒 **原子性并发控制**: 基于 Redis Sorted Set 实现的抢占式并发槽位管理，防止竞态条件
  - 🔄 **自动租约刷新**: 流式请求每 5 分钟自动刷新租约，防止长连接租约过期
  - 🚨 **智能降级处理**: 并发满额时自动清理粘性会话并重试其他账户（最多 1 次）
  - 🎯 **专用错误码**: 引入 `CONSOLE_ACCOUNT_CONCURRENCY_FULL` 错误码，区分并发限制和其他错误
  - 📊 **批量性能优化**: 调度器使用 Promise.all 并行查询账户并发数，减少 Redis 往返

  **后端实现**

  1. **Redis 并发控制方法** (src/models/redis.js)
     - `incrConsoleAccountConcurrency()`: 增加并发计数（带租约）
     - `decrConsoleAccountConcurrency()`: 释放并发槽位
     - `refreshConsoleAccountConcurrencyLease()`: 刷新租约（流式请求）
     - `getConsoleAccountConcurrency()`: 查询当前并发数

  2. **账户服务增强** (src/services/claudeConsoleAccountService.js)
     - 添加 `maxConcurrentTasks` 字段（默认 0 表示无限制）
     - 获取账户时自动查询实时并发数 (`activeTaskCount`)
     - 支持更新并发限制配置

  3. **转发服务并发保护** (src/services/claudeConsoleRelayService.js)
     - 请求前原子性抢占槽位，超限则立即回滚并抛出专用错误
     - 流式请求启动定时器每 5 分钟刷新租约
     - `finally` 块确保槽位释放（即使发生异常）
     - 为每个请求分配唯一 `requestId` 用于并发追踪

  4. **统一调度器优化** (src/services/unifiedClaudeScheduler.js)
     - 获取可用账户时批量查询并发数（Promise.all 并行）
     - 预检查并发限制，避免选择已满的账户
     - 检查分组成员时也验证并发状态
     - 所有账户并发满额时抛出专用错误码

  5. **API 路由降级处理** (src/routes/api.js)
     - 捕获 `CONSOLE_ACCOUNT_CONCURRENCY_FULL` 错误
     - 自动清理粘性会话映射并重试（最多 1 次）
     - 重试失败返回 503 错误和友好提示
     - count_tokens 端点也支持并发满额重试

  6. **管理端点验证** (src/routes/admin.js)
     - 创建/更新账户时验证 `maxConcurrentTasks` 为非负整数
     - 支持前端传入并发限制配置

  **前端实现**

  1. **表单字段** (web/admin-spa/src/components/accounts/AccountForm.vue)
     - 添加"最大并发任务数"输入框（创建和编辑模式）
     - 支持占位符提示"0 表示不限制"
     - 表单数据自动映射到后端 API

  2. **实时监控** (web/admin-spa/src/views/AccountsView.vue)
     - 账户列表显示并发状态进度条和百分比
     - 颜色编码：绿色（<80%）、黄色（80%-100%）、红色（100%）
     - 显示"X / Y"格式的并发数（如"2 / 5"）
     - 未配置限制时显示"并发无限制"徽章
2025-10-21 13:43:57 +08:00
..
components
feat: 全新的Vue3管理后台(admin-spa)和路由重构
2025-07-29 12:40:51 +08:00
src
feat: 为 Claude Console 账户添加并发控制机制
2025-10-21 13:43:57 +08:00
.env.example
feat: 支持自定义API前缀配置
2025-09-01 22:50:17 +08:00
.env.production
build: 优化admin-spa构建配置和环境变量
2025-07-29 14:06:33 +08:00
.eslintrc.cjs
Revert "Merge pull request #424 from Wangnov/feat/i18n"
2025-09-12 09:21:53 +08:00
.gitignore
fix(admin-spa): 修复多个管理后台问题
2025-07-29 15:11:35 +08:00
.prettierrc
fix: 修复prettier格式化
2025-08-08 15:56:32 +08:00
index.html
chore: commit all changes
2025-08-10 17:46:31 +09:00
package-lock.json
style: 优化apikeys进度条显示
2025-09-27 19:40:55 +08:00
package.json
Revert "Merge pull request #424 from Wangnov/feat/i18n"
2025-09-12 09:21:53 +08:00
postcss.config.js
refactor: standardize code formatting and linting configuration
2025-08-07 18:19:31 +09:00
README.md
feat: 全新的Vue3管理后台(admin-spa)和路由重构
2025-07-29 12:40:51 +08:00
tailwind.config.js
feat: 支持Dark Mode
2025-08-22 22:09:38 +08:00
vite.config.js
Revert "Merge pull request #424 from Wangnov/feat/i18n"
2025-09-12 09:21:53 +08:00

README.md

Claude Relay Service 管理后台 SPA

这是 Claude Relay Service 管理后台的 Vue3 SPA 重构版本。

开发环境要求

  • Node.js >= 16
  • npm >= 7

安装和运行

1. 安装依赖

cd web/admin-spa
npm install

2. 开发模式运行

npm run dev

重要提示：

3. 生产构建

npm run build

构建产物将输出到 dist 目录。

4. 预览生产构建

npm run preview

项目结构

web/admin-spa/
├── public/               # 静态资源
├── src/
│   ├── api/             # API 接口封装
│   ├── assets/          # 资源文件
│   ├── components/      # 组件
│   ├── composables/     # 组合式函数
│   ├── router/          # 路由配置
│   ├── stores/          # Pinia 状态管理
│   ├── utils/           # 工具函数
│   ├── views/           # 页面视图
│   ├── App.vue          # 根组件
│   └── main.js          # 入口文件
├── package.json
└── vite.config.js

功能模块

  • ✅ 登录认证
  • ✅ 仪表板（系统统计、使用趋势、模型分布）
  • 🚧 API Keys 管理
  • 🚧 账户管理（Claude/Gemini）
  • 🚧 使用教程
  • 🚧 系统设置

技术栈

  • Vue 3.3.4
  • Vue Router 4
  • Pinia（状态管理）
  • Element Plus 2.4.4
  • Tailwind CSS
  • Chart.js 4.4.0
  • Vite 5

开发注意事项

  1. 所有 API 请求都通过 /api 目录下的模块进行封装
  2. 状态管理使用 Pinia，存放在 /stores 目录
  3. 组件按功能模块组织在 /components 目录下
  4. 保持与原版页面的功能和样式一致性

代理配置

如果你的后端服务器需要通过代理访问（例如服务器在国外），可以配置 HTTP 代理：

方法一：使用环境变量文件（推荐）

创建 .env.development.local 文件：

# 后端服务器地址
VITE_API_TARGET=http://74.48.134.98:3000

# HTTP 代理配置
VITE_HTTP_PROXY=http://127.0.0.1:7890

方法二：使用系统环境变量

# Linux/Mac
export VITE_HTTP_PROXY=http://127.0.0.1:7890
npm run dev

# Windows
set VITE_HTTP_PROXY=http://127.0.0.1:7890
npm run dev

注意：.env.development.local 文件不会被提交到版本控制，适合存放本地特定的配置。

部署

构建后的文件需要部署到 Claude Relay Service 的 web/admin/ 路径下。

常见问题

Q: 访问 localhost:3001 显示 404？

A: 这是正常的。应用配置在 /web/admin/ 路径下，必须访问完整路径：http://localhost:3001/web/admin/

Q: 登录时 API 请求失败（500错误）？

A:

  1. 确保主服务运行：Claude Relay Service 必须运行在 http://localhost:3000
  2. 检查代理配置：Vite 会自动代理 /admin 和 /api 请求到 3000 端口
  3. 重启开发服务器：如果修改了配置，需要重启 npm run dev
  4. 测试代理：运行 node test-proxy.js 检查代理是否正常工作

Q: 如何处理开发和生产环境的 API 配置？

A:

  • 开发环境：使用 Vite 代理，自动转发请求到 localhost:3000
  • 生产环境：直接使用相对路径 /admin，无需配置
  • 两种环境都使用相同的 API 路径，通过环境变量自动切换

Q: 如何部署到生产环境？

A:

  1. 运行 npm run build 构建项目
  2. 将 dist 目录内容复制到服务器的 /web/admin/ 路径
  3. 确保服务器配置了 SPA 路由回退规则