Claude Codeでブラウザ操作する方法｜Claude in Chrome・Playwright MCPの使い分けと設定

Claude Code にブラウザを操作させる方法は1つではありません。ふだん使っている Chrome をログイン状態のまま任せるなら Claude in Chrome（claude --chrome）、開発中の画面を確かめるならデスクトップアプリの内蔵ブラウザか Playwright MCP、表示速度や通信を調べるなら Chrome DevTools MCP、ブラウザの外のアプリまで触らせるなら computer use というように、目的で選ぶのが近道です。

この記事では、6つの方法の違いを1つの表と図にまとめたうえで、それぞれの前提条件、Claude Code への追加コマンド、つながらないときのエラーと対処までを順に説明します。「Max プランが必要」「ベータ版」「Chrome 以外は使えない」といった書き方の記事も見かけますが、現在の公式ドキュメントの記載とは違う点があるので、前提条件の節で整理します。

本記事の情報について：2026年10月24日に取得した Claude Code 公式ドキュメント（Chrome で Claude Code を使用する、CLI から computer use を使う、Desktop、MCP）、Claude Code の CHANGELOG（最新は v2.1.309）、各ツールの公式リポジトリ（Playwright MCP、Playwright CLI、Chrome DevTools MCP）にもとづいています。claude mcp add の出力と .mcp.json の中身、各ツールの --help の表示は、編集部が macOS の Claude Code v2.1.306 で実行して確かめたものです。ブラウザに頼む操作の例は、公式ドキュメントに載っているプロンプトを日本語にしたものです。

状況別の読み分け早見表

やりたいことに近い行から読み進めてください。

Claude Code でブラウザを操作する6つの方法

Claude Code からブラウザを動かす方法は、Claude in Chrome、デスクトップアプリの内蔵ブラウザ、Playwright MCP、Playwright CLI、Chrome DevTools MCP、computer use の6つです。 前の2つは Anthropic が Claude Code に組み込んでいる機能、真ん中の3つは Microsoft や Google の Chrome チームが公開しているツールを Claude Code に追加して使う方法、computer use はブラウザに限らず画面そのものを操作する機能です。

いちばん大きな違いは、どのブラウザのどのログイン状態で動くかです。Claude in Chrome はあなたが使っている Chrome（または Edge など）のログイン状態をそのまま使います。内蔵ブラウザは個人のブラウザと分かれたまっさらなプロファイルで、Playwright MCP や Chrome DevTools MCP はツール専用のプロファイルでブラウザを起動します。

表の内容は各公式ドキュメント・公式リポジトリの記載です（Claude in Chrome は公式ドキュメント、Playwright MCP は README の「Requirements」と「Configuration」、Chrome DevTools MCP は README の「Requirements」）。

上の図のとおり、最初に「ふだんのブラウザのログイン状態が必要か」を決めると、候補が半分に絞れます。Gmail や Google ドキュメント、Notion、社内の管理画面のように、ログインした状態で作業させたいなら Claude in Chrome です。開発中のアプリを触らせるだけならログイン状態は要らないので、内蔵ブラウザや Playwright MCP のほうが、ふだんのアカウントを巻き込まずに済みます。

もう1つの分かれ目は契約です。Claude in Chrome は Anthropic と直接契約したプラン（Pro・Max・Team・Enterprise）で /login している場合だけ使えます。API キーで Claude Code を使っている場合や、Amazon Bedrock などのクラウド経由で使っている場合は、Playwright MCP か Chrome DevTools MCP を選びます。こちらは Claude Code に追加するツールなので、契約の種類を問いません。

MCP（Model Context Protocol）は、外部のツールを Claude Code につなぐための共通の仕組みです。GitHub や Slack などをつなぐ一般的な手順はClaude Code MCPサーバー導入ガイドで説明しています。

Claude in Chrome の前提条件と始め方

Claude in Chrome は、Chrome の拡張機能を通じて Claude Code があなたのブラウザを操作する機能で、claude --chrome で起動します。 Claude は新しいタブを開いて作業し、ブラウザのログイン状態を共有するので、すでにサインインしているサイトにそのままアクセスできます。操作は見えるウィンドウでリアルタイムに進み、ログインページや CAPTCHA に当たると、Claude は手を止めてあなたに対応を頼みます（出典: Chrome で Claude Code を使用する）。

