Claude Codeでブラウザ操作を自動化する — agent-browser完全活用ガイド

Claude Code ブラウザ操作のイメージ画像

Claude Codeのagent-browserを使えば、ログイン済みChromeプロファイルを活用して認証済みサイトも自動ブラウザ操作が可能です。

  • 要点1: agent-browserはPlaywright MCP比で5.7倍のトークン効率(同一タスクで約1,400 tokens vs 7,800 tokens)
  • 要点2: ログイン済みChromeプロファイルを使えば、有料メンバーシップや管理画面も自動操作できる
  • 要点3: コンテンツ収集・SaaS操作・フォーム入力など、企業業務の幅広い場面で活用できる

対象: Claude Codeでブラウザ操作を自動化したいDX推進担当者・エンジニア

今日やること: ログイン済みChromeプロファイルを作成し、agent-browserの起動スクリプトを設定する

この記事の著者
川島陸

株式会社Nexa 代表取締役川島 陸

一橋大学経済学部卒業後、フォーティエンスコンサルティング株式会社(旧 株式会社クニエ)にて法人向けAI導入支援等を経験。独立後、AI系メディア運営やDify/n8nの導入支援を経て、株式会社Nexaを創業。法人向けAI研修・AI導入支援・AI関連メディア運営を手掛ける。

Claude Codeのagent-browserスキルを使えば、ログイン済みChromeプロファイルを活用して、認証が必要なWebサービスを含むあらゆるブラウザ操作を自動化できます。

「コンテンツを手動でコピーしている」「SaaSの管理画面を毎日手操作している」——こうした繰り返し作業は、agent-browserを使うことで大幅に削減できます。

この記事では、agent-browserのセットアップ手順から、実際の業務で活用できる具体的なユースケース(コンテンツ収集・SaaS操作・フォーム入力)、そして類似ツールとの使い分け判断まで、実践的な視点でお伝えします。

ブラウザ操作の自動化でできること

ブラウザ自動化とは、人間が手でおこなうクリック・入力・ページ遷移といった操作を、プログラムやAIエージェントが代わりに実行する技術です。

以前はSeleniumやPuppeteerといったツールが主流でしたが、Claude Codeの登場により「自然言語でブラウザ操作を指示する」ことが現実になりました。

従来のRPA・Seleniumとの違い

従来のブラウザ自動化ツールは、操作対象のサイトのHTMLセレクター(div.button-primaryのようなCSSクラス名)を事前に調査し、コードに書き込む必要がありました。サイトのデザインが変わるとスクリプトが壊れてしまうため、定期的なメンテナンスが欠かせませんでした。

Claude Codeのagent-browserは「ログインボタンをクリックして」「メールアドレスのフィールドに入力して」と自然言語で指示できるため、HTMLの構造に依存しません。サイトが多少変更されても、AIが画面を解釈して対応します。

業務での自動化効果も実証されており、繰り返しのブラウザ操作で作業時間を60%以上削減した事例も報告されています。

Claude Codeでブラウザ自動化が注目される理由

2026年現在、Claude Code向けのブラウザ自動化ツールは5種類以上が存在します(agent-browser, Playwright CLI, Browser-use, Playwright MCP, Claude in Chrome)。このなかでagent-browserが特に注目される理由は、軽量・高速でありながら、ログイン済みChromeプロファイルを使った認証済み操作が可能な点にあります。

企業の日常業務で自動化したいブラウザ操作の多くは、ログインが必要なSaaS管理画面やサブスクリプションサービスです。agent-browserはこのニーズに直接応えるツールとして位置づけられています。

agent-browserとは?仕組みとメリット

agent-browserは、Vercel Labsが開発したClaude Code向けのブラウザ自動化スキルです。Chromiumベースのブラウザをヘッドレス(画面表示なし)またはヘッドフル(通常表示)モードで操作できます。

