写了第二个 MCP-Server：用于生成网页截图的 webshot-mcp

webshot-mcp 一个用于生成网页截图的 MCP (Model Context Protocol) 服务器。

写的第一个 mcp 是用来查询域名是否被注册：FastDomainCheck-MCP-Server

功能特性

• 🌐 支持任意网页截图
• 📱 支持多种设备类型（桌面、手机、平板）
• 🎨 支持多种图片格式（PNG、JPEG、WebP）
• 📏 支持自定义尺寸和 DPI 缩放
• 🖼️ 支持全页面截图
• 🗜️ 支持图片质量压缩
• ⚡ 异步处理，性能优异

使用方法

作为 MCP 服务器

方式 1：使用 uvx 直接运行（推荐）

1
2
3
4
5
6
7
8

{
  "mcpServers": {
    "webshot": {
      "command": "uvx",
      "args": ["webshot-mcp"]
    }
  }
}

方式 2：在 Claude Code 中使用

Claude Code 可以通过两种方式配置此 MCP 服务器：

选项 A：使用 CLI 向导

1

claude mcp add

然后按照提示添加 webshot-mcp。

选项 B：直接编辑配置文件（推荐）

编辑你的 Claude Code 配置文件（~/.claude.json）并添加：

1
2
3
4
5
6
7
8
9

{
  "mcpServers": {
    "webshot": {
      "type": "stdio",
      "command": "uvx",
      "args": ["webshot-mcp"]
    }
  }
}

编辑配置文件后，重启 Claude Code 以应用更改。

方式 3：使用 pip 安装后运行

1
2
3
4

# 安装 webshot-mcp
pip install webshot-mcp
# 安装 chromium 浏览器
playwright install chromium

然后在 MCP 客户端配置中添加：

对于 Claude Desktop（claude_desktop_config.json）：

1
2
3
4
5
6
7

{
  "mcpServers": {
    "webshot": {
      "command": "webshot-mcp"
    }
  }
}

对于 Claude Code（~/.claude.json）：

1
2
3
4
5
6
7
8

{
  "mcpServers": {
    "webshot": {
      "type": "stdio",
      "command": "webshot-mcp"
    }
  }
}

使用示例

网页完整长度截图（网页长截图）提示词参考

1

帮我生成 www.baidu.com 页面完整截图，保存成 webp 格式，保存到 /Users/ben/Downloads/screenshot-baidu-1.webp

指定网页截图尺寸提示词参考

1

帮我生成 www.baidu.com 页面截图，尺寸 1280X720，保存成 webp 格式，保存到 /Users/ben/Downloads/screenshot-baidu-2.webp

移动设备截图提示词参考（手机或者平板会根据模拟的设备尺寸生成，忽略要求的尺寸）

1

帮我生成 www.baidu.com 手机版截图，保存成 webp 格式，保存到 /Users/ben/Downloads/screenshot.webp

指定保存格式和压缩质量提示词参考

1

帮我生成 www.baidu.com 截图，保存成 jpg 格式，压缩质量为 80，保存到 /Users/ben/Downloads/screenshot.jpg

如果临时使用，可以用这个 网页长截图工具

工具参数

webshot 工具支持以下参数：

必需参数

• url (string): 要截图的网页 URL
• output (string): 截图文件保存路径

可选参数

• width (integer): 浏览器窗口宽度，默认 1280
• height (integer): 浏览器窗口高度，默认 768。设置为 0 时进行全页面截图
• dpi_scale (number): DPI 缩放比例，默认 2
• device (string): 设备类型，可选值：
  • desktop (默认): 桌面设备
  • mobile: 移动设备 (iPhone 13)
  • tablet: 平板设备 (iPad Pro)
• format (string): 图片格式，可选值：
  • png (默认): PNG 格式
  • jpeg: JPEG 格式
  • webp: WebP 格式
• quality (integer): 图片质量 (0-100)，默认 100。仅对 JPEG 和 WebP 格式有效

技术栈

• MCP: Model Context Protocol 框架
• Playwright: 浏览器自动化和截图
• Pillow: 图片处理和压缩
• asyncio: 异步编程支持

---

真诚邀请您走进我的知识小宇宙，关注我个人的公众号，在这里，我将不时为您献上独家原创且极具价值的技术内容分享。每一次推送，都倾注了我对技术领域的独特见解与实战心得，旨在与您共享成长过程中的每一份收获和感悟。您的关注和支持，是我持续提供优质内容的最大动力，让我们在学习的道路上并肩同行，共同进步，一起书写精彩的成长篇章!

---