datawhale/whale-town-front
3
2
Fork 2
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feature/网络管理和Web部署系统 #2

Merged
moyin merged 11 commits from feature/网络管理和Web部署系统 into main 2025-12-25 23:17:31 +08:00
Conversation 0 Commits 11 Files Changed 80 +2339
9 changed files with 2339 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit a05bac6f05 - Show all commits

332
docs/api_update_log.md Normal file
View File

@@ -0,0 +1,332 @@
# API接口更新日志
**更新日期**: 2025-12-25
**API版本**: v1.1.1
**更新内容**: 根据后端最新API文档更新前端接口逻辑和Toast显示
---
## 🎯 更新概述
根据后端API v1.1.1的最新文档，对前端的网络请求、响应处理和Toast显示系统进行了全面更新，以支持新的功能特性和错误处理机制。
---
## 📋 主要更新内容
### 1. **HTTP状态码支持**
#### 新增状态码处理
- **206 Partial Content**: 测试模式响应
- **409 Conflict**: 资源冲突（用户名、邮箱已存在）
- **429 Too Many Requests**: 频率限制
#### 更新的状态码映射
```gdscript
const HTTP_STATUS_MESSAGES = {
200: "请求成功",
201: "创建成功",
206: "测试模式",
400: "请求参数错误",
401: "认证失败",
403: "权限不足",
404: "资源不存在",
408: "请求超时",
409: "资源冲突", # 新增
415: "不支持的媒体类型",
429: "请求过于频繁", # 新增
500: "服务器内部错误",
503: "服务不可用"
}
```
### 2. **错误码映射更新**
#### 新增错误码
- `SEND_EMAIL_VERIFICATION_FAILED`: 发送邮箱验证码失败
- `RESEND_EMAIL_VERIFICATION_FAILED`: 重新发送验证码失败
- `EMAIL_VERIFICATION_FAILED`: 邮箱验证失败
- `RESET_PASSWORD_FAILED`: 重置密码失败
- `CHANGE_PASSWORD_FAILED`: 修改密码失败
- `USER_STATUS_UPDATE_FAILED`: 用户状态更新失败
- `ADMIN_LOGIN_FAILED`: 管理员登录失败
### 3. **邮箱冲突检测**
#### 功能描述
- 发送邮箱验证码前检查邮箱是否已被注册
- 已注册邮箱返回409状态码和明确错误信息
#### 实现细节
```gdscript
# 在ResponseHandler中处理409冲突
if response_code == 409:
if "邮箱已存在" in message:
result.message = "📧 邮箱已被注册，请使用其他邮箱或直接登录"
elif "用户名已存在" in message:
result.message = "👤 用户名已被使用，请换一个"
```
### 4. **测试模式支持**
#### 功能描述
- 开发环境下邮件服务返回206状态码
- 验证码在响应中返回，无需真实发送邮件
#### 实现细节
```gdscript
# 处理206测试模式响应
elif response_code == 206 and error_code == "TEST_MODE_ONLY":
is_success = true
print("🧪 测试模式响应: ", message)
```
#### Toast显示优化
```gdscript
if error_code == "TEST_MODE_ONLY":
result.message = "🧪 测试模式：验证码已生成，请查看控制台"
if data.has("data") and data.data.has("verification_code"):
print("🔑 测试模式验证码: ", data.data.verification_code)
```
### 5. **频率限制处理**
#### 功能描述
- 验证码发送限制1次/分钟
- 注册限制10次/5分钟
- 提供重试建议和详细错误信息
#### 实现细节
```gdscript
"TOO_MANY_REQUESTS":
result.message = "⏰ 验证码发送过于频繁，请1分钟后再试"
# 显示详细的限制信息
if data.has("throttle_info"):
var throttle_info = data.throttle_info
var reset_time = throttle_info.get("reset_time", "")
if reset_time != "":
result.message += "\n重试时间: " + reset_time
```
### 6. **Toast显示系统优化**
#### 视觉改进
- 增加图标显示（✅成功，❌失败）
- 更丰富的颜色和阴影效果
- 支持智能换行和更大的显示区域
- 更流畅的动画效果
#### 新的Toast样式
```gdscript
# 更深的颜色和更好的对比度
if is_success:
style.bg_color = Color(0.15, 0.7, 0.15, 0.95) # 深绿色
style.border_color = Color(0.2, 0.9, 0.2, 0.9) # 亮绿色边框
else:
style.bg_color = Color(0.7, 0.15, 0.15, 0.95) # 深红色
style.border_color = Color(0.9, 0.2, 0.2, 0.9) # 亮红色边框
# 添加阴影效果
style.shadow_color = Color(0, 0, 0, 0.3)
style.shadow_size = 4
style.shadow_offset = Vector2(2, 2)
```
#### 动画优化
- 增加透明度动画
- 延长显示时间（2秒→3秒）
- 更流畅的滑入滑出效果
### 7. **新增API方法**
#### NetworkManager新增方法
```gdscript
# 重新发送邮箱验证码
func resend_email_verification(email: String, callback: Callable) -> String
# 忘记密码 - 发送重置验证码
func forgot_password(identifier: String, callback: Callable) -> String
# 重置密码
func reset_password(identifier: String, verification_code: String, new_password: String, callback: Callable) -> String
# 修改密码
func change_password(user_id: String, old_password: String, new_password: String, callback: Callable) -> String
# GitHub OAuth登录
func github_login(github_id: String, username: String, nickname: String, email: String, avatar_url: String, callback: Callable) -> String
```
#### ResponseHandler新增处理方法
```gdscript
# 处理重新发送邮箱验证码响应
static func handle_resend_email_verification_response(success: bool, data: Dictionary, error_info: Dictionary) -> ResponseResult
# 处理忘记密码响应
static func handle_forgot_password_response(success: bool, data: Dictionary, error_info: Dictionary) -> ResponseResult
# 处理重置密码响应
static func handle_reset_password_response(success: bool, data: Dictionary, error_info: Dictionary) -> ResponseResult
```
---
## 🔧 技术改进
### 1. **响应处理逻辑优化**
#### 更精确的成功判断
```gdscript
# HTTP成功状态码且业务成功
if (response_code >= 200 and response_code < 300) and success:
is_success = true
# 特殊情况：206测试模式
elif response_code == 206 and error_code == "TEST_MODE_ONLY":
is_success = true
# 201创建成功
elif response_code == 201:
is_success = true
```
#### 更详细的错误类型判断
```gdscript
match response_code:
409: # 资源冲突
return ErrorType.BUSINESS_ERROR
206: # 测试模式
return ErrorType.BUSINESS_ERROR
429: # 频率限制
return ErrorType.BUSINESS_ERROR
```
### 2. **错误消息国际化**
#### 添加表情符号和更友好的提示
- 📧 邮箱相关消息
- 👤 用户相关消息
- 🔑 验证码相关消息
- 🔒 密码相关消息
- ⏰ 时间相关消息
- 🧪 测试模式消息
- 🌐 网络相关消息
### 3. **代码结构优化**
#### 更好的模块化
- 分离不同类型的错误处理方法
- 统一的响应处理接口
- 更清晰的方法命名
#### 更完善的注释
- 详细的方法说明
- 参数和返回值说明
- 使用示例
---
## 🧪 测试验证
### 创建了API测试脚本
- **文件**: `scripts/network/ApiTestScript.gd`
- **功能**: 验证所有更新的API接口逻辑
- **测试用例**:
- 网络连接测试
- 邮箱验证码发送
- 邮箱冲突检测
- 登录功能
- 注册功能
### 测试覆盖的场景
- ✅ 正常成功响应
- ✅ 409邮箱冲突
- ✅ 206测试模式
- ✅ 429频率限制
- ✅ 各种错误状态码
- ✅ Toast显示效果
---
## 📚 使用指南
### 1. **发送邮箱验证码**
```gdscript
# 会自动检查邮箱冲突
var request_id = NetworkManager.send_email_verification("user@example.com", callback)
```
### 2. **处理409冲突**
```gdscript
func callback(success: bool, data: Dictionary, error_info: Dictionary):
var result = ResponseHandler.handle_send_verification_code_response(success, data, error_info)
if error_info.get("response_code") == 409:
# 邮箱已存在，引导用户登录
show_login_suggestion()
```
### 3. **处理测试模式**
```gdscript
# 测试模式下验证码会在控制台显示
if data.get("error_code") == "TEST_MODE_ONLY":
var verification_code = data.data.verification_code
print("测试验证码: ", verification_code)
```
### 4. **处理频率限制**
```gdscript
# 提供重试建议
if error_info.get("response_code") == 429:
show_retry_suggestion(data.get("throttle_info", {}))
```
---
## 🔄 向后兼容性
### 保持的兼容性
- ✅ 现有的API调用方式不变
- ✅ 现有的回调函数签名不变
- ✅ 现有的Toast显示接口不变
### 新增的功能
- ✅ 更丰富的错误处理
- ✅ 更好的用户体验
- ✅ 更详细的状态反馈
---
## 📝 注意事项
### 开发环境
- 测试模式下验证码会在控制台显示
- 206状态码表示测试模式，属于成功响应
- 建议在开发时关注控制台输出
### 生产环境
- 验证码通过真实邮件发送
- 需要正确配置邮件服务
- 频率限制会严格执行
### 错误处理
- 优先检查HTTP状态码
- 再检查业务错误码
- 提供用户友好的错误提示
---
## 🚀 后续计划
### 短期优化
- [ ] 添加更多的API接口支持
- [ ] 优化Toast显示的动画效果
- [ ] 添加音效反馈
### 长期规划
- [ ] 支持多语言错误消息
- [ ] 添加离线模式支持
- [ ] 实现请求重试机制
---
**更新完成时间**: 2025-12-25
**测试状态**: ✅ 已通过基础测试
**部署建议**: 建议在测试环境充分验证后再部署到生产环境

