Claude CodeでChromeのフォームに自動入力する手順
Claude CodeにChromeを繋ぎ、CSVの顧客データやテストデータをWebフォームへ自動入力させる手順です。前提条件からファイルアップロード、つまずきどころまでまとめます。
Claude CodeでChromeのフォーム自動入力とは
Claude CodeはChromeブラウザと連携し、Webフォームへの入力作業をターミナルからの指示だけで代行できます。CSVに並んだ顧客データを1件ずつCRMへ登録する、テスト用のダミーデータをフォームに流し込んで検証する、といった反復入力作業を任せられます。
この連携はClaude Codeの標準機能ではなく、Claude in Chromeというブラウザ拡張機能を介して動きます。同じ拡張機能はサイドパネル単体でも使えますが、その場合の対応ブラウザはGoogle Chromeのみです。Claude Code経由の連携はGoogle ChromeとMicrosoft Edgeが対象で、Brave・Arc・Vivaldi・Operaといった他のChromium系ブラウザでも拡張機能を検出して接続を試みます。サイドパネル単体での使い方はClaude Chrome拡張機能でできることで扱っています。
Claudeは新しいタブを開いてフォーム操作を行い、ブラウザのログイン状態をそのまま引き継ぎます。すでにログイン済みのCRMやSaaS管理画面であれば、追加の認証情報を渡さずに操作できます。ログインページやCAPTCHAに遭遇すると、Claudeは処理を止めて手動対応を求めます。
使い始める前に必要なもの
フォーム自動入力を試すには、次の条件を満たしている必要があります。
- Google Chrome、Microsoft Edge、またはBrave・Arc・Vivaldi・OperaなどChromiumベースのブラウザ
- Claude in Chrome拡張機能のバージョン1.0.36以上(Chromeウェブストアから入手)
- 最新のClaude Code
- Pro・Max・Team・Enterpriseのいずれかの直接契約プラン
Chrome連携には/loginでの認証も必須です。APIキーやclaude setup-tokenで発行した長期トークンでは、--chromeフラグを付けてもChrome連携が有効になりません。ブラウザ拡張機能がその種の認証情報に対応していないためです。v2.1.216より前のClaude Codeでは、この組み合わせでもChrome連携が有効化されたように見えつつ、拡張機能への接続だけが403エラーで失敗する挙動でした。Amazon Bedrock・Google CloudのAgent Platform・Microsoft FoundryといったサードパーティプロバイダーからClaude Codeを使っている場合、Chrome連携は使えません。この機能を使うには別途claude.aiアカウントが要ります。
ログイン方式の全体像はClaude Codeログイン方法3種の使い分けにまとめています。
実際にフォームへ自動入力させる手順
claude --chrome初回起動時は、連携内容とサイト権限の仕組みを説明する一回限りのダイアログが出ます。Enterキーで進みます。毎回--chromeを付けたくない場合は、/chromeを実行して「Enabled by default」を選ぶと以後は自動で有効になります。ただしブラウザツールが常時読み込まれる分コンテキスト消費が増えるため、必要なときだけ--chromeを使う運用のほうが向くケースもあります。
拡張機能が未検出のときは、セッション中に1回だけ「Claude wants to use your browser」というインストールプロンプトが出ます。選べる選択肢は3つです。
- Install extension: Chromeウェブストアのインストールページを開きます
- Not now: 今回のセッションだけ確認を先送りします
- Don't ask again: 以後このプロンプトを出さなくします
組織がdeniedMcpServersでclaude-in-chromeを塞いでいる場合、そもそもこのプロンプト自体が出ません。管理者による制限だと分かるよう、あわせて覚えておくと切り分けが早くなります。
拡張機能をインストール済みなら、あとはやりたい作業をそのまま指示するだけです。
contacts.csvに顧客の連絡先一覧があります。各行についてcrm.example.comのCRMを開き、
「Add Contact」をクリックして、氏名・メールアドレス・電話番号を入力してくださいClaudeはローカルのcontacts.csvを読み込み、CRMの画面を1件ずつ操作してデータを入力していきます。ブラウザ操作の前に許可を求められたら承認します。確認ダイアログは「Claude in Chrome wants to」から始まり、そのセッション中は同じサイトでの操作をまとめて許可する選択肢も出ます。
接続状況を確かめたいときや、権限を管理したいときは/chromeをいつでも実行できます。ステータスパネルに「Status: Enabled」「Extension: Installed」と出ていれば連携は機能しています。複数のブラウザが接続されている場合、ブラウザ操作が始まる前にどれを使うか選ぶよう促されます。
Claudeが開いたタブはタブグループにまとめられ、寿命はセッションの操作に連動します。/clearを実行すると、そのセッションで開いたタブグループは開いていたページごと閉じます。ただし/clearをまたいで動き続けている作業がある場合は閉じません。/resumeなどでセッションを切り替えた場合は、空の新規タブしか残っていないときに限ってタブグループが閉じられ、操作途中のページが残っていれば閉じられません。
ファイルアップロードも一緒にこなす方法
フォーム入力と組み合わせてよく使うのがファイルアップロードです。Claude Codeはローカルのファイルを読み込み、その中身をブラウザへ送ってアップロードフィールドに添付します。ローカルセッションだけでなく、リモートセッションでも同じ手順で動作します。
bugs.example.comのバグトラッカーを開いて新しいissueを作成し、
logs/session.logを添付してくださいこの機能はClaude Code v2.1.211以降が対象です。アップロードには次の3つの制約があります。
- 読み取り権限: 読み取り権限が無いファイルはアップロードできません。ファイルへのRead権限を塞ぐ権限ルールが設定されている場合も、そのファイルはアップロードできません
- 合計サイズ10MB: 1回のアップロードで送れる合計サイズは10MBまでです
- ハードリンクの拒否:
node_modulesのようなパッケージマネージャーのストア内でよくある、複数のハードリンクを持つファイルは拒否されます。この場合はファイルをコピーしてから、コピーのほうをアップロード対象にします
つまずきやすいポイント
確認ダイアログの見落としが最初のつまずきどころです。Claudeがサイトへの操作許可を求めているのに気づかず放置すると、タスクが止まったまま進みません。
拡張機能が検出されないときは、chrome://extensionsで拡張機能が有効になっているか、claude --versionでClaude Codeが最新か、Chromeが起動しているかを順に確認します。それでも直らなければ/chromeから「Reconnect extension」を選びます。初回のChrome連携有効化時にはネイティブメッセージングのホスト設定ファイルが作られますが、Chromeはこれを起動時にしか読み込まないため、初回接続に失敗したらChromeを再起動する必要があります。
Windowsでは名前付きパイプの競合(EADDRINUSE)が起きることがあります。これは別のプロセスが同じ名前付きパイプを使っている場合に発生します。多くは他のClaude Codeセッションが原因なので、それらを閉じてから再起動すると解消します。v2.1.211より前のWindowsでは、拡張機能接続用のセットアップページ自体が開かないバグもありました。
「No tab available」というエラーは、タブが準備できる前にClaudeが操作を試みたときに出ます。新しいタブを作らせてから再試行するよう伝えれば解消します。フォームの入力値がおかしい・要素が見つからないといった原因を切り分けるときは、ブラウザのコンソールログを確認する手順が役立ちます。詳しくはClaude CodeでChromeのコンソールログをデバッグする方法にまとめています。前提条件やつまずきどころは本記事と一部重なりますが、そちらはデバッグ用途に絞って書いています。
利用形態別に何が変わるか
| 利用形態 | フォーム自動入力 | 注意点 |
|---|---|---|
CLI(--chromeフラグ) | フォーム自動入力○ 標準対応 | 注意点セッションごとにフラグが必要(常時有効化も可能) |
| VS Code拡張機能 | フォーム自動入力○ 標準対応 | 注意点拡張機能インストール済みなら追加設定なしで利用可 |
| WSL(Windows Subsystem for Linux) | フォーム自動入力× 非対応 | 注意点Chrome連携そのものが使えない |
| Bedrock / Google CloudのAgent Platform(旧Vertex AI)/ Foundry経由 | フォーム自動入力× 非対応 | 注意点別途claude.aiアカウントでの利用に切り替える必要がある |
VS CodeのClaude Code拡張機能では、プロンプト欄に@browserと入力してから指示を続けると同じ操作ができます。フラグの指定は不要で、拡張機能さえ入っていればすぐ使えます。
ブラウザを介さずネイティブのmacOSアプリを直接操作したい場合は、Chrome連携ではなくDesktop Computer Useが候補になります。ブラウザで完結しない作業(デスクトップアプリのフォームなど)では、こちらのほうが向きます。
よくある質問
プランモードでもフォーム入力は動きますか
プランモードでは、ページを読むだけの操作は確認なしで実行されますが、クリックや入力のように状態を変える操作は承認を求められます。フォーム入力はクリックと入力を伴うため、プランモード中は毎回の承認が必要になります。
モーダルダイアログが出て操作が止まったら
alertやconfirmのようなJavaScriptダイアログが表示されていると、ブラウザのイベントがブロックされてClaudeの操作が届きません。ダイアログを手動で閉じてから、Claudeに続行するよう伝えます。
拡張機能の接続がセッションの途中で切れることはありますか
長時間セッションでは拡張機能のサービスワーカー(service worker)がアイドル状態になり、接続が切れることがあります。ブラウザツールが反応しなくなったら/chromeから「Reconnect extension」を選びます。
サードパーティのブラウザ自動化MCPサーバーとは別物ですか
はい。Claude in Chromeはclaude-in-chromeというMCPサーバーとして動作し、/mcpからclaude-in-chromeを選んで「View tools」を選ぶと利用可能なツール一覧を確認できます。他社製のブラウザ自動化MCPサーバーとは別の仕組みです。
まとめ
Claude CodeのChromeフォーム自動入力は、CSVからの一括登録やテストデータ投入のような反復作業を、ターミナルからの自然な指示だけで進められる機能です。使うにはPro・Max・Team・Enterpriseのいずれかのプランで/login済みであること、Claude in Chrome拡張機能のバージョン1.0.36以上が必要です。ファイルアップロードまで含めて任せる場合はv2.1.211以降のClaude Codeを使い、10MBの合計サイズ上限とハードリンクの制約だけ覚えておけば、CRM登録やバグトラッカーへの添付といった作業を一通りブラウザ操作込みで委ねられます。