234 lines
5.0 KiB
Markdown
234 lines
5.0 KiB
Markdown
# Design Document: Admin Integration Testing
|
||
|
||
## Overview
|
||
|
||
本文档描述了后台管理系统前后端联调测试的策略和流程设计。联调测试确保后端 API 和前端页面能够正确协作。
|
||
|
||
## 联调策略
|
||
|
||
### 分阶段联调
|
||
|
||
```mermaid
|
||
gantt
|
||
title 前后端并行开发与联调计划
|
||
dateFormat YYYY-MM-DD
|
||
section 后端开发
|
||
基础设施搭建 :a1, 2026-02-03, 2d
|
||
配置+内容模块 :a2, after a1, 3d
|
||
测评模块 :a3, after a2, 4d
|
||
用户+订单模块 :a4, after a3, 3d
|
||
规划师+分销模块 :a5, after a4, 4d
|
||
权限控制 :a6, after a5, 2d
|
||
|
||
section 前端开发
|
||
基础设施搭建 :b1, 2026-02-03, 2d
|
||
Dashboard+Config :b2, after b1, 2d
|
||
Content模块 :b3, after b2, 2d
|
||
Assessment模块 :b4, after b3, 4d
|
||
User+Order模块 :b5, after b4, 3d
|
||
Planner+Distribution :b6, after b5, 4d
|
||
权限控制 :b7, after b6, 2d
|
||
|
||
section 联调测试
|
||
联调1: 基础模块 :c1, 2026-02-08, 1d
|
||
联调2: 内容+测评 :c2, 2026-02-14, 1d
|
||
联调3: 用户+订单 :c3, 2026-02-18, 1d
|
||
联调4: 规划师+分销 :c4, 2026-02-23, 1d
|
||
联调5: 权限+最终验收 :c5, 2026-02-25, 2d
|
||
```
|
||
|
||
### 联调检查点
|
||
|
||
| 检查点 | 后端完成任务 | 前端完成任务 | 联调内容 |
|
||
|-------|------------|------------|---------|
|
||
| CP1 | Task 1-4 | Task 1-4 | Dashboard, Config |
|
||
| CP2 | Task 5-10 | Task 5-6 | Content, Assessment |
|
||
| CP3 | Task 11-14 | Task 7-9 | User, Order |
|
||
| CP4 | Task 15-19 | Task 10-11 | Planner, Distribution |
|
||
| CP5 | Task 20-23 | Task 12-14 | 权限控制, 最终验收 |
|
||
|
||
## 联调环境配置
|
||
|
||
### 后端配置
|
||
|
||
```json
|
||
// appsettings.Development.json
|
||
{
|
||
"Cors": {
|
||
"AllowedOrigins": ["http://localhost:5173"]
|
||
}
|
||
}
|
||
```
|
||
|
||
### 前端配置
|
||
|
||
```typescript
|
||
// vite.config.ts
|
||
export default defineConfig({
|
||
server: {
|
||
proxy: {
|
||
'/api': {
|
||
target: 'http://localhost:61551',
|
||
changeOrigin: true
|
||
}
|
||
}
|
||
}
|
||
})
|
||
```
|
||
|
||
## 联调测试用例
|
||
|
||
### 1. 认证流程
|
||
|
||
```
|
||
测试步骤:
|
||
1. 打开登录页面
|
||
2. 输入用户名: admin, 密码: 123456
|
||
3. 点击登录按钮
|
||
|
||
预期结果:
|
||
- 登录成功，跳转到首页
|
||
- localStorage 中存储 accessToken 和 refreshToken
|
||
- 后续请求 Header 中包含 Authorization: Bearer {token}
|
||
```
|
||
|
||
### 2. CRUD 操作流程
|
||
|
||
```
|
||
测试步骤 (以轮播图为例):
|
||
1. 访问轮播图管理页面
|
||
2. 点击新增按钮
|
||
3. 上传图片，填写标题，选择跳转类型
|
||
4. 点击保存
|
||
|
||
预期结果:
|
||
- 图片上传成功，返回 URL
|
||
- 表单数据正确提交到后端
|
||
- 列表刷新显示新增数据
|
||
- 数据库中有对应记录
|
||
```
|
||
|
||
### 3. 分页和筛选
|
||
|
||
```
|
||
测试步骤:
|
||
1. 访问用户管理页面
|
||
2. 输入筛选条件 (手机号: 138)
|
||
3. 点击搜索
|
||
4. 切换到第 2 页
|
||
|
||
预期结果:
|
||
- 列表只显示手机号包含 138 的用户
|
||
- 分页信息正确 (总数、当前页)
|
||
- 切换页面数据正确加载
|
||
```
|
||
|
||
### 4. 权限控制
|
||
|
||
```
|
||
测试步骤:
|
||
1. 使用普通运营账号登录
|
||
2. 访问提现审核页面
|
||
3. 尝试点击审核按钮
|
||
|
||
预期结果:
|
||
- 如果无权限，审核按钮不显示
|
||
- 如果直接调用 API，返回 403 错误
|
||
```
|
||
|
||
## 常见问题排查
|
||
|
||
### 1. CORS 错误
|
||
|
||
```
|
||
问题: Access to XMLHttpRequest has been blocked by CORS policy
|
||
解决: 检查后端 CORS 配置是否包含前端地址
|
||
```
|
||
|
||
### 2. 401 未授权
|
||
|
||
```
|
||
问题: 请求返回 401 Unauthorized
|
||
解决:
|
||
- 检查 token 是否正确存储
|
||
- 检查请求 Header 是否包含 Authorization
|
||
- 检查 token 是否过期
|
||
```
|
||
|
||
### 3. 数据格式不一致
|
||
|
||
```
|
||
问题: 前端解析数据失败
|
||
解决:
|
||
- 对比 API 文档和实际返回数据
|
||
- 检查字段名大小写 (后端 PascalCase vs 前端 camelCase)
|
||
- 检查日期格式
|
||
```
|
||
|
||
### 4. 文件上传失败
|
||
|
||
```
|
||
问题: 图片上传返回错误
|
||
解决:
|
||
- 检查文件大小限制
|
||
- 检查文件类型限制
|
||
- 检查上传路径配置
|
||
```
|
||
|
||
## 联调沟通模板
|
||
|
||
### 问题报告
|
||
|
||
```markdown
|
||
**模块**: 轮播图管理
|
||
**接口**: POST /api/admin/content/banner/create
|
||
**问题描述**: 创建轮播图时返回 500 错误
|
||
**请求参数**:
|
||
{
|
||
"title": "测试",
|
||
"imageUrl": "http://xxx/test.jpg",
|
||
"linkType": 1,
|
||
"linkUrl": "/pages/index"
|
||
}
|
||
**返回结果**:
|
||
{
|
||
"code": 500,
|
||
"message": "Internal Server Error"
|
||
}
|
||
**期望结果**: 返回创建成功的 ID
|
||
**前端/后端**: 后端
|
||
```
|
||
|
||
### 接口变更通知
|
||
|
||
```markdown
|
||
**接口**: GET /api/admin/user/getList
|
||
**变更类型**: 新增字段
|
||
**变更内容**: 响应数据新增 inviteCount 字段
|
||
**变更原因**: 需要显示用户邀请人数
|
||
**影响范围**: 用户列表页面
|
||
**生效时间**: 2026-02-10
|
||
```
|
||
|
||
## 验收标准
|
||
|
||
### 功能验收
|
||
|
||
- [ ] 所有 CRUD 操作正常
|
||
- [ ] 分页和筛选功能正常
|
||
- [ ] 文件上传功能正常
|
||
- [ ] 导出功能正常
|
||
- [ ] 权限控制正常
|
||
|
||
### 性能验收
|
||
|
||
- [ ] 列表页面加载时间 < 2s
|
||
- [ ] 表单提交响应时间 < 1s
|
||
- [ ] 文件上传响应时间 < 5s
|
||
|
||
### 兼容性验收
|
||
|
||
- [ ] Chrome 最新版本
|
||
- [ ] Edge 最新版本
|
||
- [ ] Firefox 最新版本
|