137
docs/cleanup_summary.md Normal file
View File

@@ -0,0 +1,137 @@
# AuthScene 文件清理总结
**清理日期**: 2025-12-25
**清理原因**: 修复Parser Error和优化代码结构
---
## 🔧 修复的问题
### 1. **Parser Error修复**
- **问题**: `scripts/scenes/AuthScene.gd` 第1196行有语法错误 "母和数字"
- **解决**: 完全重写了AuthScene.gd文件，移除了所有语法错误
- **结果**: 文件现在可以正常解析，无语法错误
### 2. **代码结构优化**
- **重构验证逻辑**: 使用StringUtils工具类统一处理验证
- **简化代码**: 移除重复的验证代码
- **提高可维护性**: 更清晰的方法组织和注释
---
## 🗑️ 删除的文件
### 已删除
1. **`scripts/network/NetworkTest.gd`**
- **原因**: 功能重复，已有更完善的ApiTestScript.gd
- **影响**: 无，功能已被ApiTestScript.gd替代
### 保留的文件
1. **`tests/auth/auth_ui_test.gd`** - 保留，用于UI测试
2. **`tests/auth/enhanced_toast_test.gd`** - 保留，用于Toast系统测试
3. **`core/utils/StringUtils.gd`** - 保留，提供通用验证工具
---
## ✅ 优化后的AuthScene.gd结构
### 文件组织
```
AuthScene.gd (约600行，结构清晰)
├── 节点引用和变量定义
├── 初始化和信号连接
├── 按钮事件处理
├── 网络响应处理
├── 验证码冷却管理
├── Toast消息系统
├── UI工具方法
├── 表单验证方法
├── 表单验证事件
└── 资源清理
```
### 主要改进
1. **使用StringUtils**: 统一的验证逻辑
2. **清晰的方法分组**: 按功能组织代码
3. **完整的错误处理**: 支持最新API v1.1.1
4. **优化的Toast系统**: 更好的视觉效果和动画
---
## 🧪 测试验证
### 语法检查
```bash
# 所有文件通过语法检查
✅ scripts/scenes/AuthScene.gd - No diagnostics found
✅ core/managers/NetworkManager.gd - No diagnostics found
✅ core/managers/ResponseHandler.gd - No diagnostics found
```
### 功能测试
- ✅ Toast显示系统正常
- ✅ 表单验证逻辑正确
- ✅ 网络请求处理完整
- ✅ 验证码冷却机制有效
---
## 📊 代码质量提升
### 前后对比
| 指标 | 清理前 | 清理后 | 改进 |
|------|--------|--------|------|
| 语法错误 | 1个 | 0个 | ✅ 修复 |
| 代码行数 | ~1400行 | ~600行 | ✅ 精简57% |
| 重复代码 | 多处 | 无 | ✅ 消除 |
| 可读性 | 中等 | 高 | ✅ 提升 |
| 维护性 | 中等 | 高 | ✅ 提升 |
### 代码质量指标
- **圈复杂度**: 降低
- **代码重复率**: 显著减少
- **方法长度**: 更合理
- **注释覆盖**: 完整
---
## 🔄 兼容性保证
### API兼容性
- ✅ 保持所有公共方法签名不变
- ✅ 保持所有信号定义不变
- ✅ 保持节点引用路径不变
### 功能兼容性
- ✅ 登录功能完整
- ✅ 注册功能完整
- ✅ 验证码功能完整
- ✅ Toast显示功能增强
---
## 📝 后续建议
### 短期
1. **测试验证**: 在实际环境中测试所有功能
2. **性能监控**: 观察Toast动画性能
3. **用户反馈**: 收集UI体验反馈
### 长期
1. **单元测试**: 为验证逻辑添加更多单元测试
2. **集成测试**: 完善端到端测试覆盖
3. **代码审查**: 定期进行代码质量审查
---
## 🎯 总结
通过这次清理，我们成功：
1. **修复了语法错误** - AuthScene.gd现在可以正常解析
2. **优化了代码结构** - 更清晰、更易维护
3. **提升了代码质量** - 减少重复，提高可读性
4. **保持了功能完整** - 所有原有功能都得到保留和增强
5. **删除了冗余文件** - 清理了不必要的测试文件
AuthScene现在是一个干净、高效、易维护的认证界面组件，完全支持最新的API v1.1.1规范。

251
docs/final_update_summary.md Normal file
View File

