🍌 NanoBanana：多模型 Playground（可直接用 + 一看就会部署）
上半部分是可用的在线面板，下半部分是 5 分钟部署教程与常见问题，手机/电脑都好用。
🍌 什么是 NanoBanana？
NanoBanana 是一个开源、极简、支持多模型的前端工具（Playground）。它通过 OpenRouter 等提供商聚合多款大模型，让你可以在一个页面里快速切换与体验。
- 🌟 界面清爽，开箱即用
- ⚡ 零后端：直接部署到 Deno Deploy
- 🔄 支持选择多种模型（如 GPT-4.1、Claude、Llama 等）
- 🧩 适合嵌入博客/知识库，做演示或自用
🌐 准备这些网站与知识
- 📂 GitHub 仓库：获取源码与说明
- ☁️ Deno Deploy：免费、快速的前端托管
- 🔑 OpenRouter：申请 API Key，调用多家模型
不用写后端；会 Fork 仓库 + 配环境变量就能跑。
📖 5 分钟部署教程
步骤 1. Fork 仓库 👉 打开 NanoBanana 仓库，点击右上角 Fork。
步骤 2. 登录 Deno Deploy 👉 使用 GitHub 授权登录 Deno Deploy。
步骤 3. New Project → 选择你 Fork 的仓库 → 打开 Settings → Environment Variables，添加环境变量：
OPENROUTER_API_KEY=你的_openrouter_key SITE_TITLE=NanoBanana SITE_DESC=我的轻量多模型前端 DEFAULT_MODEL=openrouter/auto
步骤 4. 部署完成后，得到你的域名（示例）：https://your-app.deno.dev ✅
步骤 5. 在 WordPress 中嵌入（自定义 HTML 区块粘贴）：
<iframe src="https://your-app.deno.dev/" style="width:100%;height:72vh;border:1px solid #ccc;border-radius:12px" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
⚠️ 常见问题（FAQ）
1）API Key 会暴露吗？
不要把 Key 写在前端代码里；放在 Deno Deploy 的 Environment Variables 最安全。公开页面也不要在浏览器里透出 Key。
2）为什么嵌入后下面有大空白？
跨域 iframe 不能自动跟随内容高度。这里使用 height: min(88vh, 900px) 在桌面提供更大可视区；你也可改为 80–90vh 按需微调。
3）跨域/CORS 要配置吗？
OpenRouter 原生支持浏览器请求；若你切换到其他 API，可能需要在服务端加中转代理。
No responses yet