CookSleep/gpt_image_playground
基于 OpenAI gpt-image-2.5 API 的图片生成与编辑工具
🎨 GPT Image Playground – 这是什么
GPT Image Playground 是一个基于浏览器的 UI,用于 OpenAI 的 gpt-image-2.5(及兼容)图像生成 API。它让您可以完全在网页上创建、编辑和管理图像,并将所有内容存储在浏览器本地 (IndexedDB),因此无需服务器端存储。
核心功能 (如 README 所述)
| 功能 | 您将获得什么 |
|---|---|
| 文字转图像 & 图像转图像 | 根据提示词生成图片,或提供最多 16 张参考图像及遮罩进行引导式编辑。 |
| 批处理 & 迭代工作流 | 在一个请求中创建多张图像,将任何结果提升为新的参考图像,并在下一轮继续编辑。 |
| 流式预览 | Images API 和较新的 Responses API 均可流式传输中间步骤,让您在最终图像完成前看到部分结果。 |
| 透明背景支持 | 选择 API 原生 (模型返回 alpha 通道) 或 本地后处理 (在浏览器中去除绿色/洋红色背景) 以输出 PNG/WebP。 |
| 代理模式 (多轮聊天) | 一个具备上下文记忆的对话助手,可自动调用图像工具,支持对先前图片的 @-引用,执行并行批处理生成,并可选择执行网络搜索。 |
| 分支 & 重做 | 编辑或重新生成任何聊天轮次,创建一个隔离图像参考的独立分支。 |
| 细粒度参数追踪 | UI 显示确切的尺寸、质量、延迟,甚至是 API 实际使用的模型重写提示词,并提供快速预设尺寸 (1K/2K/4K) 及自动舍入至模型限制。 |
| 仅限本地的历史记录 & 图库 | 所有任务、缩略图和元数据均存储在 IndexedDB 中,并透过 SHA-256 进行去重。您可以将任务组织成命名集合、拖放排序、重新命名,并将任何集合导出为 ZIP 文件。 |
| 多提供者配置 | 内置支持 OpenAI 兼容端点、sub2api (async)、fal.ai,以及透过 JSON 定义的任何自定义 HTTP 提供者。每个提供者都可以拥有自己的 API 密钥、模型、超时、代理设置和透明背景处理方法。 |
| API 代理 & CORS 处理 | 当部署在服务器后方 (Docker, Vercel, Cloudflare Workers) 时,您可以启用同源 /api-proxy/ 来转发请求,避免浏览器 CORS 限制。 |
| Codex-CLI 兼容性 | 如果您将应用程序指向 Codex-CLI 端点,UI 将自动把多图像请求拆分为并发的单图像调用,并公开 Codex 支持的额外参数。 |
| 基于 URL 的快速填写 | 透过新增查询参数 (apiUrl, apiKey, model, …) 您可以预先填写配置 – 这对于书签或将工具嵌入其他网站非常方便。 |
技术堆栈 (基于徽章列和典型的 Vite 项目)
- 前端: React 19 + TypeScript,使用 Vite 构建。
- 样式 / UI: 可能是 Tailwind/Ant Design 风格的组件 (未明确列出,但此类仪表板很常见)。
- 状态 & 存储: 浏览器 IndexedDB 用于持久化本地历史记录;SHA-256 哈希用于去重。
- 构建 & 部署: 支持静态网站托管 (Vercel, GitHub Pages, Cloudflare Workers) 以及运行 Nginx 代理 + 构建资产的 Docker 镜像。
如何运行
- 一键云端 – 部署于 Vercel, GitHub Pages, 或 Cloudflare Workers。设置环境变量
VITE_DEFAULT_API_URL(或 JSON 配置) 指向您的图像生成端点。 - Docker – 拉取
ghcr.io/cooksleep/gpt_image_playground:latest并运行,可选择启用ENABLE_API_PROXY以隐藏真实的 API URL。 - 本地开发 –
npm install && npm run dev。您可以新增dev-proxy.config.json以在开发期间绕过 CORS。 - 静态构建 –
npm run build会产生一个dist/文件夹,您可以使用任何静态网页服务器进行服务。
谁会使用它?
- 艺术家 & 设计师 想要一个快速的 UI 来使用 OpenAI 的图像模型,而无需编写代码。
- 产品团队 测试提示词想法或批处理生成资产。
- 开发人员 需要一个沙盒来实验不同的 API 提供者 (OpenAI, fal.ai, 自定义自托管端点),然后再将其整合到自己的应用程序中。
- 教育工作者 / 爱好者 寻找一个自托管、隐私优先的图像生成游乐场。
快速入门检查清单
- 取得兼容服务 (OpenAI, fal.ai, sub2api 网关等) 的 API 密钥。
- 透过您偏好的方式部署并设置
VITE_DEFAULT_API_URL(或使用 URL 填写参数)。 - 开启网页 UI,新增配置 (或使用预填的配置),然后开始生成!
授权
该项目以 MIT License 发布,因此您可以自由分叉、修改和自托管。
相关
- Dispatch
- Dispatch
- Dispatch
- Dispatch
- 项目