@@ -0,0 +1,251 @@
# 最终更新总结
**完成日期**: 2025-12-25
**更新内容**: AuthScene文件修复 + Python API测试工具
---
## 🎯 完成的工作
### 1. ✅ AuthScene.gd 文件修复
#### 问题解决
- **修复Parser Error**: 删除了第1196行的语法错误"母和数字"
- **重构代码结构**: 完全重写了AuthScene.gd，代码更清晰、更易维护
- **优化验证逻辑**: 使用StringUtils工具类统一处理表单验证
#### 文件状态
- **语法检查**: ✅ No diagnostics found
- **代码行数**: 约600行（原来~1400行，精简57%）
- **功能完整性**: ✅ 保持所有原有功能
- **API兼容性**: ✅ 完全支持API v1.1.1
### 2. ✅ Python API测试工具
#### 创建的测试脚本
1. **`quick_test.py`** - 快速测试脚本（推荐日常使用）
2. **`api_client_test.py`** - 完整测试套件（全面功能验证）
3. **`requirements.txt`** - Python依赖配置
4. **`run_tests.bat`** - Windows批处理脚本
5. **`run_tests.sh`** - Linux/Mac Shell脚本
#### 测试覆盖范围
- ✅ 应用状态检查
- ✅ 用户认证流程（登录/注册）
- ✅ 邮箱验证流程
- ✅ 验证码功能（发送/验证）
- ✅ 密码重置流程
- ✅ 错误场景测试
- ✅ 频率限制测试
- ✅ API v1.1.1新特性测试
### 3. ✅ 文档更新
#### 新增文档
- **`docs/testing_guide.md`** - 完整的API测试指南
- **`docs/final_update_summary.md`** - 本总结文档
- **`tests/api/README.md`** - 更新了测试说明
#### 更新文档
- **`docs/api_update_log.md`** - API更新日志
- **`docs/cleanup_summary.md`** - 代码清理总结
---
## 🔧 技术改进
### AuthScene.gd 优化
```gdscript
# 优化前的问题
- 语法错误导致无法解析
- 代码重复，维护困难
- 验证逻辑分散
# 优化后的改进
- 无语法错误，结构清晰
- 使用StringUtils统一验证
- 方法分组，易于维护
```
### API测试工具特性
```python
# 完整的API客户端
class APIClient:
- 统一的请求处理
- 详细的错误处理
- 支持所有API端点
- 自动状态码判断
# 智能测试结果
class TestResult:
- 成功/失败判断
- 执行时间统计
- 详细错误信息
- 特殊状态码处理
```
---
## 📊 测试验证
### 语法检查结果
```bash
✅ scripts/scenes/AuthScene.gd - No diagnostics found
✅ core/managers/NetworkManager.gd - No diagnostics found
✅ core/managers/ResponseHandler.gd - No diagnostics found
```
### Python测试工具验证
```bash
# 快速测试
python tests/api/quick_test.py
# 预期结果: 6个基础API测试通过
# 完整测试
python tests/api/api_client_test.py
# 预期结果: 完整业务流程测试通过
```
---
## 🎯 使用指南
### 开发者日常使用
#### 1. 快速API测试
```bash
cd tests/api
python quick_test.py
```
#### 2. 完整功能验证
```bash
cd tests/api
python api_client_test.py
```
#### 3. Windows用户
```bash
cd tests/api
run_tests.bat
```
#### 4. Linux/Mac用户
```bash
cd tests/api
./run_tests.sh
```
### Godot开发者使用
#### 1. 运行AuthScene
- 场景文件正常加载
- Toast系统正常工作
- 网络请求正常处理
#### 2. API测试脚本
```gdscript
# 在Godot中运行
var api_test = preload("res://scripts/network/ApiTestScript.gd").new()
add_child(api_test)
```
---
## 🔍 质量保证
### 代码质量指标
| 指标 | 修复前 | 修复后 | 改进 |
|------|--------|--------|------|
| 语法错误 | 1个 | 0个 | ✅ 完全修复 |
| 代码行数 | ~1400行 | ~600行 | ✅ 精简57% |
| 重复代码 | 多处 | 无 | ✅ 完全消除 |
| 可维护性 | 中等 | 高 | ✅ 显著提升 |
### 功能完整性
- ✅ 登录功能完整保留
- ✅ 注册功能完整保留
- ✅ 验证码功能完整保留
- ✅ Toast显示功能增强
- ✅ 错误处理功能增强
### API兼容性
- ✅ 支持409冲突检测
- ✅ 支持206测试模式
- ✅ 支持429频率限制
- ✅ 支持所有新增错误码
- ✅ 向后兼容旧版本
---
## 📈 项目收益
### 开发效率提升
1. **无需Godot引擎**: Python测试脚本可独立运行
2. **快速验证**: 30秒内完成基础API测试
3. **自动化支持**: 可集成到CI/CD流程
4. **跨平台支持**: Windows/Linux/Mac都可使用
### 代码质量提升
1. **消除语法错误**: AuthScene.gd现在完全可用
2. **减少代码重复**: 使用工具类统一处理
3. **提高可维护性**: 清晰的代码结构和注释
4. **增强错误处理**: 支持最新API规范
### 测试覆盖提升
1. **完整业务流程**: 覆盖所有用户操作场景
2. **错误场景测试**: 验证各种异常情况
3. **性能测试**: 包含频率限制测试
4. **兼容性测试**: 支持不同环境测试
---
## 🚀 后续建议
### 短期优化
1. **集成CI/CD**: 将Python测试脚本集成到自动化流程
2. **监控告警**: 设置API测试失败的通知机制
3. **性能基准**: 建立API响应时间基准线
### 长期规划
1. **测试扩展**: 添加更多边界条件测试
2. **压力测试**: 开发高并发场景测试
3. **安全测试**: 添加安全漏洞检测测试
---
## 📚 相关资源
### 文档链接
- [API文档](api-documentation.md) - 完整API接口说明
- [测试指南](testing_guide.md) - 详细测试使用指南
- [API更新日志](api_update_log.md) - 最新变更记录
### 代码文件
- `scripts/scenes/AuthScene.gd` - 修复后的认证场景
- `tests/api/quick_test.py` - 快速API测试脚本
- `tests/api/api_client_test.py` - 完整API测试套件
### 工具脚本
- `tests/api/run_tests.bat` - Windows测试启动器
- `tests/api/run_tests.sh` - Linux/Mac测试启动器
---
## 🎉 总结
通过这次更新，我们成功：
1. **修复了关键问题** - AuthScene.gd的Parser Error已完全解决
2. **提升了代码质量** - 代码更清晰、更易维护、更高效
3. **增强了测试能力** - 提供了完整的Python API测试工具
4. **改善了开发体验** - 无需Godot引擎即可测试API接口
5. **保证了向后兼容** - 所有原有功能都得到保留和增强
现在开发者可以：
- ✅ 正常使用AuthScene.gd进行认证界面开发
- ✅ 使用Python脚本快速验证API接口
- ✅ 在任何环境下进行API测试
- ✅ 享受更好的错误处理和用户体验
**项目现在处于完全可用状态，支持最新的API v1.1.1规范！** 🚀

362
docs/network_manager_setup.md Normal file
View File

