Browser

Browser

ChatGPT に Web サイトの調査と操作を任せる

ブラウザーを使うと、ユーザーが主導権を保ちながら、ChatGPT がウェブサイトを開き、最新情報を集め、操作を実行できます。選択肢の比較、ウェブサイト上での複数ステップのタスクの実行、作成中のページの確認に利用できます。

Browser は、Web 版 ChatGPT と ChatGPT デスクトップアプリで利用できます。

GPT-6 Astra は、ページとスクリーンショットの照合や、複数サイトにまたがるワークフローの完了などのタスクにおける視覚的な判断能力を向上させます。モデルセレクターで利用できる場合は選択し、完了結果の検証方法を説明してください。

管理対象のデスクトップ環境では、管理者がブラウザーのオリジン、アップロード、ダウンロード、開発者アクセスを制限できます。詳しくは、管理対象ブラウザーのコントロールをご覧ください。

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

ChatGPT デスクトップアプリの組み込みブラウザーでは、チャット内の Web サイトとローカル Web アプリをユーザーと ChatGPT が同じ画面で確認できます。ページのプレビュー、視覚的なフィードバックの追加、またはユーザーに代わる ChatGPT のサイト操作に使用します。

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

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

ChatGPT が既存の Chrome、Edge、Brave、Opera、Vivaldi のタブで作業する必要がある場合や、通常のブラウザープロファイルを使用する必要がある場合は、代わりに ブラウザー拡張機能 を使用します。

新しいタブ を選択し、URL を入力すると内蔵ブラウザーが開きます。また、チャット内の URL を開くか、Cmd+T (Windows と Linux では Ctrl+T)を押して、ブラウザーのタブを開くこともできます。

タブとチャットを配置する

全体表示に切り替え を選択すると現在のタブが広がり、分割表示に切り替え を選択するとチャットとタブが横に並びます。Cmd+Shift+B (Windows と Linux では Ctrl+Shift+B)を使うと、全体表示から分割表示に戻ったり、チャットの横のタブの表示と非表示を切り替えたりできます。

アドレスバーから検索する

組み込みブラウザーのアドレスバーに入力し始めると、その閲覧履歴からページを検索できます。一致するページを選択して再度開くか、履歴に一致する結果がない場合は、検索語を入力して Google で検索します。

組み込みブラウザーは独自のプロファイルと閲覧履歴を保持します。通常の Chrome プロファイルやその他のブラウザーにあるページが結果に自動的に含まれることはありません。

閲覧履歴を管理する

Settings > Browser を開くと、組織で許可されている場合、組み込みブラウザーの履歴の検索、訪問済みページの再表示、履歴項目の削除を行えます。 Clear browsing data を使用して、削除する閲覧データの期間と種類を選択します。

利用可能な場合、ChatGPT は現在のタスクに関連するページを探すために、閲覧履歴の検索許可を求めることがあります。アクセスを許可する前にリクエストを確認してください。閲覧履歴には、内部 URL、検索語、その他のセンシティブな情報が含まれる可能性があるため、タスクでそのコンテキストが必要な場合にのみ許可してください。

ブラウザーでの Computer Use

デスクトップアプリでは、Computer Use により、ChatGPT Work または Codex が組み込みブラウザーを直接操作できます。選択した機能は、ページを開き、クリックや入力を行い、レンダリングされた状態を検査し、スクリーンショットを撮影して、ページ上で作業結果を検証できます。

ブラウザーはデスクトップアプリに含まれており、自動的にインストールされます。ChatGPT または Codex に、タスクで内蔵ブラウザーを使用するよう依頼するか、 @Browser で直接指定してください。

例:

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

設定 > ブラウザー > エージェントの権限 で、閲覧、ダウンロード、アップロードのデフォルトの権限を選択し、特定のウェブサイトに例外を追加します。サイトのカスタム権限を削除すると、デフォルトに戻ります。組織によっては、これらの設定が制限されることがあります。ChatGPT はまた、情報の送信、購入、権限の変更、データの削除などの慎重さを要する操作の前に、確認を求めます。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. ブラウザーのツールバーで 注釈 を選択し、注釈モード に入ります。
  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.

スタイルに関するフィードバック

ページの一部に注釈を追加するときは、テキスト入力欄の横にある 調整 を選択すると、スタイルについてより細かなフィードバックを ChatGPT に伝えられます。フォント、テキスト、間隔、色などの値を変更してページ上で結果をプレビューし、目指す仕上がりをより明確にしたうえで注釈を送信できます。

ブラウザータスクの範囲を限定する

各ブラウザータスクは、1 回で確認できる程度の小さな範囲に収めます。

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

リポジトリの変更については、レビューペイン を使用して変更を確認し、コメントを追加します。

Developer mode

Developer mode は、Chrome および組み込みブラウザーの Computer Use と連携します。 ChatGPT に Chrome DevTools Protocol (CDP) への制御されたアクセスを提供します。JavaScript のプロファイリング、コンソール出力やネットワークトラフィックの検査、DOM と適用済みスタイルの確認、または稼働中のブラウザーでの問題の診断に使用します。

有効にするには、Settings > Browser を開き、 Developer mode で Enable full CDP access をオンにします。組織でこの設定が無効になっている場合、ローカルでは有効にできません。管理者はrequirements.toml の [features] で browser_use_full_cdp_access = false を設定すると、完全な CDP アクセスを無効にし、ChatGPT デスクトップアプリで対応する設定をユーザーが有効にできないようにできます。

完全な CDP アクセスによって、ブラウザー内部のセンシティブな情報が公開される可能性があります。ChatGPT は、完全な CDP を使用して Web サイトを検査する前に、明示的な承認を求めます。承認する前に、サイト、タスク、要求されたアクセスを確認してください。

組み込みブラウザーには @Browser を使用します。Chrome で Developer mode を使用するには、Chrome 拡張機能を設定し、@Chrome を呼び出します。

例:

This app is slow. Use @Browser to capture a performance trace and inspect
network traffic, then identify the bottleneck.