Stagehand MCP Server
Stagehand MCPサーバーでClaude連携・AI駆動のWeb自動化を実現
npx @browserbasehq/mcp-stagehand概要
Stagehand MCP Serverの設定方法と使い方。
Browserbaseが開発したAI駆動のWebブラウザ自動化フレームワーク「Stagehand」をClaudeから操作できるMCPサーバー。
自然言語によるブラウザ操作指示、要素の自動検出・クリック・入力、Webコンテンツの構造化データ抽出が可能。
ClaudeとStagehandのMCPサーバー連携により、複雑なWeb操作フローの自然言語による自動化やスクレイピングを自動化できる。
Playwright/Puppeteerより高い抽象度でAIが直接操作できる点が特徴。
設定方法はAPIキーを環境変数に設定するだけでシンプルに完結する。
料金・APIキー情報
料金
不明APIキー
🔑 必要🔑 APIキーの取得方法
- 1
https://www.browserbase.com にアクセスしてアカウントを作成（無料プランあり）
- 2
ダッシュボードの「Settings」→「API Keys」でAPIキーを取得
- 3
「Projects」ページからプロジェクトIDを確認
- 4
取得したAPIキーとプロジェクトIDをコピーして保存する（再表示不可のため必ず保存すること）
こんな使い方ができます
「この商品をカートに入れて購入する」という自然言語でブラウザ操作をClaudeに実行させられる
Webページから必要な情報だけを構造化して抽出させられる
ログインからデータ収集までの複数ステップを一括してClaudeに自動化させられる
動的なSPAサイトのコンテンツ取得をClaudeに指示できる
セットアップ手順
- 1
Browserbase（browserbase.com）にアクセスしてアカウントを作成・ログインする
- 2
ダッシュボードで新しいプロジェクトを作成してプロジェクトIDをメモする
- 3
「Settings」→「API Keys」からAPIキーを発行・コピーする
- 4
ターミナルで以下のコマンドを実行してClaude Codeに追加する：claude mcp add stagehand -e BROWSERBASE_API_KEY=your-api-key-here -e BROWSERBASE_PROJECT_ID=your-project-id-here -- npx -y @browserbasehq/mcp-stagehand
設定ファイル
コピー前に確認
Browserbaseアカウント必須。Node.js 18以上推奨。
claude mcp add stagehand -e BROWSERBASE_API_KEY=your-api-key-here -e BROWSERBASE_PROJECT_ID=your-project-id-here -- npx -y @browserbasehq/mcp-stagehand注意事項
BrowserbaseのクラウドブラウザとStagehandのAI操作レイヤーを組み合わせた高機能MCPサーバー