mcpField
S
Shotpipe — Screenshots & OG Images

Shotpipe — Screenshots & OG Images

ローカル
shotpipe.ioブラウザ自動化014 週間前に更新

Shotpipe — Screenshots & OG Images について

Shotpipe MCP は、AI エージェント向けのホスト型スクリーンショット/Open Graph 画像サービスです。URL のページを画像として取得したり、ソーシャルカードのリンクを生成したりできます。Shotpipe 側でレンダリングし、キャッシュと未信頼 URL への SSRF 対策を備えています。

主な機能

  1. 01ウェブページのスクリーンショットを画像で返却
  2. 02署名付きソーシャルカード URL の生成
  3. 03複数形式とスクリーンショット設定に対応
  4. 04スクリーンショット結果のキャッシュ
  5. 05広告と Cookie 同意バナーを標準で除去

活用シーン

  1. 01エージェントによるページ表示結果の確認
  2. 02ページやビルド用のソーシャルカード URL 作成
  3. 03ユーザー提供 URL のページをキャプチャ

MCP 対応

MCP サーバーは `screenshot` と `og_image` ツールをクライアントに公開します。Shotpipe のホスト型サービスでページを描画し、画像または署名付き画像 URL を返します。

設定

ローカルサーバーの設定はどのクライアントでも共通です。コピーしてクライアントの MCP 設定ファイルに貼り付けてください。

mcp.json · 共通設定
{
"mcpServers": {
"podop29-shotpipe": {
"command": "npx",
"args": [
"-y",
"shotpipe-mcp"
],
"env": {
"SHOTPIPE_KEY": "<SHOTPIPE_KEY>",
"SHOTPIPE_SECRET": "<SHOTPIPE_SECRET>",
"SHOTPIPE_BASE_URL": "<SHOTPIPE_BASE_URL>"
}
}
}
}
起動コマンドnpx -y shotpipe-mcp
設定が必要な環境変数
SHOTPIPE_KEYシークレットShotpipe API key id (starts with k_). Free at https://shotpipe.io/signup.
SHOTPIPE_SECRETシークレットShotpipe HMAC signing secret. Requests are signed locally; the secret never leaves the process.
SHOTPIPE_BASE_URLOverride the API base URL for a self-hosted Shotpipe instance. Defaults to https://shotpipe.io.

ローカルサーバーにはマシン上の実行環境(Node.js 18 以上など)が必要です。設定ファイルの場所はクライアントごとに異なります。

パッケージ
npmshotpipe-mcp0.1.1

ツール

2

掲載時のツール一覧 · 2 週間前に更新

パラメーター型必須説明
dprenumいいえデバイスピクセル比(Retina)。デフォルトは 1 です。1 | 2 | 3
urlstringはい撮影するページの URL(http/https)。
darkbooleanいいえprefers-color-scheme: dark をエミュレートします。
delayintegerいいえ撮影前の追加待機時間(ms)。
freshbooleanいいえキャッシュを回避して再レンダリングを強制します。
widthintegerいいえビューポート幅(px)。デフォルトは 1200 です。
formatenumいいえ出力形式。デフォルトは png です。png | jpeg | pdf
heightintegerいいえビューポートの高さ(px)。デフォルトは 630 です。
qualityintegerいいえJPEG 品質(1~100、format=jpeg の場合のみ)。
selectorstringいいえCSS セレクター — スクリーンショットをこの要素に切り抜きます。
wait_forstringいいえスクリーンショットを撮る前に、この CSS セレクターに一致する要素が表示されるまで待機します。
block_adsbooleanいいえ広告/トラッカーへのリクエストをブロックします。デフォルトは true です。
full_pagebooleanいいえビューポートだけでなく、スクロール可能なページ全体をキャプチャします。
block_bannersbooleanいいえCookie 同意バナーを非表示にします。デフォルトは true です。
omit_backgroundbooleanいいえ透明な背景にします(png のみ)。

詳細

shotpipe-mcp

AI エージェント向けの、ホスト型で SSRF 対策済み、キャッシュ対応のスクリーンショットと Open Graph 画像です。ヘッドレス Chrome の実行は不要です。

エージェントが Shotpipe を呼び出して、任意の URL のスクリーンショットを撮って結果を確認したり、ソーシャルカード画像を生成したりできる MCP サーバーです。ローカルのブラウザツールではできないことを実現します。

  • エージェントのサンドボックスに Chrome は不要です。 レンダリングは Shotpipe のインフラストラクチャ上で行われます。インストールも、メモリ管理も不要で、午前2時に OOM が発生することもありません。
  • 信頼できない URL にも安全です。 エージェントはユーザーが入力した URL を指定します。Shotpipe は DNS を独自に解決して IP を固定し、リダイレクトのたびに再確認して、プライベート/ループバック/クラウドメタデータのホストを拒否します。そのため、悪意のあるリンクがレンダラーを SSRF の侵入口にすることはありません。
  • キャッシュ対応です。 最初のキャプチャはレンダリングされます。同一のリクエストはその後すべて、エッジからミリ秒単位で配信され、費用もかかりません。

広告と Cookie 同意のバナーは、デフォルトで除去されます。

インストール

// Claude Desktop (claude_desktop_config.json), Claude Code (.mcp.json),
// Cursor, Cline, or any MCP client:
{
  "mcpServers": {
    "shotpipe": {
      "command": "npx",
      "args": ["-y", "shotpipe-mcp"],
      "env": {
        "SHOTPIPE_KEY": "k_your_key",
        "SHOTPIPE_SECRET": "your_signing_secret"
      }
    }
  }
}

無料キーは**shotpipe.io/signup**で取得できます(カード不要)。または npx shotpipe-init を実行してください。Shotpipe をセルフホストする場合は、SHOTPIPE_BASE_URL を設定してください。

ツール

screenshot

URL のスクリーンショットを撮り、画像(モデルが確認できます)と、永続的に共有可能な署名付き URL を返します。

url(必須) · format png|jpeg|pdf · width · height · dpr · full_page · selector · dark · omit_background · block_ads · block_banners · wait_for · delay · quality · fresh

og_image

ホスト型テンプレートから署名付きソーシャルカード URL を生成します。デフォルトではURL のみを返し、レンダリングは行いません。画像はクローラーが最初にアクセスしたときに遅延レンダリングされるため、エージェントやビルドの処理時間を短く保てます。<meta property="og:image"> に設定してください。render: true を渡すと、プレビュー画像も取得できます。

title(必須) · template · author · tag · accent · logo · width · height · dpr · render

仕組み

署名シークレットがプロセスの外に出ることはありません。すべてのリクエストは、Shotpipe のほかのクライアントとまったく同じように、ローカルで HMAC 署名されます。このサーバーは署名付き URL を組み立て、(screenshot の場合は)バイト列を取得するだけです。

MIT · shotpipe.io

コメント

MCP は初めてですか?

プロトコルの概要から最初のサーバーの導入まで、よくある疑問にまとめて答えます。

AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。