Claude Code の Chrome 連携は、2026年6月29日〜7月3日の週に出た v2.1.198 でプレビューを終え、一般提供になりました。公式の更新情報は「The Chrome integration is out of preview for everyone on a direct Anthropic plan.」と書いています（出典: What's new Week 27）。

使える条件（ブラウザ・プラン・ログイン方法）

公式ドキュメントが挙げる前提条件を表にまとめます。

プランについて公式ドキュメントは「直接 Anthropic プラン（Pro、Max、Team、または Enterprise）」と書いており、Max に限った機能ではありません。Pro・Max・Team・Enterprise それぞれの違いはClaude Code 料金プラン完全ガイドで比べています。

Windows で使う場合は、WSL の中ではなく Windows 側の Claude Code から使います。ネイティブ版と WSL の違いはClaude CodeをWindowsで使う方法を参照してください。

HIPAA を有効にしている Enterprise の組織では、Claude in Chrome は既定でオフになっており、組織の Owner が Organization settings > Claude in Chrome でオンにできます。

claude --chrome で起動して接続を確かめる

Chrome に拡張機能を入れてサインインしたら、ターミナルで次のように起動します。

claude --chrome

初めて Chrome 連携で起動したときは、連携の内容とサイトの許可のしくみを説明するダイアログが1回だけ出るので、Enter で進みます。そのあとは、ブラウザでしてほしいことを普通に頼むだけです。公式ドキュメントの例を日本語にすると次のようになります。

code.claude.com/docs を開いて検索ボックスをクリックし、
「hooks」と入力して、どんな結果が出たか教えて

ブラウザの操作の前に許可を求められたら承認します。このダイアログは Claude in Chrome wants to で始まり、そのサイトでの操作をセッション中すべて許可する選択肢もあります。

接続できているかは、Claude Code の中で /chrome を実行して確かめます。状態の画面に 「Status: Enabled」 と 「Extension: Installed」 が表示されていれば連携は動いています。/chrome の画面からは、許可の管理、拡張機能の再接続（Reconnect extension）、複数のブラウザがつながっているときの切り替え（Select browser…）もできます。

拡張機能が入っていない状態で Claude がブラウザを使おうとすると、「Claude wants to use your browser」 という案内が出ます。「Install extension」を選ぶと拡張機能のインストールページが開き、インストールが終わるとそのセッションのままブラウザのツールが使えるようになります。「Not now」はそのまま続行、「Don't ask again」は以後この案内を出さない設定で、案内は1セッションに1回までです。

Claude が使うブラウザのツールの一覧は、/mcp で claude-in-chrome を選び、「View tools」で確認できます。

毎回有効にする設定とコンテキストの注意

毎回 --chrome を付けたくない場合は、/chrome を実行して 「Enabled by default」 を選びます。この設定は CLI と VS Code の拡張機能で共通です。

ただし公式ドキュメントは「Enabling Chrome by default increases context usage since the browser tools and their instructions are always loaded.」と注意しています。ブラウザのツールとその説明が常に読み込まれるため、ブラウザを使わない作業でもコンテキストを消費します。ブラウザをたまにしか使わないなら、既定ではオフのままにして、必要なときだけ claude --chrome で起動するほうが向いています。反対に、あるセッションだけ無効にしたいときは claude --no-chrome で起動します（出典: CLI reference）。

なお、リポジトリの .claude/settings.json などで Chrome 連携をオンにすることはできません。v2.1.290 で、プロジェクトの設定ファイルから Claude in Chrome をオンにできないよう変更されました（CHANGELOG）。クローンしたリポジトリが勝手にあなたのブラウザへ Claude をつながないようにするためで、プロジェクトの設定で CLAUDE_CODE_ENABLE_CFC を 1 にしていると、起動時に警告が出て連携はオフのままになります。

VS Code では @browser で呼ぶ

VS Code の拡張機能では、プロンプト欄に @browser と入力し、続けて頼みたいことを書きます。

@browser localhost:3000 を開いて、コンソールにエラーが出ていないか確かめて

VS Code でも、使うのは同じ Claude in Chrome 拡張機能（1.0.36 以上）です（出典: Use Claude Code in VS Code）。「Enabled by default」をオンにしていて Claude Code が v2.1.287 以降なら、VS Code のセッションは開始時にブラウザへ接続するので、@browser と打つ前から Claude がブラウザを使えます。

