Skip to content

README.zh.md

Latest commit

 

History

History
193 lines (131 loc) · 6.19 KB

README.zh.md

File metadata and controls

193 lines (131 loc) · 6.19 KB
Raw

Zenith Image Generator

现代化 AI 文生图 Web 应用

支持多 AI 提供商的深色模式图片生成器，
批量生成，一键部署到 Cloudflare Pages。

English · 更新日志 · 在线演示

Dark Mode UI Cloudflare Pages React Hono

功能特性

  • 多 AI 提供商 - A4F、Gitee AI、HuggingFace Spaces、ModelScope
  • 深色模式 UI - Gradio 风格毛玻璃效果
  • 灵活尺寸 - 多种宽高比 (1:1, 16:9, 9:16, 4:3 等)
  • 安全存储 - API Key 使用 AES-256-GCM 加密
  • Token 轮询 - 多 API Key 自动切换，遇到限流自动换用下一个
  • 历史记录（轻量） - 仅存元数据（URL + 参数）到 localStorage，24 小时自动过期清理
  • Flow 模式 - 可视化批量生成画布 (实验性)

Token 轮询

支持为每个服务商配置多个 API Token，遇到限流错误 (429) 时自动切换。

使用方法

在 API 设置中输入多个 Token，用英文逗号 (,) 分隔：

token_1, token_2, token_3

注意：必须使用英文逗号 (,)，中文逗号 (，) 无效。

工作原理

  1. 优先使用第一个可用的 Token 发起请求
  2. 遇到 429 (限流) 错误时，自动切换到下一个 Token
  3. 已耗尽的 Token 会被记录，当天不再使用
  4. Token 状态每天 UTC 00:00 自动重置
  5. 界面实时显示 Token 统计 (总数/可用/已耗尽)

快速开始

前置要求

A4F（api.a4f.co）渠道：注册获取 API Key

  1. 打开 https://www.a4f.co/ 注册/登录
  2. 在 A4F 控制台创建 API Key（参考官方文档）：https://www.a4f.co/docs
  3. 在 Zenith 设置中选择服务商 A4F，把 API Key 粘贴到 Token 输入框

说明：

  • A4F 的模型必须带 provider 前缀（例如 provider-4/imagen-3.5），Zenith 已在模型下拉框内提供可用项。
  • 如直接调用 OpenAI 兼容接口，请使用 model: "a4f/provider-4/imagen-3.5"，并在请求头中使用 Authorization: Bearer a4f:<token>。

一键部署

部署到 Cloudflare Pages

连接 GitHub 仓库 → 设置 root 为 apps/web → 部署！

本地开发

git clone https://github.com/WuMingDao/zenith-image-generator.git
cd zenith-image-generator
pnpm install

# 配置环境变量
cp apps/web/.env.example apps/web/.env

# 终端 1
pnpm dev:api

# 终端 2
pnpm dev:web

打开 http://localhost:5173

📖 完整开发指南

文档

文档 描述
贡献指南 本地配置、局域网访问、开发
部署指南 Cloudflare、Vercel、Netlify 教程
API 参考 接口、参数、代码示例

补充说明：

  • 接口返回的是原始图片 URL（例如 HuggingFace Space 的 gradio_api/file=...）。
  • 部分 URL 是临时文件（HF Space 通常 24 小时左右会失效）。

API 使用

部署后可直接调用 OpenAI 格式 API：

curl -X POST https://your-project.pages.dev/v1/images/generations \
  -H "Content-Type: application/json" \
  -H "Authorization: Bearer gitee:your-gitee-api-key" \
  -d '{
    "model": "gitee/z-image-turbo",
    "prompt": "a cute cat",
    "size": "1024x1024",
    "steps": 9,
    "n": 1,
    "response_format": "url"
  }'

说明：

  • Provider 路由通过 model 前缀区分：
    • a4f/... -> A4F（Authorization: Bearer a4f:...）
    • gitee/... -> Gitee AI（Authorization: Bearer gitee:...）
    • ms/... -> ModelScope（Authorization: Bearer ms:...）
    • 无前缀 -> HuggingFace（可选 token；Authorization: Bearer <token> 或 Authorization: Bearer hf:<token>）

安全性

API Key 如何被保护

浏览器 ──HTTPS──→ Cloudflare Workers ──HTTPS──→ AI 服务商 (Gitee/HuggingFace)
  ↑                      ↑
AES-256-GCM          代理层
加密存储            (你的部署实例)
  • 本地加密：API Key 使用 AES-256-GCM 加密后存储在 localStorage
  • 传输安全：所有通信使用 HTTPS 加密
  • 代理架构：你的 Key 发送到你自己的 Workers，而非直接发给 AI 服务商

⚠️ 第三方部署警告

重要提示：如果你使用他人部署的实例，部署者可能有能力获取你的 API Key。

原因如下：

  1. 部署者可以添加日志代码来捕获请求头中的 Key
  2. 你无法验证实际部署的代码是否与开源代码一致
  3. Cloudflare 提供了 wrangler tail 等工具可以实时查看请求

安全建议：

场景 风险等级 建议
自己部署 ✅ 安全 完全掌控你的 Key
第三方实例 ⚠️ 有风险 仅使用一次性或低额度的 Key
来源不明 ❌ 不安全 不要输入有价值的 API Key

为了最大程度保障安全，请始终部署自己的实例。

技术栈

层级 技术
前端 React 19, Vite, Tailwind CSS, shadcn/ui
后端 Hono (TypeScript)
部署 Cloudflare Pages + Functions

star 历史

Star History Chart

许可证

MIT

致谢