@@ -0,0 +1,362 @@
# NetworkManager 设置指南
## 概述
NetworkManager 是一个统一的网络请求管理器，提供了简洁的API接口和统一的错误处理机制。配合 ResponseHandler，可以大大简化网络请求的处理逻辑。
## 🚀 快速设置
### 1. 设置AutoLoad
在Godot编辑器中：
1. 打开 `Project` → `Project Settings`
2. 切换到 `AutoLoad` 标签
3. 添加新的AutoLoad：
- **Path**: `res://core/managers/NetworkManager.gd`
- **Name**: `NetworkManager`
- **Singleton**: ✅ 勾选
### 2. 项目设置文件配置
在 `project.godot` 文件中会自动添加：
```ini
[autoload]
NetworkManager="*res://core/managers/NetworkManager.gd"
```
### 3. 验证设置
在任何脚本中可以直接使用：
```gdscript
func _ready():
# 直接访问全局单例
var request_id = NetworkManager.login("username", "password", callback)
print("请求ID: ", request_id)
```
## 📚 使用方法
### 基本用法
```gdscript
# 1. 简单的GET请求
var request_id = NetworkManager.get_app_status(func(success, data, error_info):
if success:
print("应用状态: ", data)
else:
print("获取状态失败: ", error_info)
)
# 2. 用户登录
NetworkManager.login("username", "password", func(success, data, error_info):
if success:
print("登录成功: ", data.data.user.username)
else:
print("登录失败: ", error_info.message)
)
# 3. 发送验证码
NetworkManager.send_email_verification("test@example.com", func(success, data, error_info):
if success:
print("验证码已发送")
else:
print("发送失败: ", error_info.message)
)
```
### 配合ResponseHandler使用
```gdscript
# 在回调函数中使用ResponseHandler处理响应
func _on_login_response(success: bool, data: Dictionary, error_info: Dictionary):
# 使用ResponseHandler统一处理
var result = ResponseHandler.handle_login_response(success, data, error_info)
# 显示Toast消息
show_toast(result.message, result.success)
# 执行自定义动作
if result.custom_action.is_valid():
result.custom_action.call()
# 处理成功情况
if result.success:
# 登录成功的处理逻辑
login_success.emit(username)
```
### 全局事件监听
```gdscript
func _ready():
# 监听全局网络事件
NetworkManager.request_completed.connect(_on_global_request_completed)
NetworkManager.request_failed.connect(_on_global_request_failed)
func _on_global_request_completed(request_id: String, success: bool, data: Dictionary):
print("全局请求完成: ", request_id)
# 可以在这里隐藏全局加载指示器
func _on_global_request_failed(request_id: String, error_type: String, message: String):
print("全局请求失败: ", request_id, " - ", message)
# 可以在这里显示全局错误提示
```
## 🔧 高级功能
### 请求管理
```gdscript
# 取消特定请求
var request_id = NetworkManager.login("user", "pass", callback)
NetworkManager.cancel_request(request_id)
# 取消所有请求
NetworkManager.cancel_all_requests()
# 检查请求状态
if NetworkManager.is_request_active(request_id):
print("请求仍在进行中")
# 获取活动请求数量
print("当前活动请求: ", NetworkManager.get_active_request_count())
```
### 自定义请求
```gdscript
# 发送自定义POST请求
var custom_data = {
"custom_field": "custom_value"
}
var request_id = NetworkManager.post_request("/custom/endpoint", custom_data, func(success, data, error_info):
print("自定义请求完成")
)
# 发送自定义GET请求
NetworkManager.get_request("/custom/data", func(success, data, error_info):
print("获取自定义数据")
)
```
## 📋 API接口列表
### 认证相关
| 方法 | 参数 | 说明 |
|------|------|------|
| `login(identifier, password, callback)` | 用户标识符、密码、回调函数 | 用户登录 |
| `verification_code_login(identifier, code, callback)` | 用户标识符、验证码、回调函数 | 验证码登录 |
| `send_login_verification_code(identifier, callback)` | 用户标识符、回调函数 | 发送登录验证码 |
| `register(username, password, nickname, email, code, callback)` | 注册信息、回调函数 | 用户注册 |
| `send_email_verification(email, callback)` | 邮箱、回调函数 | 发送邮箱验证码 |
| `verify_email(email, code, callback)` | 邮箱、验证码、回调函数 | 验证邮箱 |
### 通用请求
| 方法 | 参数 | 说明 |
|------|------|------|
| `get_request(endpoint, callback, timeout)` | 端点、回调函数、超时时间 | GET请求 |
| `post_request(endpoint, data, callback, timeout)` | 端点、数据、回调函数、超时时间 | POST请求 |
| `put_request(endpoint, data, callback, timeout)` | 端点、数据、回调函数、超时时间 | PUT请求 |
| `delete_request(endpoint, callback, timeout)` | 端点、回调函数、超时时间 | DELETE请求 |
### 请求管理
| 方法 | 参数 | 说明 |
|------|------|------|
| `cancel_request(request_id)` | 请求ID | 取消特定请求 |
| `cancel_all_requests()` | 无 | 取消所有请求 |
| `is_request_active(request_id)` | 请求ID | 检查请求是否活动 |
| `get_active_request_count()` | 无 | 获取活动请求数量 |
| `get_request_info(request_id)` | 请求ID | 获取请求详细信息 |
## 🎯 ResponseHandler 使用
### 支持的响应类型
| 方法 | 说明 |
|------|------|
| `handle_login_response()` | 处理登录响应 |
| `handle_verification_code_login_response()` | 处理验证码登录响应 |
| `handle_send_verification_code_response()` | 处理发送验证码响应 |
| `handle_send_login_code_response()` | 处理发送登录验证码响应 |
| `handle_register_response()` | 处理注册响应 |
| `handle_verify_email_response()` | 处理邮箱验证响应 |
| `handle_network_test_response()` | 处理网络测试响应 |
| `handle_response(operation_type, ...)` | 通用响应处理 |
### ResponseResult 结构
```gdscript
class ResponseResult:
var success: bool # 是否成功
var message: String # 显示消息
var toast_type: String # Toast类型 ("success" 或 "error")
var data: Dictionary # 响应数据
var should_show_toast: bool # 是否显示Toast
var custom_action: Callable # 自定义动作
```
## 🔄 迁移指南
### 从旧版AuthScene迁移
#### 旧代码：
```gdscript
func send_login_request(username: String, password: String):
var url = API_BASE_URL + "/auth/login"
var headers = ["Content-Type: application/json"]
var body = JSON.stringify({
"username": username,
"password": password
})
current_request_type = "login"
var error = http_request.request(url, headers, HTTPClient.METHOD_POST, body)
if error != OK:
show_toast('网络请求失败', false)
restore_button(login_btn, "密码登录")
current_request_type = ""
```
#### 新代码：
```gdscript
func send_login_request(username: String, password: String):
NetworkManager.login(username, password, _on_login_response)
func _on_login_response(success: bool, data: Dictionary, error_info: Dictionary):
var result = ResponseHandler.handle_login_response(success, data, error_info)
show_toast(result.message, result.success)
if result.success:
login_success.emit(username)
```
### 迁移步骤
1. **设置AutoLoad**：按照上述步骤设置NetworkManager为AutoLoad
2. **替换请求方法**：将直接的HTTP请求替换为NetworkManager调用
3. **统一响应处理**：使用ResponseHandler处理所有响应
4. **移除重复代码**：删除重复的错误处理和请求构建代码
5. **测试功能**：确保所有功能正常工作
## 🧪 测试
### 单元测试示例
```gdscript
extends GutTest
func test_network_manager_login():
var network_manager = NetworkManager.new()
var callback_called = false
var callback_success = false
var callback = func(success, data, error_info):
callback_called = true
callback_success = success
var request_id = network_manager.login("testuser", "password", callback)
assert_ne(request_id, "", "应该返回有效的请求ID")
# 等待请求完成
await get_tree().create_timer(2.0).timeout
assert_true(callback_called, "回调函数应该被调用")
```
### 集成测试
```gdscript
func test_complete_login_flow():
# 1. 发送登录验证码
var code_sent = false
NetworkManager.send_login_verification_code("test@example.com", func(success, data, error_info):
code_sent = success
)
await get_tree().create_timer(1.0).timeout
assert_true(code_sent, "验证码应该发送成功")
# 2. 使用验证码登录
var login_success = false
NetworkManager.verification_code_login("test@example.com", "123456", func(success, data, error_info):
login_success = success
)
await get_tree().create_timer(1.0).timeout
assert_true(login_success, "验证码登录应该成功")
```
## 🔍 调试
### 启用详细日志
在NetworkManager中，所有请求都会输出详细的调试信息：
```
=== 发送网络请求 ===
请求ID: req_1
URL: https://whaletownend.xinghangee.icu/auth/login
方法: POST
Headers: ["Content-Type: application/json"]
Body: {"username":"testuser","password":"password123"}
发送结果: 0
=== 网络请求完成 ===
请求ID: req_1
结果: 0
状态码: 200
响应头: ["content-type: application/json"]
响应体长度: 156 字节
响应内容: {"success":true,"data":{"user":{"username":"testuser"}}}
```
### 常见问题
1. **请求ID为空**：检查NetworkManager是否正确设置为AutoLoad
2. **回调未调用**：检查网络连接和API地址是否正确
3. **解析错误**：检查服务器返回的JSON格式是否正确
## 📈 性能优化
### 请求池管理
NetworkManager自动管理请求资源：
- 自动清理完成的请求
- 防止内存泄漏
- 支持请求取消
### 最佳实践
1. **及时取消不需要的请求**
2. **使用合适的超时时间**
3. **避免同时发送大量请求**
4. **在场景切换时取消活动请求**
```gdscript
func _exit_tree():
# 场景退出时取消所有请求
NetworkManager.cancel_all_requests()
```
## 🎉 总结
使用NetworkManager和ResponseHandler的优势：
- ✅ **代码简洁**：一行代码发送请求
- ✅ **统一处理**：所有错误情况统一处理
- ✅ **易于维护**：网络逻辑与UI逻辑分离
- ✅ **功能强大**：支持请求管理、超时、取消等
- ✅ **调试友好**：详细的日志和错误信息
- ✅ **类型安全**：明确的回调参数类型
- ✅ **可扩展**：易于添加新的API接口
通过这套统一的网络管理系统，你的项目将拥有更好的代码结构和更强的可维护性！

28
docs/setup.md Normal file
View File

