Spaces:
Paused
Paused
| title: OpenSite | |
| emoji: 🐳 | |
| colorFrom: blue | |
| colorTo: blue | |
| sdk: docker | |
| pinned: true | |
| app_port: 7860 | |
| license: mit | |
| short_description: 一个强大的AI驱动的前端开发助手 | |
| # DeepSite | |
| 一个强大的AI驱动的前端开发助手，帮助你快速创建和优化网页。 | |
| ## 特性 | |
| - 🎨 智能UI生成 | |
| - 🔧 代码优化建议 | |
| - 🚀 实时预览 | |
| - 🔄 自定义模型支持 | |
| - 🌐 多语言支持 | |
| ## 获取 Hugging Face 凭据 | |
| 1. 访问 https://huggingface.co/settings/connected-applications | |
| 2. 创建新的 OAuth 应用： | |
| - 点击 "Create App" | |
| - 填写应用信息 | |
| - 设置回调URL为您的 REDIRECT_URI | |
| 3. 获取 Client ID 和 Client Secret | |
| 4. 创建 Access Token 作为 DEFAULT_HF_TOKEN（可选） | |
| ## 环境变量配置 | |
| 在项目根目录创建 `.env` 文件，参考 `.env.example` 添加以下配置： | |
| ```env | |
| # OAuth配置 | |
| OAUTH_CLIENT_ID= # Hugging Face OAuth客户端ID | |
| OAUTH_CLIENT_SECRET= # Hugging Face OAuth客户端密钥 | |
| APP_PORT=7860 # 应用程序端口号 | |
| REDIRECT_URI= # OAuth重定向URI | |
| DEFAULT_HF_TOKEN= # 默认的Hugging Face Token | |
| DEFAULT_MODEL_ID= # 默认模型ID | |
| # OpenAI 兼容配置（可选） | |
| OPENAI_COMPATIBLE_ENDPOINT= # OpenAI兼容的API端点 | |
| OPENAI_COMPATIBLE_API_KEY= # API密钥 | |
| OPENAI_COMPATIBLE_MODEL_ID= # 模型ID | |
| OPENAI_COMPATIBLE_MAX_TOKENS= # 最大token数（默认2048） | |
| OPENAI_COMPATIBLE_SYSTEM_PROMPT= # 系统提示词 | |
| ``` | |
| ## OpenAI 兼容模型配置 | |
| DeepSite 支持两种配置 OpenAI 兼容模型的方式： | |
| ### 1. 通过环境变量配置（推荐） | |
| 在 `.env` 文件中设置以下变量： | |
| ```env | |
| OPENAI_COMPATIBLE_ENDPOINT=http://your-api-endpoint | |
| OPENAI_COMPATIBLE_API_KEY=your-api-key | |
| OPENAI_COMPATIBLE_MODEL_ID=your-model-id | |
| OPENAI_COMPATIBLE_MAX_TOKENS=2048 | |
| OPENAI_COMPATIBLE_SYSTEM_PROMPT=你是一个专业的前端开发助手 | |
| ``` | |
| ### 2. 通过API动态配置 | |
| 发送 POST 请求到 `/api/custom-model` 端点： | |
| ```json | |
| { | |
| "endpoint": "http://your-api-endpoint", | |
| "apiKey": "your-api-key", | |
| "model_id": "your-model-id", | |
| "apiType": "openai", | |
| "max_tokens": 2048, | |
| "name": "自定义模型名称", | |
| "systemPrompt": "自定义系统提示词" | |
| } | |
| ``` | |
| ### 支持的模型示例 | |
| 1. ChatGLM API | |
| ```env | |
| OPENAI_COMPATIBLE_ENDPOINT=http://localhost:8000/v1 | |
| OPENAI_COMPATIBLE_MODEL_ID=chatglm3-6b | |
| ``` | |
| 2. FastChat API | |
| ```env | |
| OPENAI_COMPATIBLE_ENDPOINT=http://localhost:8000/v1 | |
| OPENAI_COMPATIBLE_MODEL_ID=vicuna-7b-v1.5 | |
| ``` | |
| 3. 其他兼容 OpenAI API 的模型服务都可以通过类似方式配置 | |
| ## 用户限制说明 | |
| ### 未登录用户 | |
| - 每个IP地址最多允许4次请求 | |
| - 使用系统默认的 Hugging Face Token | |
| - 受到提供商的token限制 | |
| ### 登录用户 | |
| - 使用个人 Hugging Face Token | |
| - Token限制说明： | |
| - 限制类型：单次请求的token限制（不是每月或总量限制） | |
| - Token计算：TOKENS_USED = prompt长度 + 历史提示长度 + HTML内容长度 | |
| - 不同提供商的单次请求限制： | |
| - Fireworks AI: 最大 131,000 tokens | |
| - Nebius AI Studio: 最大 131,000 tokens | |
| - SambaNova: 最大 8,000 tokens | |
| - NovitaAI（默认）: 最大 16,000 tokens | |
| - 自定义模型: 根据配置设置 | |
| ### 超出限制处理 | |
| 1. 系统会返回400错误并提示切换提供商 | |
| 2. 用户可以： | |
| - 减少输入内容长度 | |
| - 切换到有更高token限制的提供商 | |
| - 使用"auto"模式让系统自动选择合适的提供商 | |
| - 配置自定义模型 | |
| ### 自动模式（Auto） | |
| - 默认使用 NovitaAI（16,000 tokens限制） | |
| - 系统会自动处理token限制，选择合适的提供商 | |
| - 建议：如果不确定使用哪个提供商，建议使用自动模式 | |
| ## 自定义模型配置 | |
| DeepSite 支持两种类型的自定义模型接入： | |
| ### 1. HuggingFace 格式 | |
| 使用 HuggingFace Inference API 格式的模型： | |
| ```json | |
| { | |
| "endpoint": "https://your-model-endpoint", | |
| "apiKey": "your-api-key", | |
| "model_id": "your-model-id", | |
| "apiType": "hf", | |
| "max_tokens": 2048, | |
| "name": "自定义模型名称", | |
| "systemPrompt": "自定义系统提示词" | |
| } | |
| ``` | |
| ### 2. OpenAI 兼容格式 | |
| 使用 OpenAI API 兼容格式的模型（如 ChatGLM、FastChat 等）： | |
| ```json | |
| { | |
| "endpoint": "http://your-api-endpoint", | |
| "apiKey": "your-api-key", | |
| "model_id": "your-model-id", | |
| "apiType": "openai", | |
| "max_tokens": 2048, | |
| "name": "自定义模型名称", | |
| "systemPrompt": "自定义系统提示词" | |
| } | |
| ``` | |
| ## 如何配置环境变量 | |
| 1. 在项目根目录创建 `.env` 文件 | |
| 2. 复制 `.env.example` 的内容到 `.env` | |
| 3. 填入相应的值： | |
| - 从 Hugging Face 获取 OAuth 凭据 | |
| - 设置应用程序端口（默认7860） | |
| - 配置重定向URI | |
| - 设置默认的 Hugging Face Token | |
| - 配置默认模型ID（可选） | |
| 注意：`.env` 文件包含敏感信息，已在 `.gitignore` 中配置，不会被提交到版本控制系统。 | |
| ## 最佳实践建议 | |
| 1. 对于大型项目： | |
| - 使用 Fireworks AI 或 Nebius AI Studio（131k tokens限制） | |
| - 适合生成完整的网站或复杂应用 | |
| - 或配置自定义大模型 | |
| 2. 对于中小型项目： | |
| - 使用 NovitaAI（16k tokens限制） | |
| - 适合生成单个页面或简单组件 | |
| 3. 对于快速原型： | |
| - 使用 SambaNova（8k tokens限制） | |
| - 适合生成简单的UI组件或快速测试 | |
| 4. 对于特殊需求： | |
| - 配置自定义模型 | |
| - 可以使用自己部署的模型或其他API服务 | |
| - 灵活设置token限制和系统提示词 | |
| 5. 通用建议： | |
| - 开始时使用自动模式 | |
| - 根据项目需求和生成内容大小选择合适的提供商 | |
| - 如遇到token限制，可以分步骤生成，然后组合内容 | |
| - 对于特殊需求，考虑配置自定义模型 | |
| Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference | |
| ## 开发 | |
| 1. 安装依赖： | |
| ```bash | |
| npm install | |
| ``` | |
| 2. 启动开发服务器： | |
| ```bash | |
| npm run dev | |
| ``` | |
| 3. 构建生产版本： | |
| ```bash | |
| npm run build | |
| ``` | |
| ## 部署 | |
| 项目可以部署到任何支持 Node.js 的平台。推荐使用： | |
| - Vercel | |
| - Netlify | |
| - Hugging Face Spaces | |
| ## 贡献 | |
| 欢迎提交 Pull Request 或创建 Issue！ | |
| ## 许可 | |
| MIT License | |