コンテンツにスキップ

ブラウザー

ブラウザーを使うと、ChatGPT は Web サイトを開いて最新情報を収集し、ユーザーが制御を維持したまま操作を実行できます。選択肢の比較、Web サイトでの複数ステップのタスクの完了、作成中のページの確認などに使用できます。

ブラウザーは、Web 上の ChatGPT と ChatGPT デスクトップアプリで利用できます。

ページのコンテンツは信頼できないコンテキストとして扱ってください。機密情報を共有したり、ChatGPT に操作を許可したりする前に、サイトと提案された操作を確認してください。

ChatGPT デスクトップアプリに組み込まれたブラウザーでは、チャット内でユーザーと ChatGPT が Web サイトやローカル Web アプリを共有して表示できます。ページのプレビュー、視覚的なフィードバックの提供、ユーザーに代わったサイトの操作などに使用できます。

組み込みブラウザーでは、通常のブラウザーとは別のブラウザープロファイルが使用されます。既存のタブやブラウザーセッションは自動的に共有されません。タスクでアカウントが必要な場合は、直接サインインできます。Settings > Browser を開くと、ブラウザーデータや、お使いのデバイスで利用できるプロファイルのインポート機能を管理できます。

ブラウザーでダウンロードしたファイルは、デフォルトでシステムの Downloads フォルダーに保存されます。Settings > Browser では、別のダウンロード先を選択したり、システムのデフォルトにリセットしたり、Ask where to save downloads を有効にしたりできます。

ChatGPT が既存の Chrome タブで作業したり、通常の Chrome プロファイルを使用したりする必要がある場合は、代わりに Chrome 拡張機能 を使用してください。

ツールバーから URL をクリックして、手動で移動して、または Cmd+Shift+B を押して組み込みブラウザーを開けます(Windows では Ctrl+Shift+B)。

ブラウザーでのコンピュータ操作

デスクトップアプリでは、コンピュータ操作を使うと、Work モードの ChatGPT または Codex が組み込みブラウザーを直接操作できます。選択したエクスペリエンスでは、ページを開く、クリックする、入力する、レンダリングされた状態を調べる、スクリーンショットを撮る、ページ上で操作結果を検証する、といったことができます。

ChatGPT を選択して Work モードに切り替えるか、Codex を選択します。Plugins Directory を開き、Browser をインストールします。その後、タスクでブラウザーを使用するよう ChatGPT または Codex に依頼するか、@Browser で直接参照します。

例:

Use the browser to open http://localhost:3000/settings, reproduce the layout
bug, and fix only the overflowing controls.

ChatGPT は、すでにそのサイトを許可している場合を除き、Web サイトを使用する前に確認を求めます。Settings > Browser で、許可したサイトとブロックしたサイトを管理できます。また、情報の送信、購入、権限の変更、データの削除などの機密性の高い操作を行う前にも、ChatGPT は確認を求めます。ChatGPT は組み込みブラウザーでのファイルアップロードを自動化できません。

ページ上の指示は、誤解を招くものや悪意のあるものである可能性があります。Web サイトの権限を許可すると、ChatGPT はそのサイトを操作できるようになりますが、サイトのコンテンツが信頼できるものになったり、すべての操作が承認されたりするわけではありません。

ページをプレビューする

  1. 統合ターミナルで、または ローカル環境アクションを使用して、アプリの開発サーバーを起動します。
  2. URL をクリックするか、ブラウザーで手動で移動して、ローカルルート、ファイルに紐づけられたページ、または公開ページを開きます。
  3. コードの差分と並べて、レンダリングされた状態を確認します。
  4. 変更が必要な要素や領域にブラウザーコメントを残します。
  5. ChatGPT にコメントへの対応を依頼し、対象範囲を狭く保ちます。

例:

I left comments on the pricing page in the built-in browser. Address the mobile
layout issues and keep the card structure unchanged.

ページにコメントする

バグがレンダリングされたページでのみ確認できる場合は、ブラウザーコメントを使って ChatGPT に正確なフィードバックを提供します。

  1. Annotation mode をオンにします。
  2. 要素をクリックするか、ドラッグして領域を選択します。
  3. コメントを記入して保存します。
  4. コメントに対応するよう ChatGPT に依頼するメッセージをチャットで送信します。

問題と望む結果を明確に記載すると、コメントを効果的に利用できます。

This button overflows on mobile. Keep the label on one line if it fits,
otherwise wrap it without changing the card height.
This tooltip covers the data point under the cursor. Reposition the tooltip so
it stays inside the chart bounds.
### スタイルに関するフィードバック ページ上のセクションに注釈を追加するときは、テキスト入力の横にある **Adjust** を選択すると、ChatGPT により細かなスタイルのフィードバックを提供できます。フォント、テキスト、間隔、色などの値を変更し、ページ上で結果をプレビューしてから、より明確な対象を指定して注釈を送信できます。

ブラウザータスクの対象範囲を保つ

各ブラウザータスクは、1 回で確認できる程度に小さく保ちます。

  • ページ、ルート、または URL を指定します。
  • ロード中、空、エラー、成功など、対象とする状態を指定します。
  • 変更が必要な正確な要素や領域にコメントを残します。
  • ChatGPT が完了した後、ページをもう一度確認します。
  • ChatGPT にローカルページを開かせる前に、開発サーバーを起動または確認するよう依頼します。

リポジトリを変更する場合は、レビュー ペインを使用して変更を確認し、コメントを残します。

## 開発者モード 開発者モードは、Chrome のコンピュータ操作および組み込みブラウザーで使用できます。ChatGPT に Chrome DevTools Protocol(CDP)への制御されたアクセスを提供します。JavaScript のプロファイリング、コンソール出力やネットワークトラフィックの調査、DOM や適用されたスタイルの確認、ライブブラウザーでの問題の診断などに使用できます。 有効にするには、[**Settings > Browser**](codex://settings/browser-use) を開き、**Developer mode** で **Enable full CDP access** をオンにします。組織によってこの設定が無効にされている場合は、ローカルで有効にできません。管理者は、[`requirements.toml`](https://learn.chatgpt.com/docs/enterprise/managed-configuration#pin-feature-flags) の `[features]` にある `browser_use_full_cdp_access = false` を設定して、完全な CDP アクセスを無効にし、ChatGPT デスクトップアプリでユーザーが対応する設定を有効にできないようにすることができます。 完全な CDP アクセスによって、機密性の高いブラウザー内部情報が露出する可能性があります。ChatGPT は、完全な CDP を使用して Web サイトを調査する前に、明示的な承認を求めます。承認する前に、サイト、タスク、要求されたアクセスを確認してください。 組み込みブラウザーには `@Browser` を使用します。Chrome で開発者モードを使用するには、[Chrome 拡張機能を設定](https://learn.chatgpt.com/docs/chrome-extension)して `@Chrome` を呼び出します。 例:
This app is slow. Use @Browser to capture a performance trace and inspect
network traffic, then identify the bottleneck.