关键词

屏幕截图网页截取SafarimacOS自动化

Safari Screenshot MCP Server使用说明

项目简介

Safari Screenshot MCP Server 是一个基于 Model Context Protocol (MCP) 构建的后端服务，它利用 macOS 上的 Safari 浏览器和系统截图功能，为 LLM 客户端提供网页屏幕截图服务。通过注册 'take_screenshot' 工具，该服务器允许 LLM 应用自动化截取网页内容，并可自定义截图尺寸、缩放级别和等待时间。

主要功能点

  • 网页截图工具: 提供 'take_screenshot' 工具，允许客户端指定 URL 和截图参数，服务器将使用 Safari 浏览器访问该 URL 并截取屏幕截图。
  • 可配置截图参数: 支持自定义截图的宽度、高度、缩放级别和页面加载等待时间，以满足不同场景的截图需求。
  • 高质量截图: 利用 macOS 原生 'screencapture' 命令，保证截图质量和 Safari 浏览器的渲染效果。
  • 易于集成: 通过 MCP 协议与客户端通信，可以方便地集成到支持 MCP 协议的 LLM 应用中，例如 Cursor 编辑器。

安装步骤

  1. 安装 Node.js: 确保你的 macOS 系统上已安装 Node.js (>= 14.0.0)。
  2. 安装 npm 包: 在终端中，使用 npm 安装 'safari-screenshot' 包： 
    npm install @rogerheykoop/mcp-safari-screenshot
  3. 配置 Accessibility 权限: 由于服务器需要控制 Safari 和执行系统截图，需要授予 "终端 (Terminal)" 或你使用的 IDE "辅助功能 (Accessibility)" 权限。
    • 打开 “系统偏好设置” -> “安全性与隐私” -> “隐私” -> “辅助功能”。
    • 点击左下角的锁图标解锁设置，然后勾选 “终端” 或你的 IDE 应用，添加到允许控制电脑的列表中。

服务器配置

要将 Safari Screenshot MCP Server 集成到 MCP 客户端（例如 Cursor），你需要配置服务器的启动命令。以下是 Cursor 中 “Add MCP Server” 的配置信息示例：

{
  "serverName": "safari-screenshot",
  "command": "npx -y @rogerheykoop/mcp-safari-screenshot"
}

配置参数说明:

  • 'serverName': 服务器名称，可以自定义，例如 'safari-screenshot'。
  • 'command': 服务器启动命令。 'npx -y @rogerheykoop/mcp-safari-screenshot' 会自动下载并执行 'safari-screenshot' npm 包。 如果你本地开发，可以使用 'npx -y /path/to/mcp-safari-screenshot/dist/index.js' （请替换 '/path/to/mcp-safari-screenshot' 为你的本地仓库路径）。

注意: 'args' 字段在此配置中为空，因为该服务器默认通过标准输入/输出 (stdio) 进行通信，无需额外命令行参数。

基本使用方法

在 MCP 客户端配置并连接到 Safari Screenshot MCP Server 后，你可以通过自然语言指令或特定的 MCP 请求来调用 'take_screenshot' 工具。

示例指令 (在 Cursor 中):

  • 'Take a screenshot of https://apple.com at desktop size'
  • 'Capture https://github.com on iPhone 12 Pro'
  • 'Screenshot example.com at 50% zoom'

服务器会解析指令中的 URL、设备类型（或尺寸）、缩放级别等信息，并调用 Safari 浏览器截取相应的网页截图。截图文件默认保存在服务器运行目录下的 'screenshots' 文件夹中，并会在响应中返回截图保存路径。

测试服务器 (本地开发):

你可以使用以下命令直接测试 MCP 服务器的发现 (discover) 和执行 (execute) 功能：

# 测试发现 (查看服务器 capabilities)
echo '{"type":"discover"}' | npx -y @rogerheykoop/mcp-safari-screenshot

# 测试截图工具 (请求截取 apple.com 首页)
echo '{"type":"execute","tool":"take_screenshot","input":"Take a screenshot of https://apple.com","requestId":"123","parameters":{"url": "https://apple.com"}}' | npx -y @rogerheykoop/mcp-safari-screenshot

请注意，在实际 MCP 客户端交互中，请求和响应的格式会由客户端库自动处理。

信息

分类

桌面与硬件

访问项目