何のためのものか
Claude が dev サーバーを起動し、Browser ペインで自分の変更を自分で検証するための窓。スクリーンショットを撮り、DOM を検査し、要素をクリックし、フォームを埋め、見つけた問題を直す。フロントエンドだけでなくバックエンドにも使え、API エンドポイントの検査やサーバーログの閲覧もここで回る。
触る
- プロジェクトのファイルを編集させる。多くの場合、Claude が自動でサーバーを起動する
Cmd+Shift+B（Windows はCtrl+Shift+B）で Browser ペインを開閉する- session toolbar のサーバードロップダウンから起動・停止する
チャット内の HTML・PDF・画像・動画のパスをクリックしても、このペインで開く。
入れる
設定はセッション開始時に選んだフォルダのルートの .claude/launch.json に入る。
cwdでサブフォルダを指定する。親フォルダでセッションを始めると、独自の dev サーバーを持つサブフォルダは自動検出されないautoPort—trueは空きポートを自動で探す。falseはエラーで失敗する（OAuth コールバックや CORS 許可リストでポート固定が要るとき）。未設定なら尋ねて回答を保存する。別のポートを選んだ場合はPORT環境変数でサーバーへ渡るurl— 既定のhttp://localhost:<port>以外を開くとき。localhost のurlはサーバーのオリジンだけにする（パスもクエリも付けられず、ポートはportと一致させる）。コマンドを書かずにurlだけ置くと、自分で起動済みのサーバーにプレビューを接続するenvに秘密情報を置かない。 このファイルはリポジトリにコミットされる。dev サーバーへ渡す秘密情報は local environment editor に置く
効かせる
- auto-verify を決める — 既定では編集のたびに検証が走る。止めるなら
"autoVerify": false、またはサーバードロップダウンから切り替える。止めてもプレビューのツールは使えるので、任意のタイミングで検証を依頼できる - ログイン状態を保つ — ドロップダウンの Persist sessions で、サーバー再起動をまたいで cookie と local storage を保持する
- 外部サイトの承認を使い分ける — 初回は Allow once（保存しない）／ Always allow（その端末にそのサイトの承認を保存。Settings で取り消せる）／ Deny が出る。サブドメインを含め、サイトごとに個別の承認が要る
Claude の書き込み操作はすべての permission mode で safety classifier に検査される。Auto と Bypass permissions 以外のモードでは、新しいサイトへ移動する前にドメイン許可リストの検査も走る。
落とし穴
- Browser ペインは自分のブラウザとは別のクリーンなプロファイルで、保存済みのログインも履歴も持たない。ログイン済みの自分として動かしたいときは Claude in Chrome 拡張の担当
- 承認済みのサイトでも、Claude は入力なしに購入・アカウント作成・CAPTCHA の回避を行わない
- localhost の
urlにパスやクエリを書くと設定エラーとして報告される。特定のページを見せたいならプレビューを開いた後に移動を依頼する