頼めることとプロンプト例

公式ドキュメントが挙げる使い方は、開発作業とブラウザ作業を1つの流れでつなぐものです。

コンソールのログは量が多くなりがちなので、「すべてのログを見て」ではなく、どんなエラーを探すのかを伝えるのがコツだと公式ドキュメントは書いています。フロントエンド開発での使い方はClaude Code × React/Next.js開発ガイドも参考になります。

Claude が開いたタブは、セッションに結び付いた Chrome のタブグループにまとめられます。/clear を実行するとグループごと閉じます（/clear の後も続く作業が動いている間は閉じません）。/resume での切り替えや Claude Code の終了では、空の新しいタブしか無いときだけグループを閉じます。読んでいる途中のページは残るので、作業後にタブが残っていても異常ではありません。

サイトの許可・auto モード・プランモード

どのサイトで閲覧・クリック・入力を許すかは、Chrome 拡張機能の設定で管理します。Claude Code はその設定を引き継ぎます。

auto モードでは、auto モードの判定がブラウザの操作を承認した場合、拡張機能はその操作についてサイトごとの確認を省きます。ただし、許可ルールで Claude in Chrome に対してどこかのサイトを拒否している場合は省きません。

プランモードでは、GIF の録画、新しいタブを開く操作、ショートカットの実行の前に許可を求められます。

ファイルのアップロードと GIF 録画の制限

Claude はあなたのマシンのファイルを、ページのアップロード欄に添付できます。公式ドキュメントにある制限は次の4つです。

• 読み取りが禁止されたファイルは添付できない: 許可ルールで Read を拒否しているファイルは、アップロードもできません。
• 1回のアップロードは合計 10MB まで。
• ハードリンクが複数あるファイルは拒否される: node_modules などパッケージマネージャーの保管場所によくあるので、コピーしてから添付します。
• 認証情報を置く名前のファイルは拒否される: .env、.pem や .key のファイル、.ssh の下のファイルなど。この制限は Claude Code v2.1.293 以降です。

GIF の録画は、操作の手順を共有したいときに便利ですが、ブラウザに見えているものがすべて記録されます。公式ドキュメントは、ログインしたページのアカウント情報も含まれるので、チームの外に共有する前に中身を確かめるよう注意しています。

デスクトップアプリの内蔵ブラウザで開発中の画面を確かめる

Claude Code のデスクトップアプリには、開発中のアプリを開いて Claude が自分の変更を確かめるための内蔵ブラウザ（Browser pane）があります。 Claude が開発サーバーを起動して Browser pane で開き、画面の操作や API の確認、サーバーのログの確認をしながら修正を進めます。既定では、編集のたびに Claude が変更を自動で確かめます（出典: Desktop の Preview your app）。

外部のサイトを開けるようになったのは2026年7月6日〜10日の週で、ドキュメントや課題管理ツールなどを開発中のアプリと並べて開けます（What's new Week 28）。Browser pane は macOS では Cmd+Shift+B、Windows では Ctrl+Shift+B で開きます。

Claude in Chrome との違いは、ログイン状態です。公式ドキュメントは、Browser pane は個人のブラウザとは別のまっさらなプロファイルで、保存したログインや履歴を持たないと説明しています。Browser pane の中で別にサインインすることはでき（Google OAuth のようなポップアップのサインインも含む）、Browser pane の ⋮ メニューの Keep cookies でアプリを終了しても Cookie を残せますが、ふだんのブラウザのログインは引き継ぎません。アプリの開発・テストやサインインの要らないサイトには Browser pane、あなたとしてログインしたセッションで作業させたいときは Claude in Chrome、という使い分けです。

外部のサイトで Claude が初めて操作するときは「Allow once」「Always allow」「Deny」から選ぶカードが出ます。許可したサイトでも、Claude はあなたの確認なしに購入・アカウント作成・CAPTCHA の突破をしません。開発サーバーの起動方法は .claude/launch.json に保存され、自動の確認を止めたいときはそのファイルに "autoVerify": false を書きます。SSH のセッションでは Browser pane のツールが無いので、Claude は Browser pane でアプリを開けません。

