Browser Run：お客様のエージェントにブラウザを提供する

このコンテンツは自動機械翻訳サービスによる翻訳版であり、皆さまの便宜のために提供しています。原本の英語版と異なる誤り、省略、解釈の微妙な違いが含まれる場合があります。ご不明な点がある場合は、英語版原本をご確認ください。

AIエージェントはWebと対話する必要があります。そのためには、ブラウザが必要です。サイトの移動、ページの読み込み、フォームへの入力、データの抽出、スクリーンショット作成などの操作が必要です。想定通り機能しているかどうかを観察し、必要に応じて人間が介入できるようにする必要があるのです。そして、これらすべてを大規模に行う必要があるのです。

本日、Browser RenderingをBrowser Runに名称変更し、AI エージェントにとって最適なブラウザとなる主要機能をリリースします。ブラウザレンダリングという名前は、この製品の機能を完全に捉えたものではありません。Browser Runは、Cloudflareのグローバルネットワーク上で完全なブラウザセッションの実行、コードまたはAIを使ったブラウザセッションの実行、セッションの記録と再生、コンテンツを探すためにページをクロール、リアルタイムでデバッグ、そしてエージェントが必要な時に人間が介入できるようにします。

以下は新着情報になります：

ライブビュー：エージェントが見たものや、行っていることをリアルタイムで見ることができます。うまく機能しているかどうか、またうまく機能していない時はその理由を瞬時に知ることができます。
ヒューマン・イン・ザ・ループ：エージェントがログインページや予期せぬエッジケースなどに遭遇した場合、失敗せずに人間に引き渡すことができます。人間が介入し、解決して、制御を取り戻します。
Chrome DevTools Protocol（CDP）エンドポイント：Chrome DevToolsプロトコルは、エージェントがブラウザを制御する方法です。ブラウザ実行は、それを直接公開するため、エージェントはブラウザを最大限に制御でき、既存のCDPスクリプトはCloudflare上で動作します。
MCPクライアントサポート：Claude Desktop、Cursor、OpenCodeといったAIコーディングエージェントは、リモートブラウザとしてBrowser Runを使用できるようになりました。
WebMCPサポート：エージェントはWebを使用する人間よりも多くなります。WebMCPを使用することで、エージェントが発見および呼び出すことができるアクションをWebサイトで宣言できるため、ナビゲーションの信頼性が向上します。
セッションレコーディング：デバッグ目的で、すべてのブラウザセッションをキャプチャします。何か問題が発生した場合、ドキュメントオブジェクトモデル変更、ユーザーインタラクション、ページナビゲーションなど、すべてが記録されます。
制限引き上げ：同時実行ブラウザ数は30から120台まで、一度に実行できるタスクが増えます。

^{東京都中央区京橋2-2-1 京橋エドグラン26階}

エージェントに必要なすべての機能

Webを閲覧する際にエージェントが必要とするもの、そして各機能の位置づけについて考えてみましょう。

エージェントに必要なもの	Browser Run（旧ブラウザレンダリング）
1) オンデマンドブラウザ	Cloudflareのグローバルネットワーク上のChromeブラウザ
2)ブラウザを制御する方法	Puppeteer、Playwright、CDP (new)、MCP Client Support (new)、WebMCP (new) を使用して、ナビゲート、クリック、フォーム入力、スクリーンショットなどのアクションを実行します。
3) Observability	ライブビュー（新規）、セッション録画（新規）、およびダッシュボード再デザイン（新規）
4) 人為的な介入	Human in the Loop（新規）
5) スケール	クイックアクション10リクエスト/秒、同時ブラウザ120台（4倍に増加）

1) ブラウザを開きます。

まず、エージェントにはブラウザが必要です。Browser Runを使用すると、エージェントはCloudflareのグローバルネットワーク上にヘッドレスなChromeインスタンスをオンデマンドで起動することができます。管理が必要なインフラストラクチャも、Chromeのバージョン保守も必要ありません。ブラウザセッションはユーザーの近くで開いて低遅延を実現し、必要に応じてスケールアップ、スケールダウンも可能です。Browser RunとAgents SDKを組み合わせることで、Webを閲覧し、すべてを記憶し、自ら行動する長期的なエージェントを構築します。

2) 行動を起こす

エージェントがブラウザを得たら、それを制御する方法が必要になります。Browser Runは、複数のアプローチをサポートしています。Chrome DevTools Protocol（CDP）とWebMCPを使用した新しい低レベルのプロトコルアクセス、既存の高レベルの自動化（PuppeteerとPlaywrightを使用）、および単純なタスク向けのQuick Actionsなどです。詳細を見てみましょう。

Chrome DevTools Protocol（CDP）エンドポイント

Chrome DevTools Protocol（CDP）は、ブラウザの自動化を実現するための低レベルのプロトコルです。CDPを直接公開するということは、エージェントツールと既存のCDP自動化スクリプトのエコシステムがブラウザ実行を使用できることを意味します。Chrome DevToolsを開いてページを調べると、その下ではCDPが実行されています。Puppeteer、Playwright、そしてほとんどのエージェントフレームワークはその上に構築されています。

あなたがこれまでブラウザ実行を使用してきた方法はすべて、実際にはすでにCDPを経由しています。新しくなった点は、CDPをエンドポイントとして直接公開することになりました。これはエージェントにとって重要です。CDPはエージェントに対してブラウザに対して可能な限りの制御を提供するためです。エージェントフレームワークはすでにCDPネイティブで動作しており、Browser Runに直接接続することも可能です。CDPは、JavaScriptデバッグなど、PuppeteerやPlaywrightでは利用できないブラウザアクションも可能にします。また、高レベルのライブラリを経由するのではなく、生のCDPメッセージを使用しているため、よりトークン効率の良いブラウザ制御のために、メッセージを直接モデルに渡すことができます。

セルフホスト型のChromeに対してすでにCDP自動化スクリプトを実行している場合は、1行の設定変更でBrowser Runに実行できます。WebSocketのURLをBrowser Runに向けて、ブラウザインフラストラクチャの管理を止めましょう。

// Before: connecting to self-hosted Chrome
const browser = await puppeteer.connect({
  browserWSEndpoint: 'ws://localhost:9222/devtools/browser'
});

// After: connecting to Browser Run
const browser = await puppeteer.connect({
  browserWSEndpoint: 'wss://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>/browser-rendering/devtools/browser',
  headers: { 'Authorization': 'Bearer <API_TOKEN>' }
});

CDPエンドポイントは、ブラウザ実行もアクセスしやすくします。Cloudflare Workerを書く必要なく、あらゆる言語、あらゆる環境から接続できるようになりました。（すでにWorkersを使用している場合、何も変更されません。）

MCPクライアントでブラウザ実行を使用する

Browser RunがChrome DevTools Protocol（CDP）を公開したことで、Claude Desktop、Cursor、Codex、OpenCodeを含むMCPクライアントは、Browser Runをリモートブラウザとして使用できるようになりました。Chrome DevToolsチームのchrome-devtools-mcpパッケージは、AIコーディングアシスタントがChrome DevToolsのフルパワーにアクセスできるようにするMCPサーバーで、信頼性の高い自動化、詳細なデバッグ、パフォーマンス分析が可能です。

以下は、Claude Desktopのブラウザ実行の設定方法の例です：

{
  "mcpServers": {
    "browser-rendering": {
      "command": "npx",
      "args": [
        "-y",
        "chrome-devtools-mcp@latest",
        "--wsEndpoint=wss://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>/browser-rendering/devtools/browser?keep_alive=600000",
        "--wsHeaders={\"Authorization\":\"Bearer <API_TOKEN>\"}"
      ]
    }
  }
}

その他のMCPクライアントについては、MCPクライアントでBrowser Runを使用するためのドキュメントを参照してください。

WebMCP対応

インターネットは人間のために構築されたため、今日AIエージェントとしてナビゲートすることは信頼できません。私たちは、人間よりも多くのエージェントがWebを利用する未来に賭けています。そのため、サイトはエージェントにとって使いやすいものである必要があります。

そのため、当社は、Chromium 146+に到達したGoogle Chromeチームの新しいブラウザAPIであるWebMCPのサポートを開始します。WebMCPを使用すると、WebサイトはAIエージェントに直接ツールを公開でき、エージェントが各ページでどのようなアクションを見つけ、呼び出すことができるかを宣言することができます。これにより、エージェントはより確実にWebをナビゲートすることができます。エージェントがサイトの使い方を考える代わりに、Webサイトは、エージェントがサイトの使い方を見つけるためにツールを公開し、

2つのAPIがこれを機能させます。

navigator.modelContextWebサイトがツールを登録可能にする
navigator.modelContextTestingエージェントがそれらのツールを検出し実行できるようにし、

現在、旅行予約サイトを訪問する代理店は、UIを見れば、UIを理解する必要があります。WebMCPを使用して、サイトは「ここにオリジン、目的、日付を取得するsearch_flightsツールがあります」と宣言します。エージェントは、遅いスクリーンショット分析クリックループを経由することなく、直接呼び出します。これにより、UIの変更に関係なく、ナビゲーションの信頼性が向上します。

ツールは事前読み込みではなく、ページ上で発見されます。これは、可能性のあるすべてのサイトにMCPサーバーをプリロードすることは現実的ではなく、コンテキストウィンドウを肥大化するWebのロングテールにとって重要です。

^{WebMCPを使って、Chrome DevToolsコンソールでホテルの予約をする。listTools()で利用可能なツールを検出}

Chromeベータ版を実行するブラウザインスタンスを含む実験的なプールがあり、ブラウザの新機能が安定版に移行する前にテストできます。また、CLIから直接ブラウザセッションを管理できるWranglerブラウザコマンドもリリースしました。これにより、お客様の端末から直接ブラウザセッションを作成、管理、表示することができます。WebMCP対応ブラウザにアクセスするには、以下のWranglerコマンドを使用して、実験用プールにセッションを作成します。

npm i -g wrangler@latest
wrangler browser create --lab --keepAlive 300

Browser Runを使う既存の方法

CDPとWebMCPは新しいものですが、Puppeteer、Playwright、またはStagehandを使用して、Browser Runを介した完全なブラウザ自動化を行うことができます。また、スクリーンショットの取得、PDFの生成、Markdownの抽出のような単純なタスクには、クイックアクションエンドポイントがあります。

/crawl エンドポイント — クロール Web コンテンツ

また、最近、1 回のAPI 呼び出しでサイト全体をクロールできる /crawl エンドポイントをリリースしました。開始URLを設定すると、ページが自動的に検出およびスクレイピングされ、希望のフォーマット（HTML、Markdown、構造化JSON）で返されます。追加のパラメータにより、クロールの深さと範囲を制御し、変更されていないページをスキップし、特定の含める、または除外するパスがあります。

当社は、意図的に/crawlをきちんと動作するクローラーであるように構築しました。つまり、サイト所有者の好みを尊重して、署名付きエージェントであり、Web Bot Authを使用して暗号署名された個別のボットIDを持ち、カスタマイズ不可能なUser-Agentであり、robots.txtとAI Crawl Controlに準拠します。Cloudflareのボット対策やCAPTCHAをバイパスすることはありません。サイト所有者は、自分のコンテンツがアクセス可能かどうかを選択し、/crawlはそれを尊重します。

# Initiate a crawl
curl -X POST 'https://api.cloudflare.com/client/v4/accounts/{account_id}/browser-rendering/crawl' \
  -H 'Authorization: Bearer <apiToken>' \
  -H 'Content-Type: application/json' \
  -d '{
    "url": "https://blog.cloudflare.com/"
  }'

3) 観測

最初の試みが上手くいくとは限りません。私たちは、自動化が失敗したとき、なぜ失敗したのかわからないというお客様から何度も耳にしました。そのため、当社は何が起こっているかを観察する複数の方法を追加しました。これにより、エージェントが見ているものをライブでも事後でも正確に把握することができます。

ライブビュー

Live Viewを使用すると、エージェントのブラウザセッションをリアルタイムで監視できます。エージェントをデバッグする場合でも、長い自動化スクリプトを実行する場合でも、何が起こっているかを正確に把握できます。これには、ページ自体とドキュメントオブジェクトモデル、コンソール、ネットワークリクエストが含まれます。何か問題が発生した場合、本来のボタンが存在しない、ページで認証が必要である、CAPTCHAが表示されるなど、即座に対応することができます。

ライブビューへのアクセス方法は2つあります。コードから、検査したいブラウザのsession_idを取得し、ChromeのレスポンスからdevtoolsFrontendURLを開きます。または、Cloudflareダッシュボードで、「ブラウザ実行」セクションの新しい「ライブセッション」タブを開き、アクティブなセッションをクリックします。

^{ホテルを予約するAIエージェントのライブビュー（リアルタイムのブラウザアクティビティ）}

セッション録画

ライブビューは使える場合は素晴らしいですが、すべてのセッションを見ることはできません。セッションレコーディングは、ドキュメントオブジェクトモデルの変更、マウスとキーボードのイベント、ページナビゲーションを構造化されたJSONとしてキャプチャするため、セッション終了後にいつでも再生できます。

ブラウザ起動時にrecording:trueを渡して、セッション記録を有効化します。セッションが終了した後、[実行]タブからCloudflareダッシュボードの録画にアクセスするか、API経由で録画を取得し、rrweb-playerで再生することができます。次に、記録中に任意の時点でドキュメントオブジェクトモデル状態とコンソール出力を検査できる機能を追加します。

^{Sentryショップを閲覧し、ボマージャケットをカートに追加するブラウザオートメーションのセッション記録のリプレイ}

ダッシュボードリデザイン

以前は、Browser Runダッシュボードにはブラウザセッションのログしか表示されませんでした。スクリーンショット、PDF、Markdown、クロールのリクエストは表示されませんでした。刷新されたダッシュボードは、それを変えます。新しい「実行」タブには、すべてのリクエストが表示されます。エンドポイントでフィルタリングし、対象URL、ステータス、期間などの詳細を表示できます。

ブラウザ実行ダッシュボード「実行」タブでは、ブラウザセッションとクイックアクションを1つのリストに表示し、拡張されたクロールジョブを実行ステータスと進捗状況を表示します

^{ブラウザ実行ダッシュボードの「実行」タブでは、ブラウザセッションとPDF、スクリーンショット、クロールなどのクイックアクションを単一画面で表示し、クロールジョブを展開して進捗状況を表示}

4) 介入

エージェントは良いものですが、完璧ではありません。時には人間の介入が必要な場合もあります。Browser Runは、人間がライブブラウザセッションを制御し、自動化ができないことを処理し、セッションを継続することができるLoopワークフローをサポートしています。

ヒューマン・イン・ザ・ループ

自動化が壁に突き当たった場合、再起動する必要はありません。Human in the Loop を使用すると、ページに直接アクセスしてクリック、入力、ナビゲート、資格情報の入力、フォーム送信などの操作が可能です。これにより、エージェントが処理できないワークフローが解放されます。

現在、アクティブなセッションのLive View URLを開くとご利用いただけます。次に、エージェントがヘルプが必要であることを知らせ、人間に通知して、問題が解決されたらエージェントに制御を戻すことができるハンドオフフローを追加します。

^{AIエージェントがAmazonでオレンジ色のラバランプを探し、選択肢を比較し、サインインが必要な購入手続きを人間に引き渡す}

5) スケール

お客様からは、より多くの、より高速な作業ができるように、上限を引き上げるという声が寄せられています。

上限の引き上げ

デフォルトの同時ブラウザの制限は、30から120へ4倍に引き上げられました。すべてのセッションで、グローバルなインスタンスのプールからブラウザに瞬時にアクセスできるため、ブラウザのスピンアップを待つコールドスタートが発生することはありません。また、3月には、クイックアクションの制限を1秒あたり10件に引き上げました。より高い制限が必要な場合は、リクエストに応じて購入できます。

今後の展開は？

ヒューマンインザループハンドオフ: 現在、ライブビューを通じてブラウザセッションに介入することができます。まもなく、エージェントは助けを必要とするとき、それを知らせることができるようになります。通知を組み込んで人間に介入してもらうことも可能です。
セッション録画の検査: タイムラインをスクラブして、任意のセッションを再生できます。近日中に、ドキュメントオブジェクトモデルの状態とコンソール出力の検査もできるようになります。
TracesとBrowser Logs：コードをインスツルメントすることなく、デバッグ情報にアクセスします。コンソールログ、ネットワークリクエスト、タイミングデータ何かが壊れれば、どこで接続しているかがわかります。
Workersから直接スクリーンショット、PDF、マークダウン: REST APIで利用可能なのと同じシンプルなタスクが、Workers Bindingsでも利用できるようになります。env.BROWSER.screenshot()APIトークンは不要で、APIsは動作します。

利用開始

ブラウザ実行は、現在、Workers FreeおよびWorkers Paidプランの両方でご利用いただけます。本日当社が出荷したすべてのもの（ライブビュー、ヒューマンインザループ、セッション録画、より高い同時実行制限）は、すぐにご利用いただけます。

すでにBrowser Renderingを使用している場合、新しい名前と追加の機能だけがあれば、すべて同じように機能します。

ドキュメントをご覧になり、使い始めてください。

Cloudflare ブログ