ScreenshotOne MCP Server

ScreenshotOne MCP サーバー

ScreenshotOne 向けの MCP（Model Context Protocol） サーバーの公式実装です。

このサーバーを構築した理由と、MCP の今後に関する考察。

ScreenshotOne は、公式のホスト型 MCP サーバーも提供しています。設定方法と最新情報については、ScreenshotOne MCP integration をご覧ください。

ツール

• render-website-screenshot：ウェブサイトのスクリーンショットを撮影し、指定に応じて一時的なスクリーンショット、コンテンツ、スライスの URL を返します。
• 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 レスポンスをリクエストします。

スクリーンショットとともに一時的な Markdown コンテンツ URL を受け取るには、metadata_content=true と metadata_content_format=markdown を設定します。より小さな縦長スクリーンショットの URL を受け取るには、full_page=true と full_page_slices=true を設定します。AI エージェントが、1 枚の大きな画像では安定して処理できない可能性のある長いページを分析する場合は、スライスの使用をおすすめします。

キャプチャに成功すると、リクエストした 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 は最長 4 時間利用できます。メタデータコンテンツには正確な有効期限が含まれます。保持したいアーティファクトはダウンロードしてください。

extract-website-markdown が受け付けるのは url のみです。これは ScreenshotOne の format=markdown API リクエストに特化したショートカットで、生成された Markdown を 1 つの MCP テキストレスポンスとして直接返します。スクリーンショットなしでページのコンテンツを読み取ったり分析したりする必要がある場合に使用してください。

使い方

ビルドする

必ず最初に依存関係をインストールしてビルドしてください。

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 ライセンスに基づいてライセンスされています。