ScreenshotOne

ScreenshotOne MCP Server

ScreenshotOne 的 MCP（Model Context Protocol） 伺服器官方實作。

簡單介紹建置原因，以及對 MCP 未來的一些想法。

ScreenshotOne 也提供官方託管的 MCP 伺服器。設定說明與最新更新請參閱 ScreenshotOne MCP 整合。

工具

• render-website-screenshot：擷取網站螢幕截圖，並依要求傳回暫時性的螢幕截圖、內容與切片 URL。
• render-website-screenshot-as-file：擷取網站螢幕截圖或 PDF，並將檔案本身以 MCP 資源的形式嵌入回應中，同時提供暫時性 URL。
• render-html-screenshot-as-file：擷取你撰寫或收到的 HTML（例如社群卡片或圖表），並以代理程式可檢視的內嵌圖片傳回螢幕截圖，以及檔案名稱和大小。
• extract-website-markdown：擷取網站並直接以文字形式傳回清理後的 Markdown。
• get-usage：取得 ScreenshotOne API 配額與並行使用量。

螢幕截圖工具提供以下專用選項：

• url
• block_banners（預設為 true）
• block_ads（預設為 true）
• image_quality（預設為 80）
• full_page（預設為 false）
• full_page_slices（預設為 false；需要 full_page=true）
• metadata_content（預設為 false）
• metadata_content_format（html 或 markdown；需要 metadata_content=true）

中繼資料內容與整頁切片的選項名稱和值與 ScreenshotOne API 相同。此工具不提供回應類型或快取控制選項；它一律要求 JSON 回應，並停用 API 快取。

設定 metadata_content=true 和 metadata_content_format=markdown，即可在螢幕截圖之外取得暫時性的 Markdown 內容 URL。設定 full_page=true 和 full_page_slices=true，即可取得較小的垂直螢幕截圖 URL。當 AI 代理程式需要分析可能無法可靠地以單張大型圖片處理的長頁面時，建議使用切片。

成功擷取後，會以文字和結構化內容傳回所要求的 URL：

{
    "url": "https://<screenshotone-cache-domain>/...",
    "content": {
        "url": "https://<screenshotone-cache-domain>/...",
        "expires": "Sun, 07 Sep 2026 12:00:00 GMT",
        "format": "markdown"
    },
    "slices": [
        {
            "index": 0,
            "offset_y": 0,
            "width": 1280,
            "height": 4000,
            "url": "https://<screenshotone-cache-domain>/..."
        }
    ]
}

這些 URL 都是暫時性的。螢幕截圖 URL 最長可使用四小時，而中繼資料內容會包含確切的到期時間。請下載你需要保留的任何檔案。

render-website-screenshot-as-file 適用於需要取得檔案本身的用戶端，例如要儲存或附加檔案，或無法下載連結的用戶端。它接受 url、format（預設為 jpg、png、webp、gif、jp2、tiff、avif、heif 或 pdf）、block_banners、block_ads、image_quality、full_page 和 full_page_max_height（需要 full_page=true）。它會將檔案以嵌入資源的形式傳回（type: "resource"，包含 base64 blob 和 MIME 類型），並以文字和結構化內容提供檔案名稱、URI、MIME 類型、大小及暫時性 URL。大於 5 MB 的檔案不會嵌入；此工具會傳回錯誤，建議使用較小的格式、品質或高度，並附上暫時性 URL。

render-html-screenshot-as-file 會擷取呼叫中傳入的 HTML，例如社群卡片、圖表或報告，讓代理程式無須執行瀏覽器即可取得圖片。它接受 html（必填，最多 1,000,000 個字元，會完全依照提供內容傳送）、viewport_width（320–3840，預設為 1280；請使用 HTML 設計時採用的寬度）、full_page（預設為 true）和 image_quality（預設為 80）。HTML 會以 JSON POST 主體傳送至 API，而 API 會直接傳回 JPEG，不提供暫時性 URL。此工具會以內嵌圖片的形式傳回（type: "image"，包含 base64 data），並以文字和結構化內容提供檔案名稱、MIME 類型及大小。大於 5 MB 的圖片不會傳回；錯誤訊息會建議降低品質或 full_page=false。

extract-website-markdown 僅接受 url。這是 ScreenshotOne format=markdown API 請求的專用捷徑，會在單一 MCP 文字回應中直接傳回產生的 Markdown。當代理程式需要讀取或分析頁面內容而不需要螢幕截圖時，請使用此工具。

使用方式

建置

請務必先安裝相依套件並進行建置：

npm install && npm run build

取得 ScreenshotOne API 金鑰

在 ScreenshotOne 註冊並取得 API 金鑰。

使用 npx 執行

無須複製儲存庫，即可直接從 npm 套件執行 CLI：

SCREENSHOTONE_API_KEY=your_api_key npx --yes @screenshotone/mcp

使用 Claude for Desktop

將以下內容加入你的 ~/Library/Application\ Support/Claude/claude_desktop_config.json：

{
    "mcpServers": {
        "screenshotone": {
            "command": "npx",
            "args": ["--yes", "@screenshotone/mcp"],
            "env": {
                "SCREENSHOTONE_API_KEY": "<your api key>"
            }
        }
    }
}

獨立使用或用於其他專案

SCREENSHOTONE_API_KEY=your_api_key node build/index.js

授權條款

ScreenshotOne MCP Server 採用 MIT 授權條款。