デスクトップアプリの並列セッションやサイドチャットなど、ほかの機能はClaude Code デスクトップアプリ並列ガイドで紹介しています。

Playwright MCP を Claude Code に追加する

Playwright MCP は、Microsoft の Playwright を使ってブラウザを操作する MCP サーバーで、claude mcp add で Claude Code に追加します。 画面の画像ではなく、ページのアクセシビリティツリー（ボタンや入力欄などの構造を表したデータ）を読んで操作するので、画像を読み取るモデルを必要としないのが特徴です（出典: Playwright MCP の README）。必要なのは Node.js 18 以上だけで、Anthropic の契約の種類は問いません。

追加コマンドとスコープ

Claude Code の MCP のドキュメントでは、ローカルで動かすサーバー（stdio）を追加するとき、Claude Code 自身のオプションとサーバーを起動するコマンドを --（ハイフン2つ）で区切ると説明しています（出典: MCP）。Playwright MCP なら次のとおりです。

claude mcp add playwright -- npx @playwright/mcp@latest

Playwright MCP の README には -- を付けない claude mcp add playwright npx @playwright/mcp@latest の形が載っていますが、-- で区切っておくと、後ろにサーバーのオプション（--headless など）を足しても Claude Code のオプションと混ざりません。

どこに保存するかは --scope で決めます。

編集部が空のフォルダで claude mcp add --scope project playwright -- npx @playwright/mcp@latest を実行すると、「Added stdio MCP server playwright with command: npx @playwright/mcp@latest to project config」と表示され、次の .mcp.json ができました。

{
  "mcpServers": {
    "playwright": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "@playwright/mcp@latest"
      ],
      "env": {}
    }
  }
}

この .mcp.json をリポジトリに入れると、チームのメンバーは Claude Code を起動したときに承認するだけで同じ設定を使えます。追加できたかは claude mcp list で確かめ、✔ Connected と出ていれば接続できています。Claude Code の中では /mcp でも確認できます。

試しに頼むなら「Playwright で localhost:3000 を開いて、スクリーンショットを撮って」のように、使う道具・開く URL・ほしい結果をはっきり書きます。テストの自動化全体の進め方はClaude Code × テスト自動化 完全ガイドで説明しています。

画面を出さずに動かす・ログイン状態を持たせる

Playwright MCP は 既定ではブラウザの画面を表示して動きます。README のオプション表には「run browser in headless mode, headed by default」とあり、編集部が npx @playwright/mcp@0.0.83 --help を実行した表示も同じでした。画面を出さずに動かしたいときは、-- の後ろに --headless を足します。

claude mcp add playwright -- npx @playwright/mcp@latest --headless

よく使うオプションは次のとおりです（README の「Configuration」から抜粋）。

ログイン状態の扱いは3通りです。何も指定しないと専用のプロファイルを保存し、ログイン情報も次回に引き継ぎます。macOS では ~/Library/Caches/ms-playwright/mcp-{channel}-{workspace-hash} に置かれ、プロジェクトごとに別のプロファイルになります。--isolated を付けると毎回まっさらな状態で始まり、--storage-state で決まったログイン状態を読み込ませることもできます。--extension を使うと、Playwright の拡張機能を入れたふだんのブラウザのタブに接続できます。

注意したいのは、保存するプロファイルは同時に1つのブラウザしか使えない点です。同じプロジェクトで Claude Code を2つ並べて Playwright MCP を使うと競合するので、2つ目以降は --isolated を付けるか、別の --user-data-dir を指定します。

トークンを節約したいなら Playwright CLI

Microsoft は、MCP とは別に Playwright CLI（playwright-cli）も公開しています。両方の README が、コーディングエージェントには CLI とスキルの組み合わせが向いていると説明しており、その理由を「CLI invocations are more token-efficient」、つまり大きなツールの定義やページの構造データをモデルのコンテキストに読み込まずに済むからだと書いています（出典: Playwright CLI の README）。

npm install -g @playwright/cli@latest
playwright-cli install --skills

