ocdp-go/docs/archive/root-cleanup/QUICK-TEST.md

🚀 快速测试指南

✅ 当前状态

• ✅ 后端服务: http://localhost:8080 (运行中)
• ✅ 前端服务: http://localhost:5175 (运行中)
• ✅ API 通信: camelCase 正常工作
• ✅ 测试通过: 所有 API 测试通过

📝 测试结果

后端 API 测试

测试项	状态	说明
健康检查	✅	/health 返回 healthy
登录 API	✅	accessToken (camelCase) ✓
获取集群	✅	createdAt, hasCaData (camelCase) ✓
创建集群	✅	请求和响应都是 camelCase ✓

前端服务

项目	URL	状态
主应用	http://localhost:5175	✅ 可访问
API 测试页面	http://localhost:5175/api-test	⚠️ 需要在浏览器中访问

🧪 测试方法

方法 1: 浏览器测试（推荐）

1. 打开主应用

   http://localhost:5175
   

   • 查看登录页面
   • 测试认证功能

2. 打开 API 测试页面

   http://localhost:5175/api-test
   

   • 点击 "🚀 完整测试" 按钮
   • 观察所有 API 调用是否成功
   • 验证 camelCase 字段

方法 2: cURL 测试（快速验证）

# 1. 健康检查
curl http://localhost:8080/health

# 2. 登录（获取 Token）
curl -X POST http://localhost:8080/api/v1/auth/login \
  -H "Content-Type: application/json" \
  -d '{"username":"admin","password":"admin123"}'

# 3. 创建集群（使用 camelCase）
TOKEN="你的token"
curl -X POST http://localhost:8080/api/v1/clusters \
  -H "Content-Type: application/json" \
  -H "Authorization: Bearer $TOKEN" \
  -d '{
    "name": "test-cluster",
    "host": "https://k8s.example.com:6443",
    "caData": "LS0tLS1CRUdJTi1DRVJUSUZJQ0FURS0tLS0t",
    "certData": "LS0tLS1CRUdJTi1DRVJUSUZJQ0FURS0tLS0t",
    "keyData": "LS0tLS1CRUdJTiBSU0EgUFJJVkFURSBLRVkt"
  }'

方法 3: 自动化测试脚本

# 运行完整测试
cd /home/mango/workspace/ocdp-go
./scripts/test-api-camelcase.sh

# 运行前端集成测试
./scripts/test-frontend-integration.sh

📖 前端 API 使用示例

在浏览器控制台测试

打开 http://localhost:5175，按 F12 打开控制台，运行：

// 1. 导入 API 函数（如果已经在页面中加载）
// 或者在组件中使用

// 2. 登录示例
const response = await fetch('http://localhost:8080/api/v1/auth/login', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({
    username: 'admin',
    password: 'admin123'
  })
});

const data = await response.json();
console.log('登录响应 (camelCase):', data);
// 应该看到: { accessToken: "...", refreshToken: "...", userId: "..." }

// 3. 获取集群列表
const token = data.accessToken;
const clustersResponse = await fetch('http://localhost:8080/api/v1/clusters', {
  headers: { 'Authorization': `Bearer ${token}` }
});

const clusters = await clustersResponse.json();
console.log('集群列表 (camelCase):', clusters);
// 应该看到 camelCase 字段: createdAt, hasCaData, etc.

✨ camelCase 验证清单

验证以下字段都是 camelCase 格式：

Auth API

• accessToken
• refreshToken
• userId

Cluster API

• caData
• certData
• keyData
• hasCaData
• hasCertData
• hasKeyData
• hasToken
• createdAt
• updatedAt

Registry API

• registryId
• hasPassword
• createdAt
• updatedAt

🎯 预期结果

API 响应示例（camelCase ✅）

登录响应：

{
  "accessToken": "eyJhbGci...",
  "refreshToken": "eyJhbGci...",
  "userId": "e0b632e8-...",
  "username": "admin"
}

集群响应：

{
  "id": "ed37e2b2-...",
  "name": "test-cluster",
  "host": "https://k8s.example.com:6443",
  "hasCaData": true,
  "hasCertData": true,
  "hasKeyData": true,
  "hasToken": false,
  "caData": "••••••••",
  "certData": "••••••••",
  "keyData": "••••••••",
  "createdAt": "2025-11-10T10:03:04Z",
  "updatedAt": "2025-11-10T10:03:04Z"
}

🔧 故障排查

问题：前端无法连接后端

检查：

# 检查后端是否运行
curl http://localhost:8080/health

# 如果没有运行
cd backend
make run-0

问题：前端服务未启动

检查：

# 检查前端是否运行
curl http://localhost:5175

# 如果没有运行
cd frontend
npm run dev

问题：API 返回 401 Unauthorized

原因: Token 过期或未设置

解决:

1. 重新登录获取新 Token
2. 确保 Authorization header 正确设置

问题：看到 snake_case 而不是 camelCase

检查:

1. 确认 Go DTO JSON tags 已更新
2. 确认 OpenAPI 规范已更新
3. 确认前端代码已重新生成：npm run openapi-gen
4. 重启后端和前端服务

📚 相关文档

• 完整文档: IMPLEMENTATION-COMPLETE.md
• 测试指南: TEST-GUIDE.md
• 测试结果: TEST-RESULTS.md
• API 文档: frontend/src/api/README.md

🎊 成功标志

当你看到以下内容时，说明一切正常：

✅ 后端返回 JSON 使用 camelCase
✅ 前端可以正常解析响应
✅ 所有 API 调用成功
✅ TypeScript 类型提示正常
✅ 浏览器控制台无错误

---

当前服务地址：

• 🌐 前端: http://localhost:5175
• 🔌 后端: http://localhost:8080
• 🧪 测试: http://localhost:5175/api-test

快速测试命令：

# 一键运行所有测试
cd /home/mango/workspace/ocdp-go
./scripts/test-frontend-integration.sh

🎉 测试成功！camelCase API 完全正常工作！