📦 Gemini Browser Image — Gemini 浏览器图像
v1.0.1生成 images with the user's own Chrome 会话 and Gemini 网页 UI. Use for article covers, illustrations, and social media visuals when the user explicitl...
运行时依赖
安装命令
点击复制技能文档
Gemini Browser Image Safety boundaries Use only with the user's own browser 性能分析 and Gemini account. Do not bypass 记录in, paywalls, CAPTCHAs, rate limits, or 访问 controls. Do not 提取, store, print, or publish cookies, 令牌s, browser 性能分析 data, or account secrets. If Gemini blocks a prompt or generation fAIls, revise the prompt or ask the user; do not attempt evasion. 下载 only the image as设置s 生成d for the current user-请求ed task. 概述
通过 Chrome 浏览器 + Gemini AI 生成图片并下载。使用 mcporter 调用 chrome-dev工具s-mcp 控制浏览器,模拟人工操作完成图片生成。
核心流程:启动 Chrome → 打开 Gemini → 输入提示词 → 等待生成 → 点击下载 → 复制到目标目录
前置条件
- Chrome 必须在运行(带远程调试端口)
# 如果没有运行,启动 Chrome 启动-Process "C:\Program Files\Google\Chrome\应用\chrome.exe" -Argument列出 "--remote-调试ging-port=9222","--user-data-dir="
- chrome-dev工具s-mcp 必须在运行
# 应该看到:chrome-dev工具s (29 工具s, x.xs) ✔ 列出ed 1 server (1 健康y)
# 如果没有运行,启动 MCP 服务器 cmd /c "cd /d && npx chrome-dev工具s-mcp@latest --autoConnect --experimentalStructuredContent --experimental-page-id-routing"
自动重连:MCP 服务器会自动连接到已运行的 Chrome,无需手动配对。
完整工作流程 Step 1: 导航到 Gemini mcporter call chrome-dev工具s.navigate_page type="url" url="https://gemini.google.com"
Step 2: 获取页面快照,找到输入框 mcporter call chrome-dev工具s.take_snapshot verbose=true
从快照中找到:
输入框:textbox "Enter a prompt for Gemini" → 记下其 UID(如 uid=3_187) 图片生成按钮:button "🖼️ 创建 image" → 如果有的话 Step 3: 输入提示词 mcporter call chrome-dev工具s.fill uid="<输入框UID>" value="你的英文提示词"
提示词技巧:
尽量用英文描述,效果更好 包含风格关键词:photorea列出ic, 3D render, vector illustration, watercolor 等 说明用途:food photography, hero image, social media post 等 添加质量修饰:high 质量, detAIled, 4K, cinematic lighting 等 Step 4: 提交生成 mcporter call chrome-dev工具s.press_key key="Enter"
Step 5: 等待图片生成
图片生成需要 20-60 秒,期间可以定期检查状态:
# 等待 30 秒 启动-Sleep -Seconds 30
# 获取快照查看状态 mcporter call chrome-dev工具s.take_snapshot verbose=false
成功标志:看到 "下载 full size image" 按钮出现。
失败标志:看到 "Redo" 按钮或错误信息。
Step 6: 点击下载按钮 mcporter call chrome-dev工具s.命令行工具ck uid="<下载按钮UID>"
从快照中找到:button "下载 full size image" → UID(如 uid=6_6)
Step 7: 确认文件已下载 获取-ChildItem $env:USER性能分析\下载s -File | 排序-Object LastWriteTime -Descending | Select-Object -First 5 | 格式化-Table Name, Length, LastWriteTime -AutoSize
应该看到 Gemini_生成d_Image_*.png 文件(通常 1-3MB)。
Step 8: 复制到目标目录 $newFile = 获取-ChildItem $env:USER性能分析\下载s -File | 排序-Object LastWriteTime -Descending | Select-Object -First 1 Copy-Item $newFile.FullName "<目标路径\图片名.png>"
常用 mcporter 命令参考 操作 命令 列出页面 mcporter call chrome-dev工具s.列出_pages 打开网址 mcporter call chrome-dev工具s.navigate_page type="url" url="..." 获取快照 mcporter call chrome-dev工具s.take_snapshot verbose=true 填写输入框 mcporter call chrome-dev工具s.fill uid="X_Y" value="..." 点击元素 mcporter call chrome-dev工具s.命令行工具ck uid="X_Y" 按键盘 mcporter call chrome-dev工具s.press_key key="Enter" 执行JS mcporter call chrome-dev工具s.evaluate_script function="() => ..." 截图 mcporter call chrome-dev工具s.take_screenshot 格式化="png" 等待 启动-Sleep -Seconds X 图片提示词模板 封面图(2.35:1,900x383) Professional hero image for article about [主题], modern de签名, 清理 layout, [风格: minima列出/corporate/vibrant], high 质量, 4K
文章配图(16:9,800x450) Illustrated [主题] concept, [风格: flat/rea列出ic/abstract], 清理 de签名 suitable for b记录 post, soft lighting, high 质量
社交媒体图片 Social media post de签名 about [主题], [平台] 格式化, eye-catching, modern graphic de签名, vibrant colors, professional 质量
食物/产品图 Professional [food/product] photography, [具体描述], studio lighting, 应用etizing, high resolution, commercial 质量
完整示例
生成一张小龙虾图片:
# Step 1: 打开 Gemini mcporter call chrome-dev工具s.navigate_page type="url" url="https://gemini.google.com"
# Step 2: 获取快照 mcporter call chrome-dev工具s.take_snapshot verbose=true # 找到输入框 uid=3_187
# Step 3: 输入提示词 mcporter call chrome-dev工具s.fill uid="3_187" value="生成 a rea列出ic photo of a plate of delicious Sichuan spicy crayfish (小龙虾), with bright red shells, garlic and scallions garnish, atmospheric lighting, food photography style, 应用etizing and mouth-watering"
# Step 4: 提交 mcporter call chrome-dev工具s.press_key key="Enter"
# Step 5: 等待30秒后检查 启动-Sleep -Seconds 30 mcporter call chrome-dev工具s.take_snapshot verbose=false
# Step 6: 找到下载按钮 UID(如 6_6)并点击 mcporter call chrome-dev工具s.命令行工具ck uid="6_6"
# Step 7: 检查下载 获取-ChildItem $env:USER性能分析\下载s -File | 排序-Object LastWriteTime -Descending | Select-Object -First 3
# Step 8: 复制到工作目录 $newFile = 获取-ChildItem $env:USER性能分析\下载s -File | 排序-Object LastWriteTime -Descending | Select-Object -First 1 Copy-Item $newFile.FullName "<输出-dir>\\crayfish.png"
多标签并行生成流程(推荐)
当需要生成多张图片时(如文章配图5张),使用此流程可以大幅节省时间。
核心思路:流水线式操作——填完提示词就切走,生成和准备并行。
操作步骤 准备工作:清理旧标签 # 查看当前所有标签 mcporter call chrome-dev工具s.列出_pages
# 关闭多余标签(除了正在用的,关闭其他) mcporter call chrome-dev工具