77 lines
4.1 KiB
Markdown
77 lines
4.1 KiB
Markdown
# C-01 · 路由/代理前缀冲突修复
|
||
|
||
| 字段 | 值 |
|
||
|---|---|
|
||
| 项目 | 可乐工具 · `vscode/chunyu_project_react`（前端）+ `vscode/chunyu_project`（后端） |
|
||
| 优先级 | P0 · M1 |
|
||
| 建议模型 | deepseek-v4.1-flash（主）/ glm-5.3-flash（全量回归复核） |
|
||
| 依赖 | 无 |
|
||
| 预估 | 1 天 |
|
||
|
||
## 一、背景（为什么做）
|
||
|
||
2026-09-10 页面健康检查实测：**开发环境 22 条路由、生产环境 7 条路由被 API 代理劫持**——用户刷新页面、收藏链接、分享链接时直接打开 Django 404 或原始 JSON，而不是前端页面。SPA 内部点击导航不受影响，所以**藏得深、咬得狠**。
|
||
|
||
证据：`vscode/docs/页面健康检查报告.md`（问题清单 1.1 / 1.2）。
|
||
|
||
根因：前端路由与后端 API 共用了一组顶级路径段（`/api`、`/article`、`/learn`、`/user`、`/bug`、`/chat`、`/history`、`/message`、`/s`、`/search`、`/tool`），vite 代理用**前缀匹配**、生产 nginx 用**带尾斜杠的正则**，两边都会误伤前端路由。
|
||
|
||
## 二、目标（交付物）
|
||
|
||
1. **前端冲突路由改名**（推荐方案 A，报告结论"一劳永逸，趁早改便宜"）：
|
||
- `/api` 及其子路由（`/api-directory`、`/api-docs`、`/api-detail/:id`、`/api/ip-location` 等 5 个数据 API 页）→ `/open-api/*`
|
||
- `/article/:id` → `/post/:id`（或 `/article-detail/:id`）
|
||
- `/user/:id` → `/user-home/:id`（项目已有 `/user-home` 路由，可复用）
|
||
2. **代理收窄**：vite 代理不再是宽前缀——改为**精确路径清单 / 正则白名单**（先枚举后端真实 URL：`chunyu_project/config/urls.py` + 各 app `urls.py`，以枚举结果为准）。
|
||
3. **生产 nginx 同步**：`nginx-docker.conf` 同样收窄，并覆盖 `/article/:id`、`/user/:id`、`/api/*` 五条数据页的冲突段。
|
||
4. **回归脚本**：提交一个可重复运行的 73 路由检查脚本（如 `scripts/check_routes.mjs`），检测逻辑三件套：① 是否返回 Django 404/JSON（劫持）② `#root` 是否空（白屏）③ 正文长度。
|
||
5. 全量更新 `navigation(...)` / 跳转引用 / 语言包中的路径引用。
|
||
|
||
## 三、执行步骤
|
||
|
||
```text
|
||
1. 枚举后端真实 API 路径（config/urls.py + 全部 app urls.py），产出一张「API 路径清单」
|
||
2. 对照前端 73 条路由，标记全部冲突项（不只报告里那 7 条）
|
||
3. 执行改名 + 同步全部引用（grep 旧路径确认零残留）
|
||
4. 收窄 vite 代理 → 启动 dev 双端，跑回归脚本至 73/73
|
||
5. 收窄 nginx-docker.conf，静态审查冲突模式段
|
||
6. 提交：代码 + 回归脚本 + 检查报告（贴进 PROGRESS）
|
||
```
|
||
|
||
## 四、验收标准
|
||
|
||
- [ ] dev 环境：73 条路由直访全部返回 SPA（无 Django 404/JSON 劫持、无白屏）
|
||
- [ ] 生产 nginx 配置：审查确认 7 条冲突段全部让路（含 `/article/:id`、`/user/:id`——核心分享场景）
|
||
- [ ] `grep -rn "旧路径"` 零残留（含 App.tsx、页面组件、i18n 词条）
|
||
- [ ] API 调用回归正常（登录、文章列表、工具使用等核心接口抽查 via 代理）
|
||
- [ ] SPA 内部导航抽查正常（首页→文章→详情）
|
||
- [ ] 回归脚本已入库，可被 CI 复用
|
||
|
||
## 五、验收命令（参考）
|
||
|
||
```bash
|
||
# 后端
|
||
cd chunyu_project && python manage.py runserver 8002
|
||
# 前端
|
||
cd chunyu_project_react && npm run dev # 5173
|
||
|
||
# 路由回归（脚本由本任务交付）
|
||
node scripts/check_routes.mjs --base http://127.0.0.1:5173
|
||
# 期望输出：PASS 73/73，hijacked=0，blank=0
|
||
|
||
# 引用残留检查
|
||
grep -rn "'/api-docs'\|'/api-directory'\|/article/\|/user/" src/ --include="*.tsx" --include="*.ts" | grep -v open-api
|
||
```
|
||
|
||
## 六、边界（不许做）
|
||
|
||
- 不动后端 API 的响应结构（纯路由层工作）
|
||
- 不重构页面组件内部逻辑
|
||
- 不修改 `docs/` 下既有报告
|
||
- 新增路由名后必须保留旧路径的**客户端重定向**（302 内的 SPA `Navigate`）——已分享出去的链接不能全死
|
||
|
||
## 七、交接
|
||
|
||
交付 = 代码 + `scripts/check_routes.mjs` + **PROGRESS_C-01.md**（含 73/73 输出与占位截图说明）。
|
||
格式见 `PLANNING/03-执行协议.md`。
|