screenshotone-mcp

你是否曾经需要为你的AI对话或文档快速添加一张网页截图，却苦于无法直接从命令行或AI助手中生成？今天要介绍的开源项目screenshotone-mcp，就是为解决这个微小但频繁的痛点而生。它是一个极其轻量的MCP服务器，将ScreenshotOne API的强大截图能力，以标准MCP工具的形式提供给任何AI客户端。

项目基本信息

一、项目介绍

screenshotone-mcp 是一个官方实现的MCP服务器，专门用于调用ScreenshotOne API的截图功能。它目前只提供了一个工具：render-website-screenshot，用于渲染网站截图并以图片形式返回。

这个项目的设计理念是“简单”和“专注”。它不做任何多余的事情，只做好一件事：让AI能够通过MCP协议，轻松获取任何网页的截图。你可以将它集成到Claude Desktop、Cursor或其他MCP客户端中，然后通过自然语言指令，让AI帮你截取网页并分析图片内容。

二、核心优势

官方出品，稳定可靠

这是ScreenshotOne官方维护的MCP服务器，这意味着它会与ScreenshotOne API保持同步更新，代码质量和接口稳定性有保障。

开源免费且采用MIT协议

项目代码完全公开，采用宽松的MIT开源协议。你可以自由使用、修改，甚至集成到商业项目中。

极致简单

整个项目只专注于一个功能：截图。没有复杂的配置，没有冗余的工具，真正做到了“小而美”。

TypeScript编写

使用TypeScript开发，提供了良好的类型定义，对于使用TypeScript的开发者非常友好。

易于集成

无论是与Claude Desktop集成，还是作为独立服务运行，都只需要几条命令或几行配置。

三、适用场景

开发者学习和参考

如果你想学习如何创建一个简单的MCP服务器，这个项目是完美的入门范例。它的代码量极少，结构清晰，很容易理解MCP服务器的基本结构。

个人项目使用和集成

如果你正在开发一个需要网页截图功能的AI应用，可以直接集成这个服务器。例如：

• 一个能自动截取竞品网站首页并分析变化的监控机器人
• 一个能保存网页快照以备后续对比的工具
• 一个能为你的文档或报告自动生成配图的助手

企业级应用开发

在企业环境中，可以用它来构建自动化报告系统。例如，每天定时截取关键数据仪表盘，将截图嵌入到日报邮件中。

日常工作和效率提升

对于普通用户，可以通过AI助手快速获取网页截图：

• “帮我截取今天的GitHub趋势页面并保存”
• “把这个网页的样子截图给我看看”

四、安装教程

系统要求

详细安装步骤

第一步：注册并获取ScreenshotOne API密钥

访问 ScreenshotOne官网 注册账号，登录后在仪表盘中找到你的API密钥。ScreenshotOne提供免费试用额度，适合初步体验。

第二步：克隆项目并安装依赖

git clone https://github.com/screenshotone/mcp.git
cd mcp
npm install && npm run build

第三步：配置Claude Desktop（以Claude Desktop为例）

找到Claude Desktop的配置文件：

• macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
• Windows: %APPDATA%\Claude\claude_desktop_config.json

添加以下配置：

{
  "mcpServers": {
    "screenshotone": {
      "command": "node",
      "args": ["/你的绝对路径/mcp/build/index.js"],
      "env": {
        "SCREENSHOTONE_API_KEY": "你的API密钥"
      }
    }
  }
}

注意：请将/你的绝对路径/替换为项目实际所在的完整路径。

第四步：重启Claude Desktop

保存配置文件后，完全退出并重启Claude Desktop。在工具列表中应该能看到screenshotone服务器及其render-website-screenshot工具。

五、使用示例

配置完成后，你就可以在MCP客户端中使用自然语言来调用截图功能了。

示例1：基础截图

在Claude Desktop中使用：你可以这样对Claude说：

“请帮我截取https://github.com的首页截图。”

Claude会自动调用render-website-screenshot工具，并将截图返回给你。

示例2：指定截图尺寸

虽然当前版本的文档中没有列出详细参数，但根据ScreenshotOne API的能力，你可以通过修改工具调用参数来指定截图的各种属性。理论上支持的参数包括：

{
  "url": "https://example.com",
  "width": 1280,
  "height": 720,
  "format": "png",
  "cache_ttl": 86400
}

你可以尝试在客户端中这样描述：“请截取https://example.com，宽度1200像素，格式为PNG。”

示例3：独立运行服务器

如果你不想通过Claude Desktop，也可以将screenshotone-mcp作为独立服务运行：

SCREENSHOTONE_API_KEY=你的API密钥 node build/index.js

服务器启动后，它会通过标准输入输出（stdio）与调用方通信。你可以编写自己的程序来调用它。

示例4：集成到Python脚本

以下是一个概念性的Python脚本示例，展示如何调用这个MCP服务器：

import subprocess
import json

# 启动服务器进程
server_process = subprocess.Popen(
    ["node", "build/index.js"],
    stdin=subprocess.PIPE,
    stdout=subprocess.PIPE,
    env={"SCREENSHOTONE_API_KEY": "你的API密钥"}
)

# 构建MCP请求
request = {
    "jsonrpc": "2.0",
    "method": "tools/call",
    "params": {
        "name": "render-website-screenshot",
        "arguments": {
            "url": "https://github.com"
        }
    },
    "id": 1
}

# 发送请求并接收响应
server_process.stdin.write(json.dumps(request).encode())
server_process.stdin.flush()
response = server_process.stdout.readline()
print(response)

注意：实际使用时，需要按照MCP协议规范处理通信细节，上述代码仅为演示思路。

六、常见问题

问题1：服务器启动失败，提示“Cannot find module”

解决方案：请确保你已经运行了npm install和npm run build。如果仍然报错，尝试删除node_modules文件夹和package-lock.json，然后重新运行npm install。

问题2：Claude Desktop中看不到screenshotone工具

解决方案：

• 确认配置文件中的路径是绝对路径，并且build/index.js文件确实存在。
• 检查JSON格式是否正确（例如没有多余的逗号）。
• 完全退出Claude Desktop（不仅仅是关闭窗口），然后重新启动。

问题3：截图返回错误，提示API密钥无效

解决方案：请确认你的ScreenshotOne API密钥是否正确，并且该密钥有足够的配额。你可以登录ScreenshotOne控制台检查密钥状态和剩余额度。

问题4：截图速度很慢

解决方案：截图速度主要取决于目标网站的加载速度和ScreenshotOne API的响应时间。你可以尝试：

• 使用cache_ttl参数启用缓存，同一URL在一段时间内不会重复渲染。
• 选择较小的截图尺寸以减少处理时间。

问题5：能否截取需要登录的网页？

解决方案：ScreenshotOne API支持提供Cookie来截取需要登录的页面。目前这个MCP服务器可能还没有暴露该参数，你可以查看项目的源码或向作者提Issue请求增加此功能。

七、总结

screenshotone-mcp是一个教科书级别的“小而美”MCP服务器示例。它没有试图做一个大而全的工具集，而是专注于一个非常明确的需求：让AI能够轻松获取网页截图。

这个项目的最大价值在于两点：

1. 对于使用者来说，它提供了一个干净、简单的方式，让你能在AI对话中快速生成网页截图。
2. 对于开发者来说，它是一个完美的学习材料。整个项目的代码量非常少，你可以轻松读懂MCP服务器的基本结构，并以此为模板创建自己的MCP服务器。

如果你需要一个简单可靠的网页截图MCP工具，或者想学习如何创建一个MCP服务器，screenshotone-mcp是一个绝佳的起点。