ScreenshotOne

公式

ScreenshotOneでウェブサイトのスクリーンショットをレンダリングします

GitHub

ScreenshotOne MCPで何ができますか？

スクリーンショットを撮影する — アシスタントに任意のurlのスクリーンショットをレンダリングするよう依頼し、一時的なスクリーンショット、コンテンツ、スライスのURLを取得します。
スクリーンショットをファイルとして保存する — render-website-screenshot-as-fileを使うと、保存または添付できるファイルとして画像やPDFを取得できます。
ページのコンテンツをMarkdownとして抽出する — extract-website-markdownを使うと、スクリーンショットを撮らずに、ページの整形済みテキストを読み取ったり分析したりできます。
キャプチャオプションを制御する — block_banners、block_ads、full_page、full_page_slicesを切り替えて、キャプチャを調整します。
APIの使用状況を確認する — get-usageを使うと、ScreenshotOneの利用枠と同時実行数を確認できます。

ドキュメント

ScreenshotOne MCP Server

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

開発の背景と MCP の今後についての考察。

ScreenshotOne は、公式のホスト型 MCP サーバーも提供しています。セットアップ手順と最新情報については、ScreenshotOne MCP integration をご覧ください。

ツール

render-website-screenshot: ウェブサイトのスクリーンショットをレンダリングし、リクエストに応じて一時的なスクリーンショット、コンテンツ、スライスの URL を返します。
render-website-screenshot-as-file: ウェブサイトのスクリーンショットまたは PDF をレンダリングし、一時 URL とともに、MCP リソースとしてレスポンスに埋め込まれたファイル自体を返します。
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 と同じです。このツールではレスポンスタイプやキャッシュを制御できません。常に API キャッシュを無効にして JSON レスポンスをリクエストします。

metadata_content=true と metadata_content_format=markdown を設定すると、スクリーンショットとともに一時的な Markdown コンテンツ URL を受け取れます。full_page=true と full_page_slices=true を設定すると、より小さな縦長スクリーンショットの URL を受け取れます。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 時間利用できます。メタデータコンテンツには正確な有効期限が含まれます。保存しておきたい成果物はダウンロードしてください。

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 が必要）を受け付けます。ファイルは埋め込みリソース（base64 の blob と MIME タイプを含む type: "resource"）として返され、名前、URI、MIME タイプ、サイズ、一時 URL もテキストと構造化コンテンツとして返されます。5 MB を超えるファイルは埋め込まれません。その場合、より小さい形式、低い品質、または短い高さを提案するエラーと、一時 URL が返されます。

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 License の下でライセンスされています。