feat(admin): Admin V2 — Ant Design Pro 纯 SPA 重写
Some checks failed
CI / Lint & TypeCheck (push) Has been cancelled
CI / Unit Tests (push) Has been cancelled
CI / Build Frontend (push) Has been cancelled
CI / Rust Check (push) Has been cancelled
CI / Security Scan (push) Has been cancelled
CI / E2E Tests (push) Has been cancelled
Some checks failed
CI / Lint & TypeCheck (push) Has been cancelled
CI / Unit Tests (push) Has been cancelled
CI / Build Frontend (push) Has been cancelled
CI / Rust Check (push) Has been cancelled
CI / Security Scan (push) Has been cancelled
CI / E2E Tests (push) Has been cancelled
Next.js SSR/hydration 与 SWR fetch-on-mount 存在根本冲突: hydration 卸载组件时 abort 的请求仍占用后端 DB 连接, retry 循环耗尽 PostgreSQL 连接池导致后端完全卡死。 admin-v2 使用 Vite + React + antd 纯 SPA 彻底消除此问题: - 12 页面全部完成(Login, Dashboard, Accounts, Providers, Models, API Keys, Usage, Relay, Config, Prompts, Logs, Agent Templates) - ProTable + ProForm + ProLayout 统一 UI 模式 - TanStack Query + Axios + Zustand 数据层 - JWT 自动刷新 + 401 重试机制 - 全部 18 网络请求 200 OK,零 ERR_ABORTED 同时更新 troubleshooting 第 13 节和 SaaS 平台文档。
This commit is contained in:
@@ -1981,7 +1981,66 @@ psql -U postgres -d zclaw -c "UPDATE accounts SET role = 'super_admin' WHERE use
|
||||
|
||||
---
|
||||
|
||||
## 13. 相关文档
|
||||
## 13. Admin 前端 ERR_ABORTED / 后端卡死 (2026-03-30)
|
||||
|
||||
### 13.1 症状
|
||||
|
||||
- Admin 前端登录后所有 GET 请求返回 `ERR_ABORTED`(Network 面板显示红色 cancelled)
|
||||
- 后端日志显示请求已接收并处理,但响应无法到达客户端
|
||||
- 后端 PostgreSQL 连接池(50 max)被耗尽,所有后续请求 hang
|
||||
- `GET /api/health` 也无法响应,整个后端完全卡死
|
||||
|
||||
### 13.2 根因分析(因果链)
|
||||
|
||||
```
|
||||
Next.js App Router SSR
|
||||
→ React 组件服务端渲染 + 客户端 hydration 重建
|
||||
→ SWR 在 hydration mount 时触发 fetch
|
||||
→ hydration 卸载旧组件 → AbortController abort 请求
|
||||
→ Vite proxy 已将请求转发到后端
|
||||
→ 后端不知道请求已被 abort,继续处理(占用 DB 连接)
|
||||
→ SWR retry 重新发起 → 又被 abort → 死循环
|
||||
→ PostgreSQL 连接池耗尽 → 后端完全卡死
|
||||
```
|
||||
|
||||
**根本矛盾**: Next.js SSR/hydration 机制与 SWR fetch-on-mount 模式存在不可调和的冲突。abort 信号无法从浏览器传播到后端,导致后端持续处理已废弃的请求。
|
||||
|
||||
### 13.3 已尝试的修复(均未解决)
|
||||
|
||||
| 尝试 | 方案 | 结果 |
|
||||
|------|------|------|
|
||||
| 1 | SWRConfig 全局配置(dedupingInterval, revalidateOnFocus) | 无效,abort 发生在更底层 |
|
||||
| 2 | AuthGuard 路由守卫重构 | 无效,请求在 guard 之前就发出 |
|
||||
| 3 | `dynamic ssr: false` 页面级禁用 SSR | 部分改善,但 hydration 仍触发 abort |
|
||||
| 4 | 前端直连后端(绕过 Vite proxy) | 无效,问题不在 proxy |
|
||||
| 5 | health handler 3s 超时 | 只保护了 health 端点,不解决根因 |
|
||||
| 6 | AbortError 不重试 | 减少了 retry,但首次 abort 仍占用连接 |
|
||||
|
||||
### 13.4 最终解决方案
|
||||
|
||||
**用纯 SPA(Ant Design Pro)彻底重写 Admin 前端**,消除 SSR/hydration 问题。
|
||||
|
||||
**admin-v2 技术栈**:
|
||||
- Vite 6(纯客户端,无 SSR)
|
||||
- React 19 + antd v5 + @ant-design/pro-components
|
||||
- React Router v7 + TanStack Query v5 + Axios + Zustand
|
||||
|
||||
**关键修复**:
|
||||
1. 移除 React `StrictMode`(开发模式双重 mount 触发重复请求 + abort)
|
||||
2. Axios timeout 10s → 30s(防止慢请求被误杀)
|
||||
3. JWT 拦截器(自动附加 token + 401 刷新)
|
||||
|
||||
### 13.5 验证结果
|
||||
|
||||
- 全部 12 页面功能正常,18 个网络请求全部 200
|
||||
- 零 `ERR_ABORTED`,后端连接池不再耗尽
|
||||
- 后端 health 检查持续返回 200
|
||||
|
||||
**涉及文件**: `admin-v2/` 目录(全新项目,替换 `admin/`)
|
||||
|
||||
---
|
||||
|
||||
## 14. 相关文档
|
||||
|
||||
- [ZCLAW 配置指南](./zclaw-configuration.md) - 配置文件位置、格式和最佳实践
|
||||
- [Agent 和 LLM 提供商配置](./agent-provider-config.md) - Agent 管理和 Provider 配置
|
||||
@@ -1993,6 +2052,7 @@ psql -U postgres -d zclaw -c "UPDATE accounts SET role = 'super_admin' WHERE use
|
||||
|
||||
| 日期 | 变更 |
|
||||
|------|------|
|
||||
| 2026-03-30 | 添加第 13 节:Admin 前端 ERR_ABORTED / 后端卡死 — Next.js SSR/hydration + SWR 根本冲突导致连接池耗尽,admin-v2 (Ant Design Pro 纯 SPA) 替代方案 |
|
||||
| 2026-03-28 | 添加 12.1-12.4 节:SaaS 后端问题 — Admin 登录无请求、SQLite→PostgreSQL 遗留语法、角色权限不足、usage 路由不匹配 |
|
||||
| 2026-03-27 | 添加 9.10/9.11 节:多轮工具调用 tool_call_id + reasoning_content 缺失 — OpenAiMessage 字段补全、[Assistant,ToolUse*] 合并、reasoning 分离追踪 |
|
||||
| 2026-03-27 | 添加 9.10 节:多轮工具调用 tool_call_id is not found — OpenAiMessage 缺少 tool_call_id 字段 + 连续 ToolUse 未合并 |
|
||||
|
||||
Reference in New Issue
Block a user