@@ -0,0 +1,28 @@
# 项目设置指南
## AutoLoad 配置
在 Godot 编辑器中设置 NetworkManager 为全局单例：
1. 打开 `Project` → `Project Settings`
2. 切换到 `AutoLoad` 标签
3. 添加新的 AutoLoad：
- **Path**: `res://core/managers/NetworkManager.gd`
- **Name**: `NetworkManager`
- **Singleton**: ✅ 勾选
## 验证设置
在任何脚本中可以直接使用：
```gdscript
func _ready():
var request_id = NetworkManager.login("username", "password", callback)
print("请求ID: ", request_id)
```
## 注意事项
- 确保 NetworkManager.gd 和 ResponseHandler.gd 文件存在
- 重启 Godot 编辑器以确保 AutoLoad 生效
- 检查控制台是否有错误信息

312
docs/testing_guide.md Normal file
View File

@@ -0,0 +1,312 @@
# API接口测试指南
**更新日期**: 2025-12-25
**适用版本**: API v1.1.1
---
## 🎯 测试概述
本指南提供了完整的API接口测试方案，包括Godot内置测试和独立的Python测试脚本，确保在不同环境下都能有效验证API功能。
---
## 📋 测试工具对比
| 测试工具 | 适用场景 | 优势 | 使用难度 |
|----------|----------|------|----------|
| **Python快速测试** | 日常检查 | 快速、简单 | ⭐ |
| **Python完整测试** | 全面验证 | 覆盖全面、详细 | ⭐⭐ |
| **Godot内置测试** | 引擎环境 | 真实环境、UI测试 | ⭐⭐⭐ |
| **简单连接测试** | 基础检查 | 最小依赖 | ⭐ |
---
## 🚀 快速开始
### 1. Python测试（推荐）
#### 安装依赖
```bash
cd tests/api
pip install -r requirements.txt
```
#### 运行快速测试
```bash
# Windows
run_tests.bat
# Linux/Mac
./run_tests.sh
# 或直接运行
python quick_test.py
```
### 2. Godot测试
#### 运行API测试脚本
```gdscript
# 在Godot中运行
var api_test = preload("res://scripts/network/ApiTestScript.gd").new()
add_child(api_test)
```
#### 运行UI测试
```bash
# 打开Godot项目
# 运行 tests/auth/auth_ui_test.tscn 场景
```
---
## 📊 测试类型详解
### 1. 快速测试 (`quick_test.py`)
**用途**: 日常开发中的快速验证
**时间**: 约30秒
**覆盖**: 基础API端点
```bash
python tests/api/quick_test.py
```
**测试内容**:
- ✅ 服务器状态检查
- ✅ 邮箱验证码发送
- ✅ 用户登录/注册
- ✅ 基础错误处理
### 2. 完整测试 (`api_client_test.py`)
**用途**: 发布前的全面验证
**时间**: 约2-3分钟
**覆盖**: 所有业务流程
```bash
python tests/api/api_client_test.py
```
**测试内容**:
- 🔄 完整的用户注册流程
- 🔄 邮箱验证流程
- 🔄 登录流程（密码+验证码）
- 🔄 密码重置流程
- 🔄 错误场景测试
- 🔄 频率限制测试
### 3. Godot内置测试
**用途**: 引擎环境下的真实测试
**时间**: 根据测试场景而定
**覆盖**: UI交互和网络请求
#### API测试脚本
```gdscript
# 文件: scripts/network/ApiTestScript.gd
# 功能: 验证NetworkManager和ResponseHandler
```
#### UI测试场景
```gdscript
# 文件: tests/auth/auth_ui_test.tscn
# 功能: 测试认证界面的各种响应情况
```
---
## 🔧 测试配置
### API服务器配置
```python
# 默认配置
API_BASE_URL = "https://whaletownend.xinghangee.icu"
# 本地开发配置
API_BASE_URL = "http://localhost:3000"
```
### 测试数据配置
```python
# 测试用户信息
TEST_EMAIL = "test@example.com"
TEST_USERNAME = "testuser"
TEST_PASSWORD = "password123"
```
### 超时配置
```python
DEFAULT_TIMEOUT = 30 # 秒
```
---
## 📈 测试结果解读
### 成功标志
- ✅ **测试通过** - 功能正常
- 🧪 **测试模式** - 开发环境，验证码在响应中返回
- 🔑 **获取验证码** - 成功获取到测试验证码
### 警告标志
- ⚠️ **资源冲突** - 409状态码，用户名/邮箱已存在
- ⏰ **频率限制** - 429状态码，请求过于频繁
### 错误标志
- ❌ **测试失败** - 功能异常，需要检查
- 🔌 **连接失败** - 网络问题或服务器不可用
- 📊 **状态码异常** - HTTP状态码不符合预期
### 示例输出解读
```
🧪 测试: 发送邮箱验证码
📡 POST https://whaletownend.xinghangee.icu/auth/send-email-verification
📦 数据: {"email": "test@example.com"}
📊 状态码: 206
🧪 测试模式响应
🔑 验证码: 123456
✅ 测试通过
```
**解读**:
- 请求成功发送到正确的端点
- 返回206状态码表示测试模式
- 成功获取验证码123456
- 整体测试通过
---
## 🐛 故障排除
### 常见问题及解决方案
#### 1. 连接失败
**症状**: `❌ 连接失败` 或 `网络连接异常`
**解决方案**:
```bash
# 检查网络连接
ping whaletownend.xinghangee.icu
# 检查服务器状态
curl https://whaletownend.xinghangee.icu
# 检查防火墙设置
```
#### 2. 频率限制
**症状**: `⏰ 请求过于频繁` 或 `429状态码`
**解决方案**:
- 等待冷却时间（通常1分钟）
- 使用不同的测试邮箱
- 检查API频率限制配置
#### 3. 验证码错误
**症状**: `验证码错误或已过期`
**解决方案**:
- 确保使用最新获取的验证码
- 检查验证码是否在5分钟有效期内
- 在测试模式下使用响应中返回的验证码
#### 4. 参数验证失败
**症状**: `400状态码` 或 `参数验证失败`
**解决方案**:
- 检查请求参数格式
- 确认必填字段都已提供
- 验证邮箱、用户名格式是否正确
#### 5. Python依赖问题
**症状**: `ModuleNotFoundError: No module named 'requests'`
**解决方案**:
```bash
# 安装依赖
pip install requests
# 或使用requirements.txt
pip install -r tests/api/requirements.txt
# 检查Python版本
python --version
```
---
## 📝 测试最佳实践
### 1. 测试前准备
- 确认API服务器正常运行
- 检查网络连接稳定
- 准备测试数据（邮箱、用户名等）
### 2. 测试执行
- 按照从简单到复杂的顺序执行测试
- 记录测试结果和异常情况
- 对失败的测试进行重试验证
### 3. 测试后分析
- 分析测试结果，识别问题模式
- 更新测试用例覆盖新发现的场景
- 文档化测试发现的问题和解决方案
### 4. 持续集成
- 将测试脚本集成到CI/CD流程
- 设置自动化测试触发条件
- 建立测试结果通知机制
---
## 🔄 测试流程建议
### 开发阶段
1. **快速测试** - 每次代码修改后运行
2. **功能测试** - 新功能开发完成后运行
3. **回归测试** - 修复bug后运行
### 测试阶段
1. **完整测试** - 每日构建后运行
2. **压力测试** - 定期运行频率限制测试
3. **兼容性测试** - 不同环境下运行测试
### 发布阶段
1. **预发布测试** - 生产环境部署前运行
2. **冒烟测试** - 生产环境部署后运行
3. **监控测试** - 生产环境持续监控
---
## 📚 相关文档
- [API文档](api-documentation.md) - 完整的API接口说明
- [API更新日志](api_update_log.md) - 最新的API变更记录
- [项目结构说明](project_structure.md) - 项目整体架构
- [网络管理器设置](network_manager_setup.md) - Godot网络配置
---
## 🤝 贡献指南
### 添加新测试
1. 在对应的测试文件中添加新的测试方法
2. 遵循现有的测试模式和命名规范
3. 添加适当的错误处理和结果验证
4. 更新相关文档
### 报告问题
1. 提供详细的错误信息和复现步骤
2. 包含测试环境信息（Python版本、操作系统等）
3. 附上相关的日志和截图
### 改进建议
1. 提出测试覆盖的改进建议
2. 优化测试执行效率的方案
3. 增强测试结果可读性的想法
---
**测试愉快！🎉**

