agent-webbridge

WebBridge（Agent WebBridge）

WebBridge（agent-webbridge）：Claude Code、Cursor、あらゆる MCP クライアントを使って、実際にログイン済みの Chromeを操作できます。複数の Chrome プロファイルに対応し、タブごとの真の DevTools 並列処理を実現します。100％オープンソース（MIT）、クラウド不使用、テレメトリーなし、すべて127.0.0.1上で動作します。

🌐 インタラクティブサイトとデモ録画：jeet-dhandha.github.io/agent-webbridge

エージェントに追加する（30秒）

npm i -g agent-webbridge && awb setup "Work"     # once: installs the daemon + the Chrome extension

その後、Claude Desktop、Claude Code、Cursor、または Windsurf に MCP サーバーを追加します。

{
  "mcpServers": {
    "chrome": { "command": "npx", "args": ["-y", "agent-webbridge", "mcp"] }
  }
}

Claude Code：claude mcp add chrome -- npx -y agent-webbridge mcp

または、エージェントスキルとしてインストールします（Claude Code、Cursor、Codex など）：npx skills add jeet-dhandha/agent-webbridge

これで、エージェントはbrowser_navigate、browser_snapshot、browser_click、browser_fill、browser_evaluate、browser_screenshotなどを利用できます。すべてあなたのChromeで、あなたのセッションを使って実行されます。profileを渡すとアカウントを選択でき、tabIdを渡すとタブを並列実行できます。呼び出しに失敗した場合は、browser_statusで接続されていないプロファイルをエージェントに知らせます。

Playwright やクラウドブラウザーではなく、これを使う理由

	クラウドブラウザー（Browserbase、Steel…）	ヘッドレス Playwright / Puppeteer	agent-webbridge
費用	使用量に応じた課金	無料	無料、MIT
ログイン情報、パスキー、2FA	再認証または Cookie のアップロードが必要	再ログインが必要。2FA は機能しない	すでにログイン済み
ブラウザーの識別情報	クラウドやデータセンターの IP はブロックされることが多い	ヘッドレスブラウザーはブロックされることが多い	自分の Chrome プロファイル（サイトによっては自動化が制限されます）
データの送信先	サードパーティーのサーバー	ローカル	ローカルのみ、127.0.0.1
複数アカウントの同時利用	セッションを個別に管理	手動での調整が必要	アカウントごとに1つのプロファイル、タブを並列実行

すでにログイン済みのブラウザーを自動化します。自動化する権限のあるアカウントやサイトでのみ使用し、各サイトの利用規約を守ってください。

agent-webbridgeは、小規模な Node デーモン（ランタイム依存関係はwsのみ）と、クリーンルーム方式で開発された MV3 Chrome 拡張機能で構成されています。エージェントがローカルルーターにコマンドを POST すると、ルーターが適切なプロファイルのデーモンに転送し、拡張機能が Chrome DevTools Protocol にタブごとに接続します。

動作を見る

モックではなく、実際の動作です。スクリプトがnpx agent-webbridge mcpに MCP 呼び出しを送り、実際にログイン済みの Chrome プロファイルを操作します。スクリーンショットはブラウザー自体が撮影したもので、所要時間も実測値です。公開ページのみを対象としており、アカウントへの送信は行いません。

あらゆるページを読む：Hacker News のスナップショット取得と評価	5つのタブを同時に操作：並列では3.5秒、1つずつでは9.3秒
実際のログインを利用：ログイン済みのエディターに入力し、公開前に停止	フォームに入力して送信（入力欄、ラジオボタン、チェックボックス）

所要時間は、自宅のブロードバンドに接続した1台の MacBook で計測したものです。お使いの環境では異なる場合があります。

概要

• 実際のブラウザーを操作 — 実際の Chrome、実際のログインセッションを使用します。ヘッドレスで再ログインしたり、認証を回避してスクレイピングしたりする必要はありません。
• タブを並列実行 — 拡張機能はタブごとに chrome.debugger を接続するため、1 つのプロファイルで N 個のタブを並行して実行できます。ベンチマークでは、5 個のタブを順番に実行すると 9.3 秒かかったところ、並列実行では 3.5 秒でした（MacBook 1 台での測定値です。お使いの環境では異なる場合があります）。
• 複数のプロファイルに対応 — プロファイルごとにデーモンを 1 つ起動します。1 つのエンドポイントから、合計で プロファイル数 × タブ数 の並列実行が可能です。
• プライバシーを確保 — 独自のデーモンと独自の MV3 拡張機能を使用します。クローズドソースの依存関係もアカウントも不要です。すべてローカルで動作します。

インストール

npm i -g agent-webbridge        # 1. the daemon + the `awb` CLI
awb setup "Work"                # 2. opens the Chrome Web Store; click "Add to Chrome"

awb setup は、選択したプロファイルで Agent WebBridge の掲載ページを開き、Chrome に追加をクリックするまでポーリングします。インストールを検知するとすぐに、プロファイルをデーモンに接続し、全体を起動します。

要件： macOS または Windows · Google Chrome · Node.js ≥ 18。

クイックスタート

awb up "Work" "Personal"        # bring profiles up (setup did this on first run)

# Drive any profile by name — using the handy cmd helper function:
cmd(){ curl -s -m 60 -X POST http://127.0.0.1:10086/command -H 'Content-Type: application/json' -d "$1"; echo; }

cmd '{"action":"navigate","args":{"url":"https://news.ycombinator.com"},"session":"scan","profile":"Work"}'

awb down                        # stop the fleet when done

すべての呼び出しは 127.0.0.1:10086 への POST /command です。シェルでの引用符のエスケープに関する問題を防ぐため、ペイロードは単一引用符（'...'）で囲んでください。"session" を指定すると、タスクのタブが 1 つの Chrome タブグループにまとめられます。"profile" では、操作する Chrome プロファイルを選択します。{"action":"screenshot","args":{"path":"/path/to/img.png"}} を渡すと、スクリーンショットをディスクに直接保存できます。

ツール（15 個のネイティブツール + ステータス）

ツール	機能
navigate	新規または既存のタブで URL を開く
find_tab	URL またはタイトルからタブを検索する
evaluate	ページ内で JavaScript を実行し、結果を返す
snapshot	安定した @e 要素参照を含むアクセシビリティツリー
click	@e 参照で要素をクリックする（合成 DOM クリック）
trusted_click	click を無視するページ向けの実際のマウスクリック（CDP、isTrusted）
fill	ネイティブ入力欄と contenteditable のリッチテキストフィールドに値を設定する
upload	<input type="file"> にファイルをプログラムで割り当てる
file_chooser_intercept	プログラムによるアップロード中に、ネイティブ OS のファイル選択ダイアログ（Finder/Explorer）を抑制する
screenshot	ページ全体または要素のスクリーンショットを撮影し、ディスクに直接保存する
save_as_pdf	ページを PDF として保存する
network	ネットワークリクエストを取得する（start、stop、list、detail）
list_tabs	ID とタブグループ情報付きで開いているタブを一覧表示する
close_tab	タブを閉じる
close_session	セッションと、そのセッションのタブグループ全体を閉じる

プログラムから使える SDK（Node.js と Python）

Node.js ESM SDK

import { WebBridgeClient } from "agent-webbridge";

const client = new WebBridgeClient({ profile: "Work", session: "my-task" });
await client.navigate("https://example.com");
const title = await client.evaluate("document.title");
console.log("Title:", title);

Python 3 SDK（依存関係ゼロ）

from scripts.awb_client import WebBridgeClient

client = WebBridgeClient(profile="Work", session="my-task")
client.navigate("https://example.com")
title = client.evaluate("document.title")
print("Title:", title)

仕組み

  AI agent  ──HTTP POST /command──▶  router (127.0.0.1:10086)   routes by "profile"
                                          │
                       ┌──────────────────┼──────────────────┐
                       ▼                  ▼                  ▼
                  daemon "Work"      daemon "Personal"     daemon …      one per profile
                       │  WebSocket
                       ▼
                  MV3 extension      ──chrome.debugger (a Map: one attach PER TAB)──▶
                       │
                       ▼
                  Chrome DevTools Protocol      tab 1 ║ tab 2 ║ tab 3   (concurrent)

ルーターは各コマンドを、決定的なハッシュポート上にあるプロファイルごとのデーモンにプロキシします。デーモンは WebSocket 経由で該当プロファイルの拡張機能に中継します。拡張機能はタブごとに 1 つ、chrome.debugger の接続を Map に保持し、CDP 呼び出しを実行します。タブごとのマップが、この仕組みの要です。すべてを単一の「現在のタブ」に集約するブリッジでは、プロファイルごとに 1 つのタブしか操作できませんが、この仕組みなら N 個のタブを操作できます。

CLI

コマンド	説明
awb setup <profile…>	初回インストール：「Load unpacked」の手順を案内し、接続して、すべてのプロファイルを起動します
awb up <profile…>	指定したプロファイルのデーモンとルーターを起動し、ウィンドウを開いて接続します
awb down	ルーターとすべてのプロファイルを停止します
awb connect <profile…> [--no-restart]	各プロファイルの拡張機能をそのデーモンに接続します。拡張機能が最新であれば Chrome は開いたままです。--no-restart を指定すると Chrome は閉じず、代わりに失敗します
awb check [profile…] [--json]	読み取り専用の準備状況チェック（フォルダー？開発モード？読み込み済み？接続済み？）。インストール中にエージェントがポーリングする項目です
awb status	プロファイルごとのデーモンと拡張機能の接続状況を表示します
awb doctor	環境（Chrome、プロファイル、デーモン、拡張機能）を診断します
awb mcp	stdio MCP サーバーを実行します（上記の設定で起動するものです）
awb profiles	Chrome プロファイル、そのハッシュ化されたポート、拡張機能の有無を一覧表示します

<profile> には、一意に特定できるものを指定します。プロファイルの 名前（"Work"）、メールアドレス、または Chrome の ディレクトリ（"Profile 2"）を指定できます。

AI エージェントから使う

Claude Code スキル／プラグインとして提供しています。同梱の agent-webbridge スキルは、エージェントに一連の手順を教えます（awb check --json でインストールし、その後 POST /command 経由で操作します）。拡張機能自体を開発する場合は、awb install-dev を実行してリポジトリ内のビルドを Load unpack します（chrome://extensions → Developer mode → Load unpacked → agent-webbridge-extension/）。拡張機能には独自のキーが含まれているため、開発用 ID は再読み込み後も変わりません。

コミュニティのレシピ（awb-recipes）

Web サイトはマークアップを頻繁に更新し、ボット対策の罠を常に仕掛けています。エージェントにセレクターを推測させたり、エッジケースで失敗させたりする代わりに、コミュニティが管理し、検証したプレイブックをawb-recipesで探せます。

• github-gist-create：アクティブなセッションを使い、ブラウザー UI からシークレットまたは公開 GitHub Gist を作成します。
• google-search-results：ログイン済みの自分のブラウザーから、オーガニック検索結果を抽出します。
• hn-reply-box：本物のユーザークッキーを使って、Hacker News のスレッドを操作します。
• linkedin-feed-posts：セッションを乗っ取らずに、実際のフィード投稿を抽出します。
• npm-most-depended：パッケージのダウンロード指標と依存関係の階層を抽出します。

エージェントにレシピを渡します：「Work プロファイルで awb-recipes の github-gist-create レシピを実行してください。」 貢献するには、good first recipeラベルが付いた未対応の Issue を担当し、PR を作成してください！

エコシステムと掲載情報

• 公式 MCP Registry：io.github.jeet-dhandha/agent-webbridge として登録済みです（レジストリには現在 1.3.1 と表示されています）
• Awesome MCP Servers：punkpeye/awesome-mcp-serversでプルリクエストを作成済みです（Glama への掲載待ち）
• Awesome Claude Skills：BehiSecc/awesome-claude-skills、karanb192/awesome-claude-skills、travisvn/awesome-claude-skillsでプルリクエストを作成済みです
• Skills CLI：npx skills add jeet-dhandha/agent-webbridge でインストールできます
• Chrome ウェブストア：拡張機能 Agent WebBridgeを公開しています
• ウェブサイトとインタラクティブデモ：jeet-dhandha.github.io/agent-webbridge

プラットフォーム

	macOS	Windows
プロファイルの検出	~/Library/Application Support/Google/Chrome	%LOCALAPPDATA%\Google\Chrome\User Data
Chrome のバイナリ	/Applications/Google Chrome.app	Program Files\Google\Chrome\Application\chrome.exe（自動検出）
デーモン、ルーター、MCP、すべてのツール	✅	✅
インストール手順（awb setup）	AppleScript 経由でプロファイルウィンドウを開きます	プロファイルを指定して Chrome を起動し、ウィンドウを開きます
タブ／ウィンドウの整理（フォーカス、空のウィンドウの整理）	✅	省略 — 表示上の調整のみ

Chrome またはそのデータディレクトリが標準以外の場所にある場合（Chrome Beta、ポータブル版のインストールなど）は、AWB_CHROME_BIN / AWB_CHROME_DIR を設定してください。Linux のパスは設定済みですが、テストされていません。

Windows では、PowerShell または cmd からコマンドを実行してください（以下の curl の例では bash の引用符を使用しています。PowerShell では curl.exe とヒアストリングを使うか、MCP サーバーを使用してください）。デーモンと Windows のコードパスは CI の windows-latest でテストされています。Chrome の起動手順（awb setup / awb up）はテストが最も少ない部分です。動作に問題がある場合は、issue を作成してください。

セキュリティ

• すべて 127.0.0.1 のみでリッスンします。1.3.1 以降、ルーターとデーモンは、Web の Origin またはループバック以外の Host を含むリクエストも拒否します。そのため、アクセスしたウェブサイトからブリッジを操作されることはありません（変更履歴を参照）。以前のバージョンからアップグレードした場合は、フリートを awb down && awb up で再起動してください。
• このツールは、サインイン済みのブラウザーで あなた自身として 操作します。127.0.0.1:10086 にアクセスできるローカルプログラムは同じ操作を実行できるため、信頼できるマシンとアカウントでのみ実行し、取り消せない操作（投稿、支払い、削除）はエージェント内で人間の確認を必須にしてください。
• 脆弱性は、GitHub の Security タブにある「Report a vulnerability」から非公開で報告してください。

ライセンス

MIT © jeet-dhandha