second commit

ENV_SETUP.md

@@ -0,0 +1,102 @@
+# 环境变量配置说明
+
+## 🔑 API 密钥配置
+
+为了使用真实的 AI 模型测试功能，您需要配置相应的 API 密钥。
+
+### 1. 创建环境变量文件
+
+在项目根目录创建 `.env.local` 文件：
+
+```bash
+# .env.local
+
+# DeepSeek API 配置
+DEEPSEEK_API_KEY=your_deepseek_api_key_here
+
+# OpenAI API 配置
+OPENAI_API_KEY=your_openai_api_key_here
+
+# Anthropic API 配置
+ANTHROPIC_API_KEY=your_anthropic_api_key_here
+```
+
+### 2. 获取 API 密钥
+
+#### DeepSeek API
+1. 访问 [DeepSeek 官网](https://platform.deepseek.com/)
+2. 注册并登录账户
+3. 在控制台中获取 API 密钥
+4. 将密钥添加到 `DEEPSEEK_API_KEY` 环境变量
+
+#### OpenAI API
+1. 访问 [OpenAI 官网](https://platform.openai.com/)
+2. 注册并登录账户
+3. 在 API Keys 页面获取密钥
+4. 将密钥添加到 `OPENAI_API_KEY` 环境变量
+
+#### Anthropic API
+1. 访问 [Anthropic 官网](https://console.anthropic.com/)
+2. 注册并登录账户
+3. 在 API Keys 页面获取密钥
+4. 将密钥添加到 `ANTHROPIC_API_KEY` 环境变量
+
+### 3. 支持的模型
+
+#### DeepSeek 模型
+- `deepseek-coder`: 代码生成模型
+- `deepseek-chat`: 通用对话模型
+- `deepseek-vision`: 视觉模型
+
+#### OpenAI 模型
+- `gpt-4`: GPT-4 模型
+- `gpt-4-turbo`: GPT-4 Turbo 模型
+- `gpt-3.5-turbo`: GPT-3.5 Turbo 模型
+
+#### Anthropic 模型
+- `claude-3-opus`: Claude 3 Opus 模型
+- `claude-3-sonnet`: Claude 3 Sonnet 模型
+- `claude-3-haiku`: Claude 3 Haiku 模型
+
+### 4. 测试功能
+
+配置完成后，您可以在以下页面测试真实的 AI 模型：
+
+1. **编辑器测试面板**: `/editor` → 测试标签页
+2. **独立测试台**: `/playground`
+
+### 5. 安全注意事项
+
+- 不要将 `.env.local` 文件提交到版本控制系统
+- 定期轮换 API 密钥
+- 监控 API 使用量和费用
+- 在生产环境中使用更安全的密钥管理方案
+
+### 6. 故障排除
+
+如果遇到 API 调用失败：
+
+1. 检查 API 密钥是否正确配置
+2. 确认网络连接正常
+3. 检查 API 配额是否充足
+4. 查看浏览器控制台的错误信息
+5. 检查服务器日志
+
+### 7. 模拟模式
+
+如果没有配置 API 密钥，系统会自动使用模拟模式，提供示例响应来演示功能。
+
+---
+
+## 🚀 快速开始
+
+1. 复制 `.env.local.example` 为 `.env.local`
+2. 填入您的 API 密钥
+3. 重启开发服务器
+4. 开始测试真实的 AI 模型！
+
+```bash
+cp .env.local.example .env.local
+# 编辑 .env.local 文件，填入 API 密钥
+npm run dev
+```