HARデータの収集方法

概要

HARデータはウェブサイトおよびウェブページの接続性の問題をトラブルシューティングする際の非常に貴重なツールです。 これは、ウェブブラウザとサーバーの接続に関する貴重なインサイトを提供し、潜在的な根本原因を特定するための重要な情報を提供します。

この記事では、一般的に使用されるブラウザでHARデータをキャプチャする方法についての概要を提供します。

環境

Google Chrome

Mozilla Firefox

Microsoft Edge

Apple Safari

手順

このセクションでは、WindowsとMacで一般的に使用されるいくつかのブラウザでHARデータをキャプチャする方法を説明します。

Google Chrome:

  1. コンピュータでGoogle Chromeを開きます。

  2. HARデータをキャプチャしたいウェブページまたはウェブサイトにアクセスします。

  3. ページ上の任意の場所で右クリックし、コンテキストメニューから「検査」を選択します。 または、キーボードショートカットCtrl + Shift + I(MacではCommand + Option + I)を使用することもできます。

  4. これにより、Chrome Developer Toolsパネルが開きます。 開発者ツール内の「ネットワーク」タブにいることを確認してください。

  5. 開発者ツールパネルの左上隅にある「記録」ボタン(小さな円)をクリックします。 ネットワークリクエストが記録されていることを示すために赤色に変わります。

  6. ウェブページと対話し、実行したいアクションやキャプチャしたい接続性の問題を再現します。

  7. 問題を再現したり、必要なデータを収集したら、開発者ツールパネルで「停止」ボタン(小さな四角)をクリックします。 ネットワークアクティビティの記録を停止します。

  8. キャプチャされたネットワークリクエストとデータをネットワークタブ内で確認できます。 必要に応じてリクエストをフィルタリング、並べ替え、分析することができます。

  9. キャプチャしたデータをHARファイルとして保存するには、ツールバーのダウンロードボタン(HARをエクスポート)をクリックします。 HARファイルを保存する適切な場所を選び、それに適切な名前を付けてください。

Mozilla Firefox:

  1. コンピュータでMozilla Firefoxを開きます。

  2. HARデータをキャプチャしたいウェブページまたはウェブサイトにアクセスします。

  3. ページ上の任意の場所で右クリックし、コンテキストメニューから「要素を検査」を選択します。 または、キーボードショートカット Ctrl + Shift + I (Macでは Command + Option + I) を使用することができます。

  4. これにより、Firefoxの開発者ツールパネルが開きます。 開発者ツール内で「ネットワーク」タブにいることを確認してください。

  5. 録画は自動的に開始されるはずです。

  6. ウェブページと対話し、キャプチャしたい接続性の問題を行ったり再現してください。

  7. 問題を再現したり、必要なデータを集めたら、ネットワークタブ内で右クリックして "すべてをHARとして保存" を選択し、データをHARファイルとして保存します。 HARファイルを保存する適切な場所を選び、適切な名前を付けてください。

Microsoft Edge:

  • コンピュータで Microsoft Edge を開いてください。

  • HARデータをキャプチャしたいウェブページまたはウェブサイトにアクセスします。

  • ページ上の任意の場所を右クリックし、コンテキストメニューから"検査"を選択します。 また、キーボードショートカット Ctrl + Shift + I (Macでは Command + Option + I) を使用することができます。

  • これにより、Microsoft Edge の開発者ツールパネルが開きます。 開発者ツール内で「ネットワーク」タブにいることを確認してください。

  • 開発者ツールパネルの左上にある「録画」ボタン(小さな円)をクリックしてください。 ネットワークリクエストが記録されることを示すために、それが赤色に変わるはずです。

  • ウェブページと対話し、キャプチャしたい接続性の問題を行ったり再現してください。

  • 問題を再現したり、必要なデータを集めたら、開発者ツールパネルで「停止」ボタン(小さな四角)をクリックしてください。 これにより、ネットワークアクティビティの記録が停止します。

  • これで、ネットワークタブ内のキャプチャしたネットワークリクエストとデータを探索できます。 必要に応じて、リクエストをフィルター、並べ替え、分析することができます。

  • キャプチャしたデータをHARファイルとして保存するには、ネットワークタブ内で右クリックし、「コピー」オプションにカーソルを合わせ、「すべてをHAR(機密データを含む)としてコピー」を選択してください。 HARファイルを保存する適切な場所を選び、適切な名前を付けてください。

Apple Safari:

  1. お使いのMacコンピュータでSafariを開いてください。

  2. HARデータをキャプチャするウェブページまたはウェブサイトにアクセスしてください。

  3. Safariで開発メニューが表示されていない場合は、有効化してください。 これを行うには、Safari > 設定 に移動します。 設定ウィンドウで「高度な設定」タブをクリックし、「メニューに表示開発メニューを表示」オプションを選択します。
    developmenu.jpg

  4. 開発メニューが有効になったら、メニューバーの開発メニューに移動して「Webインスペクターを表示」を選択します
    webinspector.jpg

  5. これにより、SafariのWebインスペクターパネルが開きます。 Webインスペクター内の「ネットワーク」タブにいることを確認してください。

  6. ウェブページと対話し、実行するアクションまたはキャプチャしたい接続性の問題を再現します。
  7. ネットワークタブ内のキャプチャされたネットワーク要求とデータを探索できます。 必要に応じてリクエストをフィルタ、並べ替え、分析することができます。
  8. キャプチャされたデータをHARファイルとして保存するには、名前列の下で任意の位置を右クリックし、「HARエクスポート」を選択します。HARファイルを保存する適切なロケーションを選択し、適切な名前を付けてください。

この記事は役に立ちましたか?

3人中2人がこの記事が役に立ったと言っています

0件のコメント