「スキル」とは、Claude Codeに特定のタスクをおこなわせるための設定ファイル群のことです。SKILL.mdというマークダウンファイルでAIに指示を与え、必要なスクリプトを参照させることで、複雑な操作を繰り返し実行できるようになります。(Claude Code Skillsの作り方はこちら →

Playwright MCP比で5.7倍のトークン効率

AIエージェントがブラウザを操作する際には、画面の情報をAIに渡す必要があります。このとき「どれだけのデータをAIに送るか」がコストと速度に直結します。

Vercel Labsの調査によると、同一タスク6件での比較で、Playwright MCPが約7,800 tokens(~31,000文字)を消費するのに対し、agent-browserは約1,400 tokens(~5,500文字)に収まりました。これは5.7倍のトークン効率に相当します。

この差はコスト削減だけでなく、1回のコンテキストウィンドウでこなせるタスク数の増加にも直結します。

他のブラウザ自動化ツールとの使い分け

ツール トークン効率 向いているユースケース
agent-browser ◎(最軽量) シンプルな操作・コンテンツ読み取り・スクリーンショット
Playwright CLI ○(4〜100倍効率) テスト自動化・多段階フロー
Browser-use 自律的な推論が必要・並列実行・複数サイト横断
Playwright MCP △(26+ツール) 精密なDOM操作・開発テスト専用
Claude in Chrome スクリーンショット中心の操作

「ページを開いて内容を取得したい」「フォームに入力したい」といった業務目的の自動化であれば、agent-browserが最もシンプルで実用的な選択肢です。

\ Claude Codeの導入、何から始めればいいかわかります /

法人向けClaude Code個別指導の無料相談はこちら

セットアップ手順 — ログイン済みChromeの準備

agent-browserの最大の特徴は、ログイン済みのChromeプロファイルを使える点です。これにより、毎回ログイン処理をコード化しなくても、認証済みの状態でブラウザを操作できます。

ログイン済みChromeプロファイルを作成する

Chromeは、プロファイルごとにクッキー・セッション情報・拡張機能を保持します。agent-browser専用のプロファイルディレクトリを作成し、そこにサービスへのログイン情報を保存しておくことで、Claude Codeから認証済み状態でアクセスできます。

プロファイルディレクトリは ~/.chrome-agent-browser/ に作成するのが標準的な構成です。初回起動後、ブラウザを操作して対象サービスにログインし、ログイン状態を保存しておきます。

start-agent-chrome.shで起動する

agent-browserには、ログイン済みChromeを起動するためのシェルスクリプト(start-agent-chrome.sh)が付属しています。このスクリプトは、以下の処理を自動でおこないます。

  • 専用プロファイルディレクトリを指定してChromeを起動
  • デバッグポートを開放(Claude Codeが接続するために必要)
  • 起動確認と接続待ち
# スクリプトで起動(推奨)~/Desktop/Claude\ Code実行フォルダ/start-agent-chrome.sh

起動後、Claude Codeに「agent-browserスキルを使ってXXXXのページを開いて」と指示するだけで、ログイン済みの状態でブラウザ操作を開始できます。

Claude Codeから接続する

Claude Codeでagent-browserを使うには、SKILL.mdを読み込ませます。Claude Codeのシステムプロンプトまたは会話の中でスキルを参照させることで、ブラウザ操作に必要なツールセットが自動的に有効になります。

ポイントagent-browserのスキルはClaude Codeの会話内で「agent-browser skillを使って」と一言添えるだけで自動的にロードされます。事前にstart-agent-chrome.shでブラウザを起動しておくことが唯一の前提条件です。

実践ユースケース1 — コンテンツ収集・スクレイピング

最も多いユースケースの一つが、Webサイトからのコンテンツ収集です。特にログインが必要なサービス(有料メンバーシップ・会員制サイト・社内ポータル等)は、従来のスクレイピングツールでは対応が困難でした。

あるメディア運営担当者は、特定のメンバーシップサービスの直近20記事から特定情報を抽出する作業を、agent-browserで自動化しました。毎回手動でページを開いてコピーしていた作業が、Claude Codeへの一言指示で完結するようになりました。

agent-browser evalでDOMから直接取得する

通常、ブラウザ自動化ではUIのスナップショット(スクリーンショット)を取得し、それをAIに解釈させる方法が使われます。しかしagent-browserでは、evalコマンドを使ってJavaScriptを直接実行し、DOMから必要な情報を効率的に取得できます。

// 本文テキストを直接取得する例document.querySelector('.article-body').innerText

この方法により、UIのビジュアル解析を経由せずにコンテンツを取得できるため、処理速度が向上し、トークン消費も最小化されます。

ログイン済みプロファイルなら有料コンテンツも取得可能

ログイン済みChromeプロファイルを使うと、ペイウォール(有料会員限定のコンテンツ制限)の内側も取得できます。前述の事例では、20記事のうちほぼすべてに「ここから先は有料部分です」というマーカーがあり、その後に続く有料コンテンツも正常に取得できていることが確認されました。

記事タイプ ペイウォール 有料コンテンツ取得
有料メンバーシップ記事 あり ✅ ログイン済みなら取得可能
無料公開記事 なし ✅ 通常通り取得可能
ログイン必須記事 あり ✅ プロファイルに認証情報があれば取得可能

Claude Codeの導入や活用方法について、個別にご相談いただけます。「どの機能から使えばいいか」「自社業務への適用方法を知りたい」といった段階から対応しています。

Claude Code個別指導の無料相談はこちら →


\ 業務自動化のお悩み、プロが30分で整理します /

法人向けClaude Code個別指導の無料相談はこちら

実践ユースケース2 — SaaS・Webサービスの自動操作

コンテンツ収集以上に企業の業務効率化に直結するのが、SaaSや業務Webサービスの操作自動化です。多くの企業ツールはAPIを提供していますが、すべての操作に対応しているわけではなく、Webインターフェースのみで実行できる処理も多く残っています。

アフィリエイト案件の申請を自動化する

あるメディア運営担当者は、アフィリエイトネットワーク(A8netなどのASP)への案件申請作業をagent-browserで自動化しました。記事数が増えるにつれて、関連するアフィリエイト案件への申請作業が膨大になっていたためです。

agent-browserにログイン済みChromeプロファイルを接続することで、ASPの管理画面にアクセスし、カテゴリに合った案件を一括で申請する作業をClaude Codeに委任できました。申請後の審査通過案件の確認や、記事への広告リンク挿入も連続して実行することができます。

Bing Webmaster Toolsで検索パフォーマンスを取得する

あるサイト運営担当者がBing Webmaster Toolsの活用を検討した際、「APIはあるのか」という問いに対してClaude Codeがagent-browserを使った自動操作を提案しました。Bing Webmaster Tools APIに登録し、CLIから検索パフォーマンスデータやキーワードボリュームを取得するスキルとして整備することで、毎月の手動レポート収集作業を廃止できました。

Google WorkspaceなどのSaaSにも応用できる

SaaS操作の自動化は、あらゆる業務ツールに応用可能です。特に以下のようなシナリオでagent-browserが有効です。

  • 定型フォームへの一括入力: 請求書入力・申請フォーム・CRM更新など
  • ダッシュボードのデータ収集: APIが提供されていない業務システムの画面からデータを取得
  • 承認フロー操作: 管理者権限が必要な一括承認作業
  • 設定の一括変更: 複数サービスのアカウント設定を横断して更新

ただし、利用規約でスクレイピングや自動操作が禁止されているサービスへの適用は避け、各サービスの規約を事前に確認することが重要です。

実践ユースケース3 — フォーム入力・UI操作の自動化

繰り返しフォームに入力する作業は、agent-browserが特に得意とするユースケースです。

基本的な操作コマンド

agent-browserで使える主要なコマンドは以下の通りです。

コマンド 用途
navigate [URL] 指定URLにアクセスする
click [要素の説明] ボタン・リンクをクリックする
type [フィールド名] [入力値] テキストフィールドに入力する
screenshot 現在の画面をスクリーンショットで取得する
eval [JavaScript] JavaScriptを直接実行する
wait [条件] ページの読み込み・要素の表示を待つ

これらのコマンドを自然言語で指示することで、Claude Codeが適切なブラウザ操作に変換して実行します。

複雑なUIフローへの対応

ページ遷移が複数回発生する処理や、前のステップの結果に応じて分岐する処理も、Claude Codeに全体の手順を説明するだけで自動的に処理されます。

たとえば「Aという管理画面にログインして、Bという一覧ページを開き、条件を満たす項目をすべてチェックして保存ボタンを押す」という指示を自然言語で与えれば、Claude Codeがステップを分解して順に実行します。

エラー時のリトライ処理

ネットワークの遅延や動的ロードによる要素の遅延表示など、ブラウザ操作では想定外のエラーが発生することがあります。agent-browserはスクリーンショットで現在の画面状態をAIに確認させながら進むため、エラー時も状況を判断して対処できます。

「ボタンが見つからなければページを再読み込みして再試行する」「エラーメッセージが表示されたらその内容を報告する」といった指示を加えることで、より安定した自動操作が実現できます。

\ AI活用の「次の一手」を一緒に考えませんか /

法人向けClaude Code個別指導の無料相談はこちら

ツール選択ガイド — どの自動化ツールを使うべきか

用途に応じた適切なツール選択が、自動化の成否を左右します。

シンプルな操作なら agent-browser が最速

「ページを開いてテキストを取得する」「フォームに入力して送信する」「スクリーンショットを撮る」といった目的なら、agent-browserが最もシンプルかつ効率的です。セットアップも最小限で、Claude Codeとの統合がスムーズです。

複雑な多段階フローなら Playwright CLI

テスト自動化や、厳密なシーケンスが必要な業務フロー(例:ECサイトの購入→確認→完了まで)であれば、Playwright CLIが向いています。Playwright CLIはコマンドライン操作に特化しており、処理結果をファイルとして保存するため、AIのコンテキスト消費を抑えながら複雑なフローを実行できます。

自律的な推論が必要なら Browser-use

「複数のサイトを比較して最安値を見つける」「Webページを読んで判断し、次のアクションを決める」といった、AIによる高度な意思決定が必要なタスクにはBrowser-useが最適です。GitHub 50,000+スターを獲得しており(2026年3月時点)、マルチタブ操作やクラウド並列実行にも対応しています。

選択の基本指針:

  • 毎日繰り返す定型的な業務操作 → agent-browser
  • 品質保証・テスト自動化 → Playwright CLI
  • 複雑な情報収集・調査タスク → Browser-use

よくある質問

Q. 認証が必要なサイトでも動作しますか?

はい、動作します。agent-browserの最大の特徴がこの点で、ログイン済みChromeプロファイルを使うことで、ID/パスワード認証・セッション管理が必要なサービスでも自動操作できます。事前にプロファイルに対象サービスへのログイン情報を保存しておくだけで、毎回のログイン処理を省略できます。

Q. Chrome拡張機能を使っているサイトでも操作できますか?

ログイン済みChromeプロファイルに拡張機能がインストールされていれば、その拡張機能が動作した状態でページを操作できます。ただし、拡張機能の動作がブラウザの自動化を妨げる場合(アンチボット機能など)は別途検討が必要です。

Q. 操作中にCAPTCHAが出た場合はどうすれば良いですか?

CAPTCHAはブラウザ自動化全般の課題です。agent-browserを含むすべての自動化ツールで、CAPTCHAへの自動対応は困難です。CAPTCHAが表示された場合、agent-browserは現状をスクリーンショットで記録しユーザーに報告します。対象サービスがAPIを提供している場合は、そちらを優先的に利用することをおすすめします。

まとめ

この記事では、Claude Codeのagent-browserを使ったブラウザ操作自動化について解説しました。

  • agent-browserは認証済みサイトを操作できる: ログイン済みChromeプロファイルを使えば、有料メンバーシップや業務SaaSの管理画面も自動操作できる
  • トークン効率が高い: Playwright MCP比5.7倍の効率で、コンテキスト消費を最小化しながら多くのタスクを処理できる
  • 用途が広い: コンテンツ収集・SaaS操作・フォーム入力・スクレイピングなど、企業業務の幅広いシナリオに対応できる
  • ツール選択が重要: 定型業務はagent-browser、テスト自動化はPlaywright CLI、複雑な推論タスクはBrowser-useと使い分けると効果的

まずはstart-agent-chrome.shでログイン済みChromeを起動し、シンプルなコンテンツ取得タスクで動作を確認することからはじめてみてください。成功体験を積んだ上で、より複雑な業務フローへと展開していくのが最もスムーズな導入方法です。

スキルを連携させてワークフローを組む方法はこちら →


Claude Codeの導入・活用をサポートします

株式会社Nexaでは、Claude Codeを活用した業務自動化の個別指導・企業研修を提供しています。非エンジニアの方でも3ヶ月で業務自動化を実現できるプログラムです。「何から始めればいいかわからない」という段階からご支援いたします。

Claude Code個別指導の詳細・無料相談はこちら →




関連記事

AIの力で、ビジネスを次のステージへ

まずはお気軽にご相談ください。貴社に最適なAI活用プランをご提案します。

Claude Codeのプロに無料相談 30秒で日程調整完了