OCDP/ocdp-go

Fork 0

Files

mangomqy c5e51ed069 ocdp v1

2025-11-13 02:54:06 +00:00

6.1 KiB

Raw Blame History

✅ 测试完成 - 如何使用

🎉 好消息！

所有服务已启动并测试通过：

服务	地址	状态
后端 API	http://localhost:8080	✅ 运行中
前端应用	http://localhost:5175	✅ 运行中
健康检查	http://localhost:8080/health	✅ 正常

🧪 测试方法（3 种方式）

方法 1: 独立 HTML 测试页面（最简单⭐）

直接在浏览器打开：

http://localhost:5175/api-test.html

功能：

✅ 无需登录前端应用
✅ 直接测试所有 API
✅ 实时查看 JSON 响应
✅ 验证 camelCase 字段
✅ 一键完整测试

使用步骤：

打开上面的URL
点击 "🚀 完整测试" 按钮
观察测试结果和日志
验证所有字段都是 camelCase

方法 2: React 应用内测试

访问主应用：

http://localhost:5175

步骤：

登录应用（用户名: admin, 密码: admin123）
访问 http://localhost:5175/api-test (React 组件)
点击测试按钮

方法 3: cURL 命令行测试

快速验证：

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

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

# 3. 获取集群列表（需要替换 TOKEN）
curl http://localhost:8080/api/v1/clusters \
  -H "Authorization: Bearer YOUR_TOKEN"

或运行测试脚本：

cd /home/mango/workspace/ocdp-go

# API 测试
./scripts/test-api-camelcase.sh

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

📋 测试清单

1. API 响应验证

打开 http://localhost:5175/api-test.html 并验证：

登录响应应该包含：

accessToken (不是 access_token)
refreshToken (不是 refresh_token)
userId (不是 user_id)

集群响应应该包含：

createdAt (不是 created_at)
updatedAt (不是 updated_at)
hasCaData (不是 has_ca_data)
hasCertData (不是 has_cert_data)

创建集群请求应该发送：

caData (不是 ca_data)
certData (不是 cert_data)
keyData (不是 key_data)

2. 前端功能验证

访问 http://localhost:5175：

登录页面可以正常访问
可以成功登录
可以看到集群列表
可以创建新集群
所有操作无错误

📸 预期结果示例

登录响应（camelCase ✅）

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

集群列表响应（camelCase ✅）

[
  {
    "id": "cluster-123",
    "name": "Production Cluster",
    "host": "https://k8s.example.com:6443",
    "hasCaData": true,
    "hasCertData": true,
    "hasKeyData": true,
    "hasToken": false,
    "caData": "••••••••",
    "certData": "••••••••",
    "keyData": "••••••••",
    "createdAt": "2025-11-10T10:00:00Z",
    "updatedAt": "2025-11-10T10:00:00Z"
  }
]

🎯 快速测试（推荐）

一行命令测试所有功能：

cd /home/mango/workspace/ocdp-go && \
./scripts/test-api-camelcase.sh && \
./scripts/test-frontend-integration.sh && \
echo -e "\n✅ 所有测试通过！\n访问: http://localhost:5175/api-test.html"

🔧 如果遇到问题

问题：页面无法打开

检查服务是否运行：

# 检查后端
curl http://localhost:8080/health

# 检查前端
curl http://localhost:5175

# 如果没有运行，启动服务：
# 后端: cd backend && make run-0
# 前端: cd frontend && npm run dev

问题：看到 snake_case 字段

这不应该发生！如果看到，请：

检查 Go DTO JSON tags：

grep -r "json:\"ca_data\"" backend/internal/adapter/input/http/dto/
# 应该没有结果，如果有结果说明没有正确更新

检查 OpenAPI 规范：

grep "ca_data:" backend/docs/openapi.yaml
# 应该没有结果，如果有结果说明规范没有更新

重新生成前端代码：
```
cd frontend && npm run openapi-gen
```
重启服务

问题：CORS 错误

HTML 测试页面直接访问 API 可能遇到 CORS，这是正常的。请：

使用 React 应用内的测试页面
或检查后端是否允许跨域请求

📚 相关文档

文档	用途
QUICK-TEST.md	快速测试指南
TEST-GUIDE.md	完整测试指南
TEST-RESULTS.md	详细测试结果
IMPLEMENTATION-COMPLETE.md	实施总结
frontend/src/api/README.md	API 使用文档

🎊 成功标志

当你看到以下结果时，说明一切正常：

✅ HTML 测试页面 - 所有测试通过，显示绿色 ✓
✅ JSON 响应 - 所有字段使用 camelCase
✅ 前端应用 - 无错误，功能正常
✅ 浏览器控制台 - 无错误信息
✅ TypeScript - 类型提示正常工作

🚀 现在就测试！

最简单的方式：

打开浏览器
访问: http://localhost:5175/api-test.html
点击 "🚀 完整测试"
查看结果！

预期看到：

🧪 开始完整测试流程...

🔐 开始测试登录...
✅ 登录成功!
  ✓ accessToken 字段存在 (camelCase)
  ✓ refreshToken 字段存在 (camelCase)
  ✓ userId 字段存在 (camelCase)

📋 开始获取集群列表...
✅ 获取集群列表成功!
  ✓ createdAt 字段存在 (camelCase)
  ✓ hasCaData 字段存在 (camelCase)

🚀 开始创建集群 (使用 camelCase)...
✅ 创建集群成功!
  ✓ hasCaData 字段存在 (camelCase)
  ✓ createdAt 字段存在 (camelCase)

🎉 完整测试流程完成!
所有 API 调用成功，camelCase 工作正常！

当前服务：

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

🎉 测试愉快！camelCase API 完美工作！

6.1 KiB Raw Blame History Unescape Escape