playwright-cli install --skills で、Claude Code などが使うスキルが入ります。Playwright CLI は 既定では画面を表示しません（Playwright MCP とは逆）。画面を見たいときは playwright-cli open https://playwright.dev --headed のように --headed を付けます。プロファイルも既定ではメモリ上にあり、ブラウザを閉じると消えるので、残したいときは --persistent を付けます。プロジェクトごとにブラウザを分けたいときは、PLAYWRIGHT_CLI_SESSION=todo-app claude . のように環境変数を付けて Claude Code を起動します。

使い分けの目安として README は、ページの状態を保ったまま調べ続けるような、長く続く自律的な作業には MCP が今も向いているとしています。短い確認を繰り返すなら CLI、ブラウザの状態を保ったまま探索させたいなら MCP、と考えると選びやすくなります。

同じ発想の CLI には、Vercel Labs の agent-browser もあります。npm install -g agent-browser と agent-browser install で入れ、npx skills add vercel-labs/agent-browser で Claude Code のスキルとして追加できます。

Chrome DevTools MCP で表示速度・通信・コンソールを調べる

Chrome DevTools MCP は、Google の Chrome DevTools チームが公開している MCP サーバーで、表示速度の計測や通信・コンソールの調査に強いのが特徴です。 README は主な機能として、Chrome DevTools でトレースを記録して改善点を取り出すこと、通信の分析、スクリーンショット、ソースマップを反映したスタックトレース付きのコンソールの確認を挙げています（出典: Chrome DevTools MCP の README）。必要なのは Node.js の LTS 版と、最新の安定版以降の Chrome です。

Claude Code への追加は、公式の設定ガイドに次のコマンドが載っています。

claude mcp add chrome-devtools --scope user npx chrome-devtools-mcp@latest

--scope user なので、全プロジェクトで使えるようになります。MCP サーバーとあわせて使い方のスキルも入れたい場合は、Claude Code のプラグインとして追加します。

/plugin marketplace add ChromeDevTools/chrome-devtools-mcp
/plugin install chrome-devtools-mcp@chrome-devtools-plugins

プラグインで入れる場合は、以前に MCP サーバーだけを追加していたら先にそれを削除してから上の2つのコマンドを実行し、インストールの後に Claude Code を再起動すると MCP サーバーとスキルが読み込まれます（/skills で確認できます）。

最初の確認には、README の例どおり「https://developers.chrome.com の表示速度を調べて」と頼むと、ブラウザが開いてトレースを記録します。ブラウザは、ブラウザが必要なツールを Claude が初めて使ったときに起動します。

覚えておきたいオプションは次の4つです（README と configuration ガイドより）。

あわせて知っておきたいのが、データの扱いです。README によると、Google はツールの成功率や環境情報などの利用統計を既定で集めており、--no-usage-statistics を付けると止められます。表示速度のツールは、実際の利用者の体験データを取るためにトレースした URL を Google の CrUX API に送ることがあり、--no-performance-crux で止められます。社外に出したくない URL を調べるときは、この2つを付けて追加するのが安全です。

claude mcp add chrome-devtools --scope user -- npx chrome-devtools-mcp@latest --no-usage-statistics --no-performance-crux

また README は、公式に対応するのは Google Chrome と Chrome for Testing だけで、ほかの Chromium 系ブラウザは動く保証がないとしています。Edge で使いたいなら Claude in Chrome か Playwright MCP（--browser msedge）、Brave などで使いたいなら Claude in Chrome が選択肢になります。

computer use でブラウザ以外のアプリを操作する

computer use は、Claude がアプリを開き、クリックや入力をして画面を見ながら作業する機能で、ブラウザではできない作業のためのものです。 CLI では macOS 限定の研究プレビューで、Pro か Max のプランが必要です。Team と Enterprise では使えず、-p を付けた非対話モードでも使えません（出典: CLI から computer use を使う）。

公式ドキュメントは、Claude がどの手段を選ぶかの順番も示しています。そのサービスの MCP サーバーがあればそれを、シェルのコマンドで済むなら Bash を、ブラウザの作業で Claude in Chrome が使えるならそれを使い、どれも当てはまらないときに computer use を使います。computer use は最も範囲が広く、最も遅い手段という位置づけです。さらに、computer use で操作するときもブラウザは見るだけ、ターミナルや IDE はクリックだけに制限されるので、ブラウザの操作そのものを computer use に任せることはできません。

