Safari 截图

用于在 macOS 上使用 Safari 捕获屏幕截图的 Node.js MCP 服务器。

特征

捕获特定尺寸的窗口截图
支持不同的缩放级别
可配置页面加载等待时间
捕获后清理
原生 macOS 屏幕截图质量

Related MCP server: MCP iOS Simulator Screenshot

用法

import { takeScreenshot } from './screenshot.js'; // Basic window screenshot await takeScreenshot({ url: 'https://www.apple.com', outputPath: './screenshot.png', width: 1024, // Optional: window width (default: 1024) height: 768, // Optional: window height (default: 768) waitTime: 3, // Optional: seconds to wait for load (default: 3) zoomLevel: 1, // Optional: page zoom level (default: 1) }); // Responsive design testing await takeScreenshot({ url: 'https://www.apple.com', outputPath: './mobile.png', width: 375, // iPhone SE width height: 667, // iPhone SE height zoomLevel: 1, }); // High-resolution capture await takeScreenshot({ url: 'https://www.apple.com', outputPath: './desktop-hd.png', width: 1920, // Full HD width height: 1080, // Full HD height waitTime: 5, // Wait longer for HD content zoomLevel: 0.8, // Zoom out slightly });

要求

macOS
Safari
Node.js >= 14.0.0
终端需要辅助功能权限（系统偏好设置 → 安全和隐私 → 隐私 → 辅助功能）

安装

npm install safari-screenshot

选项

选项	类型	默认	描述
网址	细绳	必需的	要捕获的 URL
输出路径	细绳	汽车	屏幕截图的保存位置（默认值：./screenshots/[hostname]-[timestamp].png）
宽度	数字	1024	窗口宽度（以像素为单位）
高度	数字	768	窗口高度（以像素为单位）
等待时间	数字	3	等待页面加载的秒数
缩放级别	数字	1	页面缩放级别（1 = 100%）

常见视口尺寸

该模块使用以下常见视口尺寸进行测试：

桌面：1920×1080（全高清）
笔记本电脑：1366×768
平板电脑横向分辨率：1024×768
平板电脑肖像：768×1024
移动大尺寸：428×926（iPhone 12 Pro Max）
移动中等：390×844（iPhone 12 Pro）
移动小尺寸：375×667（iPhone SE）

工作原理

以指定的窗口大小打开 Safari
加载 URL 并等待页面加载
如果指定，则应用缩放级别
使用原生 macOS 屏幕捕获功能，获得像素完美的效果
验证屏幕截图是否已成功捕获
清理 Safari 窗口

权限

此软件包需要系统事件权限才能运行：

打开系统偏好设置 > 安全和隐私 > 隐私 > 辅助功能
将终端（或你的 IDE）添加到允许的应用程序列表中

与游标一起使用

在光标中设置

打开游标
进入设置，“添加 MCP 服务器”
在配置对话框中：
- 名称： safari-screenshot
- 类型： command
- 命令： npx -y @rogerheykoop/mcp-safari-screenshot
或者对于本地开发：
- 命令： npx -y /path/to/mcp-safari-screenshot/server.js

示例命令

在Cursor中连接到服务器后，可以使用以下命令：

Take a screenshot of https://apple.com at desktop size

响应：将以 1920×1080 分辨率拍摄

Capture https://apple.com on iPhone 12 Pro

响应：将以 390×844 分辨率拍摄

Screenshot github.com at 50% zoom

响应：将使用 ZoomLevel：0.5 进行捕捉

支持的参数

MCP 服务器理解以下概念：

设备名称（例如“iPhone”、“iPad”、“桌面”）
尺寸（例如“1024x768”）
缩放级别（例如，“50％缩放”，“2倍缩放”）
等待时间（例如“等待 5 秒”）

示例工作流程

响应式测试
Take screenshots of apple.com on iPhone, iPad, and desktop
缩放测试
Capture github.com at 75% zoom and 125% zoom
自定义尺寸
Screenshot example.com at 1440x900

尖端

屏幕截图默认保存到screenshots目录
设备名称自动设置适当的尺寸
服务器负责清理 Safari 窗口
对于加载缓慢的页面使用“等待 X 秒”

故障排除

如果您遇到问题：

检查终端是否具有辅助功能权限
确认 Safari 未处于隐私浏览模式
确保工作目录可写
检查 Cursor 控制台中的错误消息

执照

麻省理工学院

本地测试

您可以直接测试 MCP 实现：

# Test discovery echo '{"type":"discover"}' | npx -y ./server.js # Test screenshot echo '{"type":"execute","tool":"take_screenshot","input":"Take a screenshot of https://apple.com","requestId":"123"}' | npx -y ./server.js

预期响应：