ScreenshotMCP 是一个基于 Model Context Protocol（MCP）的服务器，用于捕获网站截图，主要面向需要在开发工作流中自动获取网页截图的场景。项目由 upnorthmedia 发布在 GitHub，采用 MIT 许可。
一、用途 它提供网页截图能力，可作为 MCP 服务器接入支持 MCP 的客户端，例如 Claude Code CLI、Claude Desktop 和 Cursor IDE，从而在开发过程中通过自然语言命令完成截图。
二、主要能力 功能包括：整页截图捕获（自动滚动）、通过 CSS 选择器进行元素级截图、多种设备预设（mobile、tablet、desktop）、自定义视口配置、高级等待条件（CSS 选择器、网络空闲、自定义延迟）、面向安全运行的错误处理与验证、防止资源耗尽的速度限制。可用工具包括 capture_screenshot（整页截图，带高级配置）、capture_element（页面特定元素截图）、list_device_presets（列出所有可用设备预设及其配置）。
capture_screenshot 参数：url（必填，要截图的网页 URL）；viewport 包括预设 preset（mobile、tablet、desktop）、自定义 width（像素，100-5000）、height（像素，100-5000）、deviceScaleFactor（0.1-3）、isMobile（移动设备模拟）、hasTouch（触摸支持模拟）；waitFor 包括 type（selector、function、timeout 或 networkidle）与 value（CSS 选择器、函数或超时值）以及 timeout（等待超时毫秒数）；delay（截图前额外延迟）；waitUntil（导航完成条件）。
capture_element 参数：url（必填）、selector（必填，目标元素的 CSS 选择器）、viewport（配置同上）。
三、使用方式 安装步骤：克隆或下载项目；进入目录 cd /path/to/ScreenshotMCP；将 .env.example 重命名为 .env；安装依赖 npm install；启动服务器 npm start。
与 Claude Code 配合：可在 Claude Code CLI 或 Claude Desktop 中直接使用，在开发工作流中截图。Claude Code CLI 可添加到 ~/.config/claude/mcp_servers.json，命令为 claude mcp add screenshot-full-page-mcp node ./index.js。Claude Desktop 则添加到 claude_desktop_config.json。
与 Cursor 配合：进入 Settings > MCP Servers，新增 MCP 服务器条目，示例配置为 { "mcpServers" : { "screenshot-full-page-mcp" : { "command" : " node " , "args" : [ " /path/to/screenshot-full-page-mcp/index.js " ] } } }，保存设置后即可使用。配置完成后可通过自然语言命令使用，例如基础截图、移动端截图、自定义视口、等待元素、元素截图等。
环境变量在 .env 文件中设置。安全特性包括：URL 验证（仅 HTTP/HTTPS）、CSS 选择器清理、并发请求限速、沙箱化浏览器执行、输入验证与错误处理。
四、系统要求与限制 需要 Chrome/Chromium 浏览器（随 Puppeteer 自动安装）、至少 2GB 内存、500MB 磁盘空间。故障排查方面：浏览器启动失败时检查系统资源、Chrome/Chromium 是否正确安装，可尝试设置 BROWSER_HEADLESS=false 调试；截图超时可增大 .env 中的 BROWSER_TIMEOUT、检查目标网站是否正常加载、使用合适的 waitUntil 条件；内存问题可减少 MAX_CONCURRENT_SCREENSHOTS、定期重启 MCP 服务器、监控系统内存。可在 .env 中设置 DEBUG=true 启用详细日志。
五、其他信息 欢迎贡献代码：Fork 仓库、创建功能分支、修改、补充测试（如适用）、提交拉取请求。许可证为 MIT。问题与疑问可通过 GitHub 提交 issue、查看故障排查部分或查阅 MCP 文档。