有効にするには、Claude Code の中で /mcp を開き、一覧の computer-use を選んで「Enable」にします。設定はプロジェクトごとに保存されます。初めて使うときに、macOS の「アクセシビリティ」と「画面収録」の許可を求められるので、両方を許可します。操作するアプリはセッションごとに承認し、Esc キーでいつでも止められます。

デスクトップアプリの computer use は macOS と Windows で使え、こちらも Pro か Max のプランが必要です（Team・Enterprise は不可、macOS は 14 以降）。iOS アプリの確認には、デスクトップアプリでは画面操作を使わない iOS Simulator のパネルが開きます（出典: Desktop）。

複数の方法を入れるときの注意

ブラウザを操作する方法は、いくつ入れても構いません。ただ、次の4点を知っておくと、意図しないツールが使われたり、コンテキストが足りなくなったりするのを防げます。

1つ目は、MCP のツールの出力の上限です。Claude Code は、MCP のツールの出力が 10,000 トークンを超えると警告を出し、既定では 25,000 トークンで打ち切ります（出典: MCP）。ページ全体の構造を返す操作は大きくなりやすいので、警告が続くときは「このフォームの部分だけ」のように範囲を絞って頼むか、上限を MAX_MCP_OUTPUT_TOKENS で変えます。

2つ目は、MCP サーバーを足したときのコンテキストへの影響です。Claude Code は既定で MCP の tool search を使い、セッションの開始時にはツールの名前とサーバーの説明だけを読み込んで、ツールの定義は Claude が必要とするまで読み込みません。公式ドキュメントは、MCP サーバーを足してもコンテキストへの影響は小さいと説明しています。ふだん使わないサーバーは /mcp でオフにでき、設定を消さずに接続だけを止められます。

3つ目は、無人で動かすときの選び方です。CI や claude -p のように人が画面を見ない実行なら、画面を出さない Playwright MCP（--headless）か、既定で画面を出さない Playwright CLI が向いています。Claude in Chrome は、拡張機能を入れてサインインした Chrome が開いている必要があります。

4つ目は、どれを使うかをプロンプトで指定することです。Playwright MCP と Chrome DevTools MCP はどちらも「ページを開く」「クリックする」ツールを持つので、「Playwright で開いて」「Chrome DevTools でトレースを取って」と道具の名前を書くと、思ったほうが使われます。

ログイン済みのブラウザを任せる前に確認したい注意点

ログイン状態を共有する方法ほど便利で、そのぶん任せる範囲を絞る必要があります。 公式ドキュメントとツールの README が書いている注意を、確認しやすい形にまとめます。

• Claude in Chrome で開いてよいサイトを、拡張機能の設定で決めているか
• 業務のアカウントと開発用で、ブラウザのプロファイル（または Playwright MCP の --isolated）を分けているか
• GIF やスクリーンショットを共有する前に、映っているアカウント情報を確かめているか
• Chrome DevTools MCP で社外に出したくない URL を調べるとき、--no-usage-statistics と --no-performance-crux を付けているか
• Playwright MCP のアクセス制限のオプション（--allowed-origins など）を、安全のための仕組みと思い込んでいないか
• チームで .mcp.json を共有する場合、追加するサーバーを全員が確認できる状態にしているか

Playwright MCP の README は「Playwright MCP is not a security boundary.」と明記しており、--allowed-origins や --blocked-origins も、安全のための境界ではなく、リダイレクトにも効かないと書いています。Chrome DevTools MCP の README も、ブラウザの中身が MCP クライアントにすべて見えるので、共有したくない個人情報や機密情報を扱わないよう注意しています。

computer use は、サンドボックスで動く Bash と違い、承認したアプリに実際のデスクトップでアクセスします。Claude は画面上の内容からの指示の乗っ取り（プロンプトインジェクション）を検知して知らせますが、信頼の境界が違う点を公式ドキュメントは警告しています。

社内で Claude Code を使うときの情報の扱いや権限の決め方は、Claude Codeのセキュリティと社内導入時の注意点で詳しく説明しています。

つながらないときのエラーと対処

Claude in Chrome がつながらない原因の多くは、拡張機能の状態、サインインしている組織の違い、接続の途切れのどれかです。 公式ドキュメントのエラー表をもとに、よく出るエラーと対処をまとめます。

