クラウドブラウザMCPサーバー

テスト

1. npm install実行して必要な依存関係をインストールし、次にnpm run buildを実行してdist/index.jsを取得します。

2. npm run inspectorを実行してサーバーを起動します。

始める

1. npm install実行して必要な依存関係をインストールし、次にnpm run buildを実行してdist/index.jsを取得します。

2. サーバーを使用するために、Claude Desktop 構成を設定します。

3. Claude デスクトップ アプリを再起動すると、🔨 アイコンをクリックすると利用可能なツールが表示されます。

4. ツールを使い始めましょう! 以下は、Claude がブラウザ セッションを閉じる画像です。

npmの使用

ツール

ブラウザベースAPI

• クラウドブラウザナビゲート

  • ブラウザで任意のURLに移動する

  • 入力: url (文字列)

• クラウドブラウザ評価

  • ブラウザコンソールでJavaScriptを実行する

  • 入力: script (文字列): 実行するJavaScriptコード

• cloudbrowser_get_current_url

  • ブラウザページの現在のURLを取得する

• クラウドブラウザのスクリーンショット

  • ページ全体または特定の要素のスクリーンショットをキャプチャします

  • 入力:

    • name (文字列、必須): スクリーンショットの名前

    • selector （文字列、オプション）：スクリーンショットを撮る要素のCSSセレクター

    • width （数値、オプション、デフォルト：800）：スクリーンショットの幅

    • height （数値、オプション、デフォルト：600）：スクリーンショットの高さ

• クラウドブラウザのクリック

  • ページ上の要素をクリック

  • 入力: selector (文字列): クリックする要素の CSS セレクター

• クラウドブラウザの塗りつぶし

  • 入力フィールドに記入してください

  • 入力:

    • selector （文字列）：入力フィールドのCSSセレクター

    • value (文字列): 入力する値

• クラウドブラウザのテキスト取得

  • 現在のページからすべてのコンテンツを抽出します

  • 入力: selector (文字列、オプション): 特定の要素からコンテンツを取得するための CSS セレクター

リソース

サーバーは、次の 2 種類のリソースへのアクセスを提供します。

2. スクリーンショット( screenshot://<name> )

   • キャプチャしたスクリーンショットのPNG画像

   • キャプチャ時に指定したスクリーンショット名からアクセスできます