ClaudeCloudflare2026/04/15 13:00

Browser Run: give your agents a browser

要点だけを先に読めるように短く再構成したセクションです。

元記事

Quick Digest

要約

要点だけを先に読めるように短く再構成したセクションです。

claudejamodel: claude-haiku-4-5

Browser Run: AIエージェント向けブラウザ機能の大幅拡張

Key Points

  • CDP エンドポイント公開で既存スクリプト互換
  • Live View と Session Recordings で可視化強化
  • 同時実行数 4 倍、120 ブラウザに対応

Summary

Cloudflareは「Browser Rendering」を「Browser Run」に改称し、AIエージェント向けのブラウザ機能を大幅に拡張しました。エージェントがWebを効率的に操作するための包括的なツールセットを提供します。

Key Points

新機能

  • Live View: エージェントのブラウザセッションをリアルタイムで監視、DOM/コンソール/ネットワークを確認可能
  • Human in the Loop: エージェントが問題に直面した際、人間が介入して解決後に制御を返却
  • Chrome DevTools Protocol (CDP) エンドポイント: 低レベルプロトコルを直接公開、既存のCDPスクリプトが動作
  • MCP Client対応: Claude Desktop、Cursor、OpenCodeなどのAIコーディングエージェントが利用可能
  • WebMCP対応: Webサイトがエージェント向けのツールを宣言、信頼性の高いナビゲーションを実現
  • Session Recordings: すべてのブラウザセッションをDOMの変更、ユーザー操作、ページナビゲーションとして記録
  • スケーラビリティ向上: 同時実行ブラウザ数が30から120に増加(4倍)

既存機能

  • Puppeteer/Playwrightによる高レベル自動化
  • Quick Actionsで簡単なタスク(スクリーンショット、PDF生成、マークダウン抽出)に対応
  • /crawlエンドポイントでサイト全体のクローリング

技術的な利点

  • インフラ管理不要、オンデマンドでChrome起動
  • グローバルネットワークでの低レイテンシー実行
  • 既存のCDP自動化スクリプトは1行の設定変更で移行可能
  • WebBotAuthによる暗号署名付きエージェント識別
  • robots.txtとAI Crawl Controlを尊重する倫理的なクローラー

Full Translation

翻訳

原文の流れを保ったまま読める翻訳セクションです。

claudejamodel: claude-haiku-4-5

Browser Run: エージェントにブラウザを提供する

Browser Run: エージェントにブラウザを提供する

2026-04-15 Kathy Liao 8分読了

AIエージェントはウェブと相互作用する必要があります。そのためには、ブラウザが必要です。サイトをナビゲートし、ページを読み、フォームに入力し、データを抽出し、スクリーンショットを撮る必要があります。期待通りに動作しているかどうかを観察し、必要に応じて人間が介入できる方法が必要です。そして、これらすべてをスケールで実行する必要があります。

本日、Browser RenderingをBrowser Runに改名し、AIエージェント向けブラウザとなる主要機能をリリースしています。Browser Renderingという名前は、このプロダクトが実際に何をするのかを完全には表現していませんでした。Browser Runを使用すると、Cloudflareのグローバルネットワーク上でフルブラウザセッションを実行し、コードまたはAIで駆動し、セッションを記録・再生し、ページをクロールしてコンテンツを取得し、リアルタイムでデバッグし、エージェントがサポートが必要な場合に人間が介入できます。

新機能

Live View

エージェントが見ているもの、実行していることをリアルタイムで確認できます。物事が正常に機能しているかどうかを即座に知ることができ、機能していない場合は、その理由を正確に確認できます。

Human in the Loop

エージェントがログインページや予期しないエッジケースなどの問題に直面した場合、失敗する代わりに人間に引き継ぐことができます。人間が介入して解決し、その後、制御を返します。

Chrome DevTools Protocol (CDP) エンドポイント

Chrome DevTools Protocolはエージェントがブラウザを制御する方法です。Browser Runはこれを直接公開するため、エージェントはブラウザを最大限に制御でき、既存のCDPスクリプトはCloudflareで動作します。

MCP Client Support

Claude Desktop、Cursor、OpenCodeなどのAIコーディングエージェントは、Browser Runをリモートブラウザとして使用できるようになりました。

WebMCP Support

エージェントは人間よりもウェブを使用する数が多くなります。WebMCPにより、ウェブサイトはエージェントが発見して呼び出すことができるアクションを宣言でき、ナビゲーションがより信頼性の高いものになります。

