ブラウザのトレース情報をキャプチャする

ウェブベースの Google Cloud コンソールに関する問題を報告する際、ブラウザのトレース情報を提供していただくと、問題の理解と調査に役立ちます。このガイドでは、関連するアーティファクトをキャプチャして保存し、サポートケースで共有する方法について説明します。

レポートに含める有用な情報については、 Google Cloud コンソールの問題を報告するをご覧ください。

HAR ファイルをキャプチャする

HAR(HTTP アーカイブ)は、HTTP セッション データを記録するために使用されるファイル形式で、HTTP の問題のトラブルシューティングに役立ちます。

ブラウザを使用して HAR ファイルをキャプチャして保存する手順は次のとおりです。

Chrome

Chrome DevTools の [Network] パネルを使用します。

  1. Google Cloud コンソールで、問題が発生しているページに移動します。

  2. Chrome DevTools を開きます。ページ上の任意の場所を右クリックし、[Inspect] を選択します。

  3. DevTools パネルで、[Network] タブを選択します。ネットワーク アクティビティの記録が自動的に開始します。

  4. [Preserve log] を選択します。

  5. ネットワーク ログをクリア)をクリックします。

  6. Google Cloud コンソールで操作して、問題を再現します。

  7. 問題の再現が完了したら、HAR をエクスポート、サニタイズ済み)をクリックして、生成された HAR ファイルを保存します。

Edge

Microsoft Edge DevTools Network ツールを使用します。

  1. Google Cloud コンソールで、問題が発生しているページに移動します。

  2. Microsoft Edge DevTools を開きます。ページ上の任意の場所を右クリックし、[Inspect] を選択します。

  3. DevTools パネルで、[Network] タブを選択します。ネットワーク アクティビティの記録が自動的に開始します。

  4. [Preserve log] を選択します。

  5. ネットワーク ログをクリア)をクリックします。

  6. Google Cloud コンソールで操作して、問題を再現します。

  7. 問題の再現が完了したら、HAR をエクスポート)をクリックして、生成された HAR ファイルを保存します。

Firefox

Firefox DevTools Network Monitor を使用します。

  1. Google Cloud コンソールで、問題が発生しているページに移動します。

  2. Firefox DevTools を開きます。ページ上の任意の場所を右クリックし、[Inspect] を選択します。

  3. DevTools パネルで、[Network] タブを選択します。ネットワーク アクティビティの記録が自動的に開始します。

  4. 設定)をクリックし、[Persist Logs] を選択します。

  5. クリア)をクリックします。

  6. Google Cloud コンソールで操作して、問題を再現します。

  7. 問題の再現が完了したら、(設定)> [Save All As HAR] をクリックして、生成された HAR ファイルを保存します。

Safari

Safari Web Inspector の [Network] タブを使用します。

  1. Safari デベロッパー ツールを有効にします

  2. Google Cloud コンソールで、問題が発生しているページに移動します。

  3. Safari Web Inspector を開きます。Safari のメニューバーで、[Develop] > [Show Web Inspector] をクリックします。

  4. Web Inspector で [Network] タブを選択します。ネットワーク アクティビティの記録が自動的に開始します。

  5. [Preserve Log] を選択し、ウェブページを再読み込みします。

  6. ネットワーク項目をクリア)をクリックします。

  7. Google Cloud コンソールで操作して、問題を再現します。

  8. 問題の再現が完了したら、[Export] をクリックして、生成された HAR ファイルを保存します。

保存した HAR ファイルをサポートケースの添付ファイルとしてアップロードできます。

パフォーマンス プロファイルをキャプチャする

ページ操作やレンダリングの遅延などのパフォーマンスの問題が発生している場合は、ブラウザのパフォーマンス プロファイルを記録できます。ブラウザを使用してパフォーマンス プロファイルをキャプチャして保存する手順は次のとおりです。

Chrome

Chrome DevTools の [Performance] パネルを使用します。

  1. Google Cloud コンソールで、問題が発生しているページに移動します。

  2. Chrome DevTools を開きます。ページ上の任意の場所を右クリックし、[Inspect] を選択します。

  3. DevTools パネルで、[Performance] タブを選択します。

  4. 録画して再読み込み)をクリックし、 Google Cloud コンソールで操作して問題を再現します。

    プロファイラは、最大 10 秒間、またはバッファがいっぱいになるまで記録します。問題をキャプチャするために長いプロファイルを録画する必要がある場合は、録画)と 停止)をクリックして、録画を手動で制御できます。

  5. プロファイルの記録が完了したら、 [Save profile] > [Save trace] をクリックして、生成されたファイルを保存します。

Edge

Microsoft Edge DevTools Performance ツールを使用します。

  1. Google Cloud コンソールで、問題が発生しているページに移動します。

  2. Microsoft Edge DevTools を開きます。ページ上の任意の場所を右クリックし、[Inspect] を選択します。

  3. DevTools パネルで、[Performance] タブを選択します。

  4. プロファイリングを開始してページを再読み込み)をクリックし、 Google Cloud コンソールで操作して問題を再現します。

    プロファイラは、最大 10 秒間、またはバッファがいっぱいになるまで記録します。問題をキャプチャするために長いプロファイルを録画する必要がある場合は、録画)と 停止)をクリックして、録画を手動で制御できます。

  5. プロファイルの録音が完了したら、[ Save profile] をクリックして、生成されたファイルを保存します。

Firefox

Firefox Profiler を使用します。

  1. Firefox Profiler ポップアップを有効にします。これにより、Firefox ツールバーにプロファイラのアイコンが追加されます。

  2. Google Cloud コンソールで、問題が発生しているページに移動します。

  3. Firefox プロファイラ メニューを開きます。Firefox ツールバーで、プロファイラのアイコンの横にある矢印をクリックします。

  4. プロファイラのメニューの [Settings] フィールドで、[Web Developer] を選択します。

  5. [Start Recording] をクリックしてウェブページを再読み込みし、 Google Cloud コンソールで操作して問題を再現します。

    録画を停止するには、Firefox ツールバーのプロファイラのアイコンをクリックします。これで、Firefox プロファイラ ウェブアプリに、記録されたデータを含む新しいタブが開きます。

  6. [Upload Local Profile]、[Download] の順にクリックし、生成されたファイルを保存します。

Safari

Safari Web Inspector の [Timelines] タブを使用します。

  1. Safari デベロッパー ツールを有効にします

  2. Google Cloud コンソールで、問題が発生しているページに移動します。

  3. Safari Web Inspector を開きます。Safari のメニューバーで、[Develop] > [Show Web Inspector] をクリックします。

  4. Web Inspector で [Timelines] タブを選択します。

  5. [Stop recording once page loads] を選択します。

  6. ウェブページを再読み込みし、 Google Cloud コンソールで操作して問題を再現します。

    プロファイラは、最大 10 秒間、またはバッファがいっぱいになるまで記録します。問題をキャプチャするために長いプロファイルを録画する必要がある場合は、録画を開始)と 録画を停止)をクリックして、録画を手動で制御できます。

  7. プロファイルの録音が完了したら、[Export] をクリックして、生成されたファイルを保存します。

保存したパフォーマンス プロファイルは、サポートケースに添付ファイルとしてアップロードできます。