Claude Browser

VS Code 内に複数の永続的なブラウザータブを備え、MCP 経由で Claude から操作できます。

あるエディターグループでは GitHub を開き、別のグループでは Claude ターミナルを開きます。再起動後もサインイン状態が維持されます。エディターを離れることなく、Claude に今見ているのと同じページを読ませたりクリックさせたりできます。

機能

• タブは1つではなく複数。 各ブラウザータブはエディタータブなので、分割、グループ間のドラッグ、前回の場所への再オープンが可能です。

• セッションは永続します。 Cookie とローカルストレージは再起動後も保持され、すべてのタブで共有されるため、Slack へのサインインは一度で十分です。

• フレーム表示を拒否するサイトでも動作します。 GitHub、Slack、Google はすべて X-Frame-Options: DENY を送信するため、組み込みの Simple Browser では表示できません。

• Claude が操作します。 拡張機能は MCP エンドポイントをホストし、タブの一覧表示、ナビゲーション、ページのスナップショット、クリック、入力、コンソールの読み取りを行うツールを提供します。

• 実際の DOM です。 ブラウザーのビデオストリームではありません。入力遅延はネイティブで、テキスト選択や検索ウィジェットも機能し、音声も再生されます。

始め方

yarn install
yarn build

F5 を押して拡張機能開発ホストを起動し、コマンドパレットから Claude Browser: Open Browser Tab を実行します。

Claude に操作させるには、同じウィンドウでターミナルを開いて claude を実行します。拡張機能はエンドポイントをワークスペースの .mcp.json に書き込むため、ツールはすでに利用可能です。手動で登録したい場合は Claude Browser: Show MCP Endpoint を実行します。

コマンド

設定

仕組み

VS Code の webview はサンドボックス化された iframe であり、開いておきたいサイトはフレーム表示を拒否します。そこで拡張機能はローカル書き換えプロキシを実行します。各サイトは github.com.s.localhost:41998 のような独自のループバックオリジンから配信され、その際にフレーム表示ヘッダーとトランスポートヘッダーが書き換えられます。Cookie はブラウザーにまったく到達せず、プロキシが保持して上流に再添付します。これが __Host- プレフィックス付きセッション Cookie が異なるオリジンから配信されても生存できる唯一の方法です。すべてのページに小さなシムが注入され、ネットワーク呼び出しを再ルーティングし、ナビゲーションをプロキシ上に保ち、MCP ツールからのコマンドを実行します。

詳細と、このアプローチでできないことは docs/ にあります。

ドキュメント

• Architecture — 構成要素とそれらの連携方法

• Proxy — オリジンマッピング、ヘッダー書き換え、ページシム

• Persistence — セッションの保存場所と永続化の範囲

• MCP — ツールとその接続方法

• Security — 脅威モデルとリクエストガード

• Limitations — 動作しないこととその理由

• Development — ビルド、テスト、リリース