組織が複数ある人は、Claude Code 側の組織を /status の Organization の行で確かめ、拡張機能を同じ組織でサインインし直します。ただし、拡張機能からログアウトすると、拡張機能に保存したショートカットとスケジュールしたタスクが消えるので、ほかの対処を先に試すよう公式ドキュメントは勧めています。

拡張機能が見つからないときは、次の順で確かめます。

1. chrome://extensions で拡張機能が入っていて有効か確かめる
2. claude --version で Claude Code が最新か確かめる
3. Chrome が起動しているか確かめる
4. /chrome で「Reconnect extension」を選ぶ
5. それでも直らなければ、Claude Code と Chrome の両方を再起動する

初めて Chrome 連携を有効にしたとき、Claude Code はネイティブメッセージングホストという設定ファイルを置きます。Chrome はこのファイルを起動時に読むので、1回目に拡張機能が見つからなかったときは Chrome を再起動します。macOS の Chrome なら ~/Library/Application Support/Google/Chrome/NativeMessagingHosts/com.anthropic.claude_code_browser_extension.json、Linux なら ~/.config/google-chrome/NativeMessagingHosts/ の下、Windows ならレジストリの HKCU\Software\Google\Chrome\NativeMessagingHosts\ に置かれます。Edge は macOS なら ~/Library/Application Support/Microsoft Edge/NativeMessagingHosts/ の下です。

ほかに公式ドキュメントが挙げる症状は次のとおりです。

• ブラウザが反応しない: alert や confirm などのダイアログがページを止めていることがあります。手で閉じてから、続けるよう Claude に伝えます。
• 長いセッションで接続が切れる: 拡張機能のサービスワーカーが休止しています。/chrome の Status が「Not connected」なら「Reconnect extension」を選びます。v2.1.290 より前は、この操作で切れた接続が戻らなかったので、古い版なら更新します。
• Windows で EADDRINUSE: 同じ名前付きパイプを別のプロセスが使っています。Chrome を使っているほかの Claude Code のセッションを閉じて、再起動します。

Claude Code そのものの起動や認証のエラーは、Claude Code トラブルシューティングガイドで症状ごとに整理しています。

よくある質問

まとめ

• Claude Code でブラウザを操作する方法は、Claude in Chrome、デスクトップアプリの内蔵ブラウザ、Playwright MCP、Playwright CLI、Chrome DevTools MCP、computer use の6つ。最初に「ふだんのブラウザのログイン状態が必要か」で絞る
• Claude in Chrome は claude --chrome で起動し、/chrome の「Status: Enabled」「Extension: Installed」で接続を確かめる。直接契約の Pro・Max・Team・Enterprise と /login が条件で、WSL・API キー・Bedrock などでは使えない
• 「Enabled by default」は便利だがコンテキストを常に消費する。プロジェクトの設定ファイルからはオンにできない
• Playwright MCP は claude mcp add playwright -- npx @playwright/mcp@latest で追加する。既定は画面表示ありで、--headless・--isolated・--storage-state で動き方とログイン状態を決める。トークンを抑えたいなら Playwright CLI
• Chrome DevTools MCP は表示速度・通信・コンソールの調査向け。利用統計と CrUX への送信を止めるオプションを知っておく
• computer use はブラウザの外のアプリ向け。CLI は macOS・Pro か Max の研究プレビュー
• つながらないときは、拡張機能の状態、サインインしている組織、/chrome の「Reconnect extension」の順に確かめる

Claude Code の全体像はClaude Code 活用方法ガイド、スキルの仕組みはClaude Code Skillsの使い方をご覧ください。

参考：

• https://code.claude.com/docs/ja/chrome
• https://code.claude.com/docs/ja/computer-use
• https://code.claude.com/docs/en/desktop
• https://code.claude.com/docs/en/mcp
• https://code.claude.com/docs/en/cli-reference
• https://code.claude.com/docs/en/vs-code
• https://code.claude.com/docs/en/whats-new/2026-w27
• https://code.claude.com/docs/en/whats-new/2026-w28
• https://github.com/anthropics/claude-code/blob/main/CHANGELOG.md
• https://github.com/microsoft/playwright-mcp
• https://github.com/microsoft/playwright-cli
• https://github.com/ChromeDevTools/chrome-devtools-mcp
• https://github.com/vercel-labs/agent-browser