# image2prompt-extension

**Repository Path**: igooc/image2prompt-extension

## Basic Information

- **Project Name**: image2prompt-extension
- **Description**: 图片反推提示词 · Chrome 浏览器插件官方公开更新与发布仓库
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2026-10-11
- **Last Updated**: 2026-10-11

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 图片反推提示词 · Image to Prompt（Chrome 扩展）

上传本地图片或直接在网页上点选 / 右键图片，一键反推出专业级 AI 绘画提示词（适用于 Midjourney、Stable Diffusion、即梦、Flux 等）。

- **架构标准**：原生 Chrome Manifest V3，无后端服务，无任何第三方 SDK
- **模型生态**：全面支持 **OpenAI 兼容接口**（OpenAI、Google Gemini、硅基流动、智谱 GLM、阿里云百炼、火山方舟·豆包、Moonshot Kimi、Ollama 本地等）
- **隐私安全**：图片与 API Key 仅保存在本机浏览器（`chrome.storage.local`），直连服务商，绝不中转

---

## 🎨 界面与核心功能

| 功能模块 | 界面与交互说明 |
| --- | --- |
| 🖼️ **快捷弹窗（Popup）** | 点击右上角插件图标打开**苹果液态磨砂玻璃深色面板**，支持拖拽、点击或 `Ctrl+V` 粘贴本地图片；可直接切换风格模板、丰富度与语言，点击「开始反推提示词」即刻生成。 |
| 🖱️ **网页点选反推** | 激活后鼠标悬停在网页任意图片上出现**品牌橙色高亮光晕**（支持 `<img>`、`<picture>`、`<canvas>`、视频封面及 CSS 背景图），点击锁定图片后浮现控制条，点击「开始反推」即可在页面中央唤出**图左文右自适应浮窗**，支持 `ESC` 极速关闭。 |
| 🖱️ **网页右键反推** | 网页任意图片右键 → 选择「图片反推提示词」，自动后台静默解析并在独立结果页中展示完整结果。 |
| 🎨 **多风格反推模板** | 默认输出 **通用结构（10 维自适应）**（纯文本无 Markdown，全文严格 ≤ 2000 字符，穿搭文字与主体强绑定，海报文字空间坐标精确描述，智能省略无文字段与缺省结构，专注纯正面具象还原）；支持切换为 **自然语言结构**（专业图像逆向分析师/摄影/美术指导角色，深度逐层解构；直接输出一段连贯完整、可直接粘贴生图的纯复刻提示词正文本身，严禁输出任何分段标题、分析过程、负面词、推荐参数或推荐模型）、**结构化 JSON** 及 [Midjourney 官方 Explore 顶尖样例](https://www.midjourney.com/explore?tab=top) 的 **Midjourney 纯净提示词架构**（所有风格模板已全域剔除负向提示词，聚焦纯正面高质量视觉构建）。 |
| 📏 **2 档丰富度** | **标准**（日常首选，平衡凝练） / **详细**（深度还原画面微观细节）。 |
| 🌐 **多语言输出** | 支持 **中文** 与 **英文** 一键切换。 |
| ✍️ **智能微调重写** | 结果面板底部自带「补充调整」输入框，输入微调指令（如「改成雨夜霓虹、二次元画风」）后按下 `Enter` 即可通篇合理智能重写。 |
| 📋 **丝滑复制反馈** | 点击「复制提示词」按钮触发**弹簧缩放 + 翡翠绿光脉冲（`已复制 ✓`）**动效，1.4 秒后平滑复原。 |
| 📜 **统一历史记录** | 自动记录最近 20 次反推历史（弹窗/网页点选/右键统一归档），鼠标悬停高亮显示橙色状态锚条，点击即可秒级复用。 |
| ⚙️ **双向实时同步** | 弹窗内修改的风格模板、丰富度与输出语言会自动与设置页保持双向实时存储同步。 |

---

## ⚙️ 设置界面布局（Options）

设置页面采用**左右双列响应式卡片排版**：

- **左侧 · 模型配置卡片**：
  - **服务商一键预设**：内置 Google Gemini、OpenAI、硅基流动、阿里云百炼、智谱 GLM、火山方舟、Moonshot、Ollama 等常用预设；
  - **接口地址（Base URL）**：支持标准地址（如 `https://api.openai.com/v1`）或完整路由；
  - **API Key**：支持明文/密文一键切换，下方根据填写的服务商地址**智能生成对应官方控制台的申请跳转链接**；
  - **模型名称**：自带智能下拉推荐列表（如 `gemini-3.6-flash`、`gpt-5`、`Qwen/Qwen2.5-VL-72B`、`glm-4v-flash`、`doubao-seed-2.1-turbo` 等）。
- **右侧 · 反推选项与配置迁移**：
  - **反推选项**：配置默认丰富度（标准/详细）、默认输出语言（中文/英文）、图片压缩尺寸（1024px / 1280px / 1536px）及反推风格模板（通用 / 自然语言结构 / 结构化 JSON / Midjourney）；
  - **隐私与配置迁移**：支持「导出配置」与「导入配置」JSON 文件，便于跨设备一键同步。
- **底部悬浮操作栏**：
  - 「恢复默认」、「测试连接」（发送轻量请求验证网络与 Key）与「保存设置」。

---

## 🚀 安装指南

1. 下载或克隆本项目源码；
2. 打开 Google Chrome 或 Edge 浏览器，在地址栏输入 `chrome://extensions/` 进入扩展程序管理页；
3. 勾选右上角的 **「开发者模式」**；
4. 点击左上角的 **「加载已解压的扩展程序」**，选择 `image2prompt-extension`（或 `image2prompt-extension-v2`）文件夹；
5. 点击浏览器右上角插件图标 → 打开「设置」，配置好你的 API Key 与模型名称即可开启使用！

---

## 💡 常用多模态模型推荐

| 服务商 | Base URL | 推荐模型名称 | 特点说明 |
| --- | --- | --- | --- |
| **Google Gemini**（推荐） | `https://generativelanguage.googleapis.com/v1beta` | `gemini-3.6-flash` | 官方新一代旗舰，超快响应与精准视觉解构 |
| **硅基流动 SiliconFlow** | `https://api.siliconflow.cn/v1` | `Qwen/Qwen2.5-VL-72B-Instruct` | 国内直连，开源视觉顶级大模型 |
| **阿里云百炼** | `https://dashscope.aliyuncs.com/compatible-mode/v1` | `qwen-vl-max` / `qwen2.5-vl-72b-instruct` | 阿里通义千问官方旗舰多模态 |
| **智谱 BigModel** | `https://open.bigmodel.cn/api/paas/v4` | `glm-4v-flash` / `glm-4.6v` | 国内直连，有免费额度 |
| **火山方舟·豆包** | `https://ark.cn-beijing.volces.com/api/v3` | 你的推理接入点 Endpoint ID | 字节跳动豆包多模态视觉模型 |
| **OpenAI 官方** | `https://api.openai.com/v1` | `gpt-5` / `gpt-4o-mini` | 原生多模态旗舰模型 |
| **Ollama 本地** | `http://localhost:11434/v1` | `qwen2.5vl` / `llama3.2-vision` | 本地离线私有化运行，完全免费免 Key |

---

## 📂 代码目录结构

```
image2prompt-extension/
├── manifest.json          # Chrome MV3 核心清单文件
├── background.js          # 后台 Service Worker：右键菜单、跨域取图、智能压缩、历史管理
├── content.js             # 网页注入脚本：Shadow DOM 隔离的选图框、图左文右浮层、按键与微调逻辑
├── shared.js              # 全局常量、11 维通用模板（≤1600字约束）、结构化 JSON 提示词
├── lib/
│   └── api.js             # API 通信核心：OpenAI 兼容协议、Gemini 协议、自动容错重试
├── popup/                 # 扩展弹窗（深色磨砂玻璃卡片、本地上传、选项双向同步）
│   ├── popup.html
│   ├── popup.css
│   └── popup.js
├── options/               # 设置页（左右双列卡片排版、快速预设、导出导入、连接测试）
│   ├── options.html
│   ├── options.css
│   └── options.js
├── result/                # 独立结果页（右键反推承接页）
│   ├── result.html
│   ├── result.css
│   └── result.js
├── icons/                 # 高清扩展图标（16x16 / 32x32 / 48x48 / 128x128）
└── test/
    ├── smoke.js           # 自动化测试套件（87 项核心逻辑与容错断言）
    └── picker-harness.html
```

---

## 🧪 测试与开发

```bash
# 运行单元测试（93 项全部通过）
node test/smoke.js

# 检查代码语法
node --check background.js
node --check content.js
node --check shared.js
```