200
docs/web_deployment_changelog.md Normal file
View File

@@ -0,0 +1,200 @@
# Web部署更新日志
## v1.0.0 (2025-12-25)
### 🎉 初始版本
- 创建完整的Web导出解决方案
- 支持Windows、Linux、macOS平台
- 自动化构建和部署脚本
### 📁 文件结构
```
scripts/
├── build_web.bat # Windows导出脚本
├── build_web.sh # Linux/macOS导出脚本
├── serve_web.bat # Windows本地服务器
└── serve_web.sh # Linux/macOS本地服务器
docs/
├── web_deployment_guide.md # 完整部署指南
└── web_deployment_changelog.md # 更新日志
```
### ✨ 主要特性
#### 自动化导出
- 智能检测Godot安装路径
- 验证项目文件完整性
- 自动备份旧版本
- 生成部署配置文件
- 文件大小统计和优化建议
#### 本地测试服务器
- 自动端口检测和冲突处理
- 支持局域网访问
- 实时文件监控
- 自动打开浏览器
- 详细的调试信息
#### 服务器配置
- Apache .htaccess自动生成
- Nginx配置示例
- MIME类型配置
- CORS头设置
- 文件压缩优化
- 缓存策略配置
#### 部署优化
- 资源文件压缩
- 渐进式Web应用支持
- 性能监控
- 错误诊断工具
### 🔧 技术规格
#### 支持的平台
- **开发环境**: Windows 10+, macOS 10.15+, Ubuntu 18.04+
- **目标浏览器**: Chrome 80+, Firefox 75+, Safari 13+, Edge 80+
- **Godot版本**: 4.5+
#### 系统要求
- **Godot Engine**: 4.5或更高版本
- **Python**: 3.6+（用于本地测试）
- **磁盘空间**: 至少100MB可用空间
- **内存**: 建议4GB以上
#### 网络要求
- **带宽**: 建议10Mbps以上（用于资源下载）
- **端口**: 8000（默认），8080（备用）
- **协议**: HTTP/HTTPS
### 📋 配置选项
#### 导出设置
```
导出预设: Web
渲染方法: gl_compatibility
纹理压缩: 启用VRAM压缩
文件格式: WASM + PCK
```
#### 服务器设置
```
默认端口: 8000
备用端口: 8080
文档根目录: build/web/
索引文件: index.html
```
### 🚀 性能优化
#### 文件大小优化
- WASM文件压缩率: ~30%
- 纹理压缩: ETC2/ASTC格式
- 音频压缩: OGG Vorbis
- 脚本压缩: 移除调试信息
#### 加载速度优化
- 启用Gzip压缩
- 设置缓存策略
- 使用CDN加速
- 实现预加载机制
### 🛡️ 安全特性
#### 跨域安全
- CORS头配置
- CSP策略设置
- XSS防护
- 点击劫持防护
#### 文件安全
- MIME类型验证
- 文件大小限制
- 路径遍历防护
- 敏感文件隐藏
### 📊 监控和诊断
#### 构建监控
- 文件完整性检查
- 大小统计分析
- 构建时间记录
- 错误日志收集
#### 运行时监控
- 性能指标收集
- 错误报告系统
- 用户行为分析
- 网络请求监控
### 🔄 兼容性
#### 浏览器兼容性
| 浏览器 | 最低版本 | 推荐版本 | 支持特性 |
|--------|----------|----------|----------|
| Chrome | 80 | 最新 | 完整支持 |
| Firefox | 75 | 最新 | 完整支持 |
| Safari | 13 | 最新 | 基本支持 |
| Edge | 80 | 最新 | 完整支持 |
#### 移动端兼容性
- iOS Safari 13+
- Android Chrome 80+
- 响应式设计支持
- 触摸操作优化
### 📝 已知问题
#### 当前限制
1. **文件系统访问**: Web版本无法直接访问本地文件系统
2. **性能差异**: 相比原生版本可能有10-30%的性能损失
3. **内存限制**: 受浏览器内存限制影响
4. **网络依赖**: 需要稳定的网络连接
#### 解决方案
1. 使用IndexedDB存储本地数据
2. 优化资源和代码以提升性能
3. 实现内存管理和垃圾回收
4. 添加离线缓存支持
### 🔮 未来计划
#### v1.1.0 (计划中)
- [ ] PWA（渐进式Web应用）完整支持
- [ ] 离线模式实现
- [ ] 自动更新机制
- [ ] 性能分析工具
#### v1.2.0 (计划中)
- [ ] WebRTC多人游戏支持
- [ ] WebGL 2.0优化
- [ ] 移动端手势优化
- [ ] 云存档同步
#### v2.0.0 (远期计划)
- [ ] WebAssembly SIMD支持
- [ ] Web Workers多线程
- [ ] WebXR虚拟现实支持
- [ ] 边缘计算集成
### 📞 技术支持
#### 问题报告
如遇到问题，请提供以下信息：
1. 操作系统和版本
2. 浏览器类型和版本
3. Godot版本
4. 错误日志和截图
5. 复现步骤
#### 联系方式
- 项目文档: `docs/web_deployment_guide.md`
- 构建日志: `build/web/server.log`
- 部署信息: `build/web/deploy_info.json`
---
**维护者**: 鲸鱼镇开发团队
**最后更新**: 2025-12-25
**文档版本**: 1.0.0

553
docs/web_deployment_guide.md Normal file
View File

@@ -0,0 +1,553 @@
# Web部署完整指南
**版本**: 1.0.0
**更新时间**: 2025-12-25
**适用于**: Godot 4.5+ 项目
## 📋 目录
1. [导出准备](#导出准备)
2. [Godot编辑器配置](#godot编辑器配置)
3. [自动化导出脚本](#自动化导出脚本)
4. [本地测试](#本地测试)
5. [生产环境部署](#生产环境部署)
6. [服务器配置](#服务器配置)
7. [性能优化](#性能优化)
8. [常见问题解决](#常见问题解决)
---
## 🚀 导出准备
### 系统要求
- Godot 4.5+
- Python 3.x（用于本地测试服务器）
- Web服务器（Apache/Nginx/IIS等）
### 项目结构检查
确保项目结构完整：
```
whaleTown/
├── assets/ # 游戏资源
├── core/ # 核心系统
├── scenes/ # 场景文件
├── scripts/ # 脚本文件
├── docs/ # 文档
├── build/ # 导出目录（自动创建）
└── project.godot # 项目配置
```
---
## ⚙️ Godot编辑器配置
### 1. 下载导出模板
1. 打开Godot编辑器
2. 点击 `Project` → `Export...`
3. 点击 `Manage Export Templates...`
4. 点击 `Download and Install` 下载Godot 4.5导出模板
5. 等待下载完成
### 2. 创建Web导出预设
1. 在Export窗口中点击 `Add...`
2. 选择 `Web` 平台
3. 配置以下设置：
#### 基本设置
```
Name: Web
Export Path: build/web/index.html
Runnable: ✓ 启用
Dedicated Server: ✗ 禁用
```
#### Web选项
```
Variant: release
Vram Texture Compression: ✓ 启用
Export Type: Regular
Custom HTML Shell: res://assets/web/custom_shell.html
Head Include: (留空，已在自定义模板中配置)
```
#### 高级选项
```
Custom HTML Shell: res://assets/web/custom_shell.html
Progressive Web App: ✓ 启用（可选）
Icon 144x144: res://icon.svg
Icon 180x180: res://icon.svg
Icon 512x512: res://icon.svg
```
### 3. 项目设置优化
在 `Project Settings` 中配置：
#### 渲染设置
```
Rendering > Renderer:
- Rendering Method: gl_compatibility
- Rendering Method Mobile: gl_compatibility
Rendering > Textures:
- VRAM Compression > Import ETC2 ASTC: ✓
```
#### 网络设置
```
Network > SSL:
- Certificates Bundle: (如果需要HTTPS API调用)
```
---
## 🔧 自动化导出脚本
### Windows批处理脚本
创建 `scripts/build_web.bat`：
```batch
@echo off
setlocal enabledelayedexpansion
echo ========================================
echo 鲸鱼镇 Web版本导出工具
echo ========================================
echo.
REM 配置变量
set "PROJECT_NAME=whaleTown"
set "BUILD_DIR=build\web"
set "GODOT_PATH=C:\Program Files\Godot\Godot.exe"
set "EXPORT_PRESET=Web"
REM 检查Godot是否存在
if not exist "%GODOT_PATH%" (
echo [错误] 未找到Godot可执行文件: %GODOT_PATH%
echo 请修改脚本中的GODOT_PATH变量
pause
exit /b 1
)
REM 创建构建目录
echo [信息] 创建构建目录...
if not exist "build" mkdir "build"
if not exist "%BUILD_DIR%" mkdir "%BUILD_DIR%"
REM 清理旧文件
echo [信息] 清理旧的导出文件...
if exist "%BUILD_DIR%\*" del /q "%BUILD_DIR%\*"
REM 导出项目
echo [信息] 开始导出Web版本...
echo 导出路径: %BUILD_DIR%\index.html
echo.
"%GODOT_PATH%" --headless --export-release "%EXPORT_PRESET%" "%BUILD_DIR%\index.html"
if %ERRORLEVEL% neq 0 (
echo [错误] 导出失败！错误代码: %ERRORLEVEL%
pause
exit /b %ERRORLEVEL%
)
REM 复制额外文件
echo [信息] 复制配置文件...
copy "web\*.json" "%BUILD_DIR%\" >nul 2>&1
copy "web\*.ico" "%BUILD_DIR%\" >nul 2>&1
REM 生成部署信息
echo [信息] 生成部署信息...
echo {> "%BUILD_DIR%\deploy_info.json"
echo "project": "%PROJECT_NAME%",>> "%BUILD_DIR%\deploy_info.json"
echo "version": "1.0.0",>> "%BUILD_DIR%\deploy_info.json"
echo "build_time": "%date% %time%",>> "%BUILD_DIR%\deploy_info.json"
echo "platform": "web">> "%BUILD_DIR%\deploy_info.json"
echo }>> "%BUILD_DIR%\deploy_info.json"
echo.
echo ========================================
echo 导出完成！
echo ========================================
echo 导出位置: %BUILD_DIR%\
echo 文件大小:
for %%f in ("%BUILD_DIR%\*") do echo %%~nxf: %%~zf bytes
echo.
echo 下一步:
echo 1. 运行 scripts\serve_web.bat 进行本地测试
echo 2. 将 %BUILD_DIR%\ 目录上传到Web服务器
echo.
pause
```
### 本地测试服务器脚本
创建 `scripts/serve_web.bat`：
```batch
@echo off
setlocal enabledelayedexpansion
echo ========================================
echo 鲸鱼镇 本地Web服务器
echo ========================================
echo.
set "BUILD_DIR=build\web"
set "PORT=8000"
REM 检查导出文件
if not exist "%BUILD_DIR%\index.html" (
echo [错误] 未找到Web导出文件！
echo 请先运行 scripts\build_web.bat 导出项目
echo.
pause
exit /b 1
)
REM 检查Python
python --version >nul 2>&1
if %ERRORLEVEL% neq 0 (
echo [错误] 未找到Python！
echo 请安装Python 3.x: https://python.org
echo.
pause
exit /b 1
)
REM 显示文件信息
echo [信息] Web文件信息:
for %%f in ("%BUILD_DIR%\*") do (
set "size=%%~zf"
set /a "size_mb=!size!/1024/1024"
echo %%~nxf: !size_mb! MB
)
echo.
echo [信息] 启动本地服务器...
echo 端口: %PORT%
echo 目录: %BUILD_DIR%
echo.
echo ========================================
echo 在浏览器中访问: http://localhost:%PORT%
echo 按 Ctrl+C 停止服务器
echo ========================================
echo.
REM 切换到构建目录并启动服务器
cd "%BUILD_DIR%"
python -m http.server %PORT%
echo.
echo 服务器已停止
pause
```
### Linux/macOS脚本
创建 `scripts/build_web.sh`：
```bash
#!/bin/bash
echo "========================================"
echo " 鲸鱼镇 Web版本导出工具"
echo "========================================"
echo
# 配置变量
PROJECT_NAME="whaleTown"
BUILD_DIR="build/web"
GODOT_PATH="/usr/local/bin/godot" # 根据实际安装路径修改
EXPORT_PRESET="Web"
# 检查Godot
if [ ! -f "$GODOT_PATH" ]; then
echo "[错误] 未找到Godot: $GODOT_PATH"
echo "请修改脚本中的GODOT_PATH变量"
exit 1
fi
# 创建构建目录
echo "[信息] 创建构建目录..."
mkdir -p "$BUILD_DIR"
# 清理旧文件
echo "[信息] 清理旧文件..."
rm -f "$BUILD_DIR"/*
# 导出项目
echo "[信息] 开始导出Web版本..."
"$GODOT_PATH" --headless --export-release "$EXPORT_PRESET" "$BUILD_DIR/index.html"
if [ $? -ne 0 ]; then
echo "[错误] 导出失败！"
exit 1
fi
# 生成部署信息
echo "[信息] 生成部署信息..."
cat > "$BUILD_DIR/deploy_info.json" << EOF
{
"project": "$PROJECT_NAME",
"version": "1.0.0",
"build_time": "$(date)",
"platform": "web"
}
EOF
echo
echo "========================================"
echo " 导出完成！"
echo "========================================"
echo "导出位置: $BUILD_DIR/"
echo
echo "下一步:"
echo "1. 运行 scripts/serve_web.sh 进行本地测试"
echo "2. 将 $BUILD_DIR/ 目录上传到Web服务器"
echo
```
---
## 🌐 生产环境部署
### 1. 文件上传清单
确保上传以下文件到Web服务器：
```
build/web/
├── index.html # 主HTML文件
├── index.js # JavaScript引导文件
├── index.wasm # WebAssembly主文件
├── index.pck # Godot资源包
├── index.worker.js # Web Worker文件
├── favicon.ico # 网站图标
└── deploy_info.json # 部署信息（可选）
```
### 2. 目录权限设置
```bash
# Linux服务器权限设置
chmod 644 build/web/*
chmod 755 build/web/
```
### 3. 域名配置
- 确保域名正确解析到服务器
- 配置SSL证书（推荐使用Let's Encrypt）
- 设置CDN加速（可选）
---
## 🔧 服务器配置
### Apache配置 (.htaccess)
```apache
# MIME类型配置
AddType application/wasm .wasm
AddType application/octet-stream .pck
AddType application/javascript .js
# 启用压缩
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/html text/css application/javascript application/wasm
AddOutputFilterByType DEFLATE application/json application/xml
</IfModule>
# 缓存控制
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType application/wasm "access plus 1 month"
ExpiresByType application/octet-stream "access plus 1 month"
ExpiresByType application/javascript "access plus 1 week"
ExpiresByType text/html "access plus 1 hour"
</IfModule>
# CORS配置（如果需要）
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS"
Header set Access-Control-Allow-Headers "Content-Type, Authorization"
# SharedArrayBuffer支持
Header set Cross-Origin-Embedder-Policy "require-corp"
Header set Cross-Origin-Opener-Policy "same-origin"
</IfModule>
# 安全配置
<IfModule mod_headers.c>
Header always set X-Content-Type-Options nosniff
Header always set X-Frame-Options DENY
Header always set X-XSS-Protection "1; mode=block"
</IfModule>
```
### Nginx配置
```nginx
server {
listen 80;
listen 443 ssl http2;
server_name yourdomain.com;
# SSL配置
ssl_certificate /path/to/certificate.crt;
ssl_certificate_key /path/to/private.key;
root /var/www/whaletown/build/web;
index index.html;
# MIME类型
location ~* \.wasm$ {
add_header Content-Type application/wasm;
expires 1M;
add_header Cache-Control "public, immutable";
}
location ~* \.pck$ {
add_header Content-Type application/octet-stream;
expires 1M;
add_header Cache-Control "public, immutable";
}
location ~* \.js$ {
add_header Content-Type application/javascript;
expires 1w;
}
# 压缩配置
gzip on;
gzip_vary on;
gzip_min_length 1024;
gzip_types
text/html
text/css
application/javascript
application/wasm
application/json;
# CORS配置
add_header Access-Control-Allow-Origin "*" always;
add_header Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS" always;
add_header Access-Control-Allow-Headers "Content-Type, Authorization" always;
# SharedArrayBuffer支持
add_header Cross-Origin-Embedder-Policy "require-corp" always;
add_header Cross-Origin-Opener-Policy "same-origin" always;
# 安全头
add_header X-Content-Type-Options nosniff always;
add_header X-Frame-Options DENY always;
add_header X-XSS-Protection "1; mode=block" always;
# 主页面
location / {
try_files $uri $uri/ /index.html;
}
# API代理（如果需要）
location /api/ {
proxy_pass https://whaletownend.xinghangee.icu/;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
}
}
```
---
## ⚡ 性能优化
### 1. 资源优化
- **纹理压缩**: 启用VRAM纹理压缩
- **音频压缩**: 使用OGG格式，调整比特率
- **模型优化**: 减少多边形数量，优化LOD
### 2. 代码优化
```gdscript
# 在Web平台禁用不必要的功能
func _ready():
if OS.has_feature("web"):
# 禁用文件系统操作
# 优化渲染设置
get_viewport().render_target_update_mode = Viewport.UPDATE_WHEN_VISIBLE
```
### 3. 加载优化
- 使用资源预加载
- 实现渐进式加载
- 显示加载进度
---
## 🐛 常见问题解决
### 1. SharedArrayBuffer错误
**问题**: 控制台显示SharedArrayBuffer相关错误
**解决**: 配置正确的HTTP头：
```
Cross-Origin-Embedder-Policy: require-corp
Cross-Origin-Opener-Policy: same-origin
```
### 2. 文件加载失败
**问题**: WASM或PCK文件加载失败
**解决**:
- 检查MIME类型配置
- 确保文件路径正确
- 检查服务器权限
### 3. API请求失败
**问题**: 网络请求被CORS阻止
**解决**:
- 配置服务器CORS头
- 使用API代理
- 检查API服务器配置
### 4. 性能问题
**问题**: Web版本运行缓慢
**解决**:
- 启用WebGL2
- 优化资源大小
- 使用性能分析工具
### 5. 音频问题
**问题**: 音频无法播放
**解决**:
- 用户交互后才能播放音频
- 使用Web兼容的音频格式
- 检查浏览器音频策略
---
## 📊 部署检查清单
### 导出前检查
- [ ] Godot导出模板已安装
- [ ] Web导出预设已配置
- [ ] 项目设置已优化
- [ ] 资源文件已压缩
### 部署前检查
- [ ] 所有文件已上传
- [ ] 服务器MIME类型已配置
- [ ] CORS设置已配置
- [ ] SSL证书已安装
### 部署后测试
- [ ] 页面正常加载
- [ ] 游戏功能正常
- [ ] 网络请求正常
- [ ] 音频播放正常
- [ ] 移动端兼容性
---
## 📞 技术支持
如果遇到问题，请检查：
1. 浏览器开发者工具的控制台错误
2. 网络请求是否成功
3. 服务器配置是否正确
4. Godot版本是否兼容
**更新日志**: 查看 `docs/web_deployment_changelog.md`

164
scripts/README.md Normal file
View File

@@ -0,0 +1,164 @@
# 鲸鱼镇 Web导出脚本
这个目录包含了将鲸鱼镇项目导出为Web版本的完整脚本集合。
## 📁 文件说明
### Windows脚本
- `build_web.bat` - Web版本导出脚本
- `serve_web.bat` - 本地测试服务器脚本
### Linux/macOS脚本
- `build_web.sh` - Web版本导出脚本
- `serve_web.sh` - 本地测试服务器脚本
## 🚀 快速开始
### Windows用户
1. **导出Web版本**
```cmd
scripts\build_web.bat
```
2. **启动本地测试服务器**
```cmd
scripts\serve_web.bat
```
### Linux/macOS用户
1. **添加执行权限**（首次使用）
```bash
chmod +x scripts/build_web.sh scripts/serve_web.sh
```
2. **导出Web版本**
```bash
./scripts/build_web.sh
```
3. **启动本地测试服务器**
```bash
./scripts/serve_web.sh
```
## ⚙️ 配置要求
### 系统要求
- **Godot Engine**: 4.5+
- **Python**: 3.6+（用于本地测试服务器）
- **磁盘空间**: 至少100MB
### Godot配置
在使用脚本前，请确保：
1. 已安装Godot 4.5或更高版本
2. 已下载Web导出模板
3. 已创建名为"Web"的导出预设
## 🔧 脚本配置
### 修改Godot路径
如果Godot安装在非默认位置，请修改脚本中的路径：
**Windows** (`build_web.bat`):
```batch
set "GODOT_PATH=C:\Program Files\Godot\Godot.exe"
```
**Linux/macOS** (`build_web.sh`):
```bash
GODOT_PATH="/usr/local/bin/godot"
```
### 修改端口设置
默认使用端口8000，如需修改请编辑服务器脚本：
**Windows** (`serve_web.bat`):
```batch
set "PORT=8000"
```
**Linux/macOS** (`serve_web.sh`):
```bash
PORT=8000
```
## 📋 使用流程
1. **准备阶段**
- 确保Godot已正确安装
- 在Godot编辑器中创建Web导出预设
- 下载对应版本的导出模板
2. **导出阶段**
- 运行导出脚本
- 等待导出完成
- 检查生成的文件
3. **测试阶段**
- 运行本地服务器脚本
- 在浏览器中测试功能
- 检查控制台错误
4. **部署阶段**
- 将`build/web/`目录上传到服务器
- 配置服务器MIME类型和CORS
- 测试线上版本
## 🐛 常见问题
### Godot未找到
**错误**: `未找到Godot可执行文件`
**解决**: 修改脚本中的`GODOT_PATH`变量为正确路径
### 导出预设不存在
**错误**: `导出预设 "Web" 不存在`
**解决**: 在Godot编辑器中创建Web导出预设
### Python未安装
**错误**: `未找到Python`
**解决**: 安装Python 3.6+并确保添加到PATH
### 端口被占用
**错误**: `端口 8000 已被占用`
**解决**: 脚本会自动尝试8080端口，或手动修改端口设置
### 文件缺失
**错误**: `缺少必要文件`
**解决**: 重新运行导出脚本，检查Godot配置
## 📊 输出文件
导出成功后，`build/web/`目录将包含：
```
build/web/
├── index.html # 主HTML文件
├── index.js # JavaScript引导文件
├── index.wasm # WebAssembly主文件
├── index.pck # Godot资源包
├── index.worker.js # Web Worker文件
├── .htaccess # Apache配置文件
├── deploy_info.json # 部署信息
└── server.log # 服务器日志（测试时生成）
```
## 🔗 相关文档
- [完整部署指南](../docs/web_deployment_guide.md)
- [更新日志](../docs/web_deployment_changelog.md)
- [API文档](../docs/api-documentation.md)
## 💡 提示
1. **首次导出**可能需要较长时间下载模板
2. **文件较大**时建议启用服务器压缩
3. **移动端测试**请使用真机而非模拟器
4. **网络问题**可能影响API调用，注意CORS配置
---
**维护**: 鲸鱼镇开发团队
**版本**: 1.0.0
**更新**: 2025-12-25