Session Recordings

デバッグ目的ですべてのブラウザセッションをキャプチャします。問題が発生した場合、DOMの変更、ユーザーインタラクション、ページナビゲーションを含む完全な記録があります。

Higher limits

30から120の同時ブラウザに増加し、より多くのタスクを同時に実行できます。

エージェントが必要とするすべてのもの

エージェントがウェブをブラウズするときに必要なものと、各機能がどのように適合するかについて考えてみましょう。

エージェントが必要なものBrowser Run (旧 Browser Rendering)
1) オンデマンドブラウザCloudflareのグローバルネットワーク上のChromeブラウザ
2) ブラウザを制御する方法Puppeteer、Playwright、CDP (新)、MCP Client Support (新)、WebMCP (新)を使用してナビゲート、クリック、フォーム入力、スクリーンショット撮影などのアクションを実行
3) 可観測性Live View (新)、Session Recordings (新)、ダッシュボード再設計 (新)
4) 人間の介入Human in the Loop (新)
5) スケールQuick Actionsで10リクエスト/秒、120同時ブラウザ (4倍増加)

1) ブラウザを開く

まず、エージェントはブラウザが必要です。Browser Runを使用すると、エージェントはCloudflareのグローバルネットワーク上でヘッドレスChromeインスタンスをオンデマンドでスピンアップできます。管理するインフラストラクチャはなく、維持するChrome バージョンもありません。ブラウザセッションはユーザーの近くで開かれ、低レイテンシーを実現し、必要に応じてスケールアップおよびスケールダウンします。Browser RunをAgents SDKと組み合わせて、ウェブをブラウズし、すべてを記憶し、独立して行動する長時間実行エージェントを構築します。

2) アクションを実行

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

Chrome DevTools Protocol (CDP) エンドポイント

Chrome DevTools Protocol (CDP)はブラウザ自動化を強化する低レベルプロトコルです。CDPを直接公開することで、エージェントツールの成長するエコシステムと既存のCDP自動化スクリプトがBrowser Runを使用できます。Chrome DevToolsを開いてページを検査すると、CDPが内部で実行されています。Puppeteer、Playwright、およびほとんどのエージェントフレームワークはその上に構築されています。Browser Runを使用してきたすべての方法は、実際にはすでにCDPを通じていました。新しいのは、CDPを直接エンドポイントとして公開していることです。

これはエージェントにとって重要です。CDPはエージェントにブラウザを最大限に制御できるからです。エージェントフレームワークはすでにCDPをネイティブに話し、Browser Runに直接接続できるようになりました。CDPはまた、JavaScriptデバッグなど、PuppeteerやPlaywrightを通じて利用できないブラウザアクションのロックを解除します。生のCDPメッセージを使用しており、高レベルライブラリを経由していないため、メッセージをモデルに直接渡して、より効率的なトークンブラウザ制御を実現できます。

自己ホストChromeに対して実行されているCDP自動化スクリプトがすでにある場合、1行の設定変更でBrowser Runで動作します。WebSocket URLをBrowser Runにポイントし、独自のブラウザインフラストラクチャの管理を停止します。

// 前: 自己ホストChromeに接続
const browser = await puppeteer.connect({
  browserWSEndpoint: 'ws://localhost:9222/devtools/browser'
});

// 後: 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エンドポイントはBrowser Runをより利用しやすくします。Cloudflare Workerを記述する必要なく、任意の言語、任意の環境から接続できるようになりました。(既にWorkersを使用している場合、何も変わりません。)

MCPクライアントでBrowser Runを使用

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のBrowser Runを設定する方法の例を次に示します。

{
  "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エージェントとしてのナビゲーションは信頼性がありません。私たちは、人間よりも多くのエージェントがウェブを使用する未来に賭けています。その世界では、サイトはエージェント対応である必要があります。そのため、Google Chromeチームからの新しいブラウザAPIであり、Chromium 146+に搭載されたWebMCPのサポートをリリースしています。WebMCPにより、ウェブサイトはAIエージェントにツールを直接公開し、各ページでエージェントが発見して呼び出すことができるアクションを宣言できます。これにより、エージェントはウェブをより確実にナビゲートできます。

エージェントがサイトの使用方法を理解する必要がある代わりに、ウェブサイトはエージェントが発見して呼び出すためのツールを公開できます。

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

  • navigator.modelContext ウェブサイトがツールを登録できるようにします
  • navigator.modelContextTesting エージェントがそれらのツールを発見して実行できるようにします

今日、旅行予約サイトを訪問するエージェントは、それを見ることでUIを理解する必要があります。WebMCPを使用すると、サイトは「ここに origin、destination、dateを取得する search_flights ツールがあります」と宣言します。エージェントは遅いスクリーンショット分析クリックループを通じることなく、それを直接呼び出します。これにより、UIへの潜在的な変更に関係なく、ナビゲーションがより信頼性の高いものになります。

ツールはプリロードされるのではなく、ページで発見されます。これは、すべての可能なサイトのMCPサーバーをプリロードすることが実行不可能であり、コンテキストウィンドウを膨らませるウェブの長いテールにとって重要です。

WebMCPを使用してChrome DevToolsコンソール経由でホテルを予約し、listTools()で利用可能なツールを発見しています。

安定したChromeに到達する前に新しいブラウザ機能をテストできるように、Chrome betaを実行しているブラウザインスタンスを備えた実験的プールがあります。また、CLIからブラウザセッションを直接管理できるWranglerブラウザコマンドもリリースしました。これにより、ターミナルからブラウザセッションを作成、管理、表示できます。

WebMCP対応ブラウザにアクセスするには、次のWranglerコマンドを使用して実験的プールでセッションを作成します。

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

Browser Runを使用する既存の方法

CDPとWebMCPは新しいですが、Browser Run経由でPuppeteer、Playwright、またはStagehandを使用してフルブラウザ自動化を既に使用できました。スクリーンショットキャプチャ、PDF生成、マークダウン抽出などのシンプルなタスクの場合、Quick Actionエンドポイントがあります。

/crawl エンドポイント — ウェブコンテンツをクロール

最近、単一のAPI呼び出しでサイト全体をクロールできる/crawlエンドポイントもリリースしました。開始URLを指定すると、ページが自動的に発見およびスクレイプされ、優先形式 (HTML、Markdown、構造化JSON) で返されます。クロール深度とスコープを制御し、変更されていないページをスキップし、含める、または除外する特定のパスを指定するための追加パラメータがあります。

/crawlを意図的に適切に動作するクローラーとして構築しました。つまり、サイト所有者の設定をボックスから尊重し、Web Bot Authを使用して暗号的に署名された異なるボットIDを持つ署名されたエージェントであり、カスタマイズ不可能なUser-Agentであり、robots.txtとAI Crawl Controlに従います。Cloudflareのボット保護またはCAPTCHAをバイパスしません。サイト所有者は、コンテンツがアクセス可能かどうかを選択し、/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

Live Viewを使用すると、エージェントのブラウザセッションをリアルタイムで監視できます。エージェントをデバッグしているか、長い自動化スクリプトを実行しているかに関わらず、発生しているもの、発生しているときに正確に確認できます。これには、ページ自体、DOM、コンソール、ネットワークリクエストが含まれます。予期されたボタンがない、ページが認証を必要とする、またはCAPTCHAが表示されるなど、問題が発生した場合、すぐにそれをキャッチできます。

Live Viewにアクセスするには2つの方法があります。コードから、検査するブラウザのsession_idを取得し、レスポンスからdevtoolsFrontendURLをChromeで開きます。またはCloudflareダッシュボードから、Browser Runセクションの新しいLive Sessionsタブを開き、アクティブなセッションをクリックします。

ホテルを予約するAIエージェントのLive View。リアルタイムブラウザアクティビティを表示しています。

Session Recordings

Live Viewは利用可能な場合に優れていますが、すべてのセッションを監視することはできません。Session Recordingsは、DOMの変更、マウスおよびキーボードイベント、ページナビゲーションを構造化JSONとしてキャプチャするため、セッション終了後に任意のセッションを再生できます。ブラウザを起動するときにrecording:trueを渡してSession Recordingsを有効にします。セッションが閉じた後、Cloudflareダッシュボードの[Runs]タブから記録にアクセスするか、APIを通じて記録を取得し、rrweb-playerで再生できます。

次に、記録中の任意の時点でDOM状態とコンソール出力を検査する機能を追加しています。

Sentry Shopをブラウズし、ボンバージャケットをカートに追加するブラウザ自動化のセッション記録再生。

ダッシュボード再設計

以前、Browser Runダッシュボードはブラウザセッションからのログのみを表示していました。スクリーンショット、PDF、マークダウン、クロールのリクエストは表示されていませんでした。