【目的】
トラブルシューティングの一環で、ブラウザー内で発生したネットワークリクエストの詳細情報を必要とする場合があります。
このような時には、ブラウザーの通信履歴が含まれるHARファイルが役に立ちます。
本記事ではHARファイルを取得する方法について説明します。
【環境】
- Chrome
- Edge
- Firefox
- Safari
【対応方法】
Chrome
1.デベロッパーツールを開く(キーボードのF12キーを押す)
2.ネットワークタブのNetwork(ネットワーク)タブを選択
3.Preserve log(ログを保持)をチェック
4.Disable cache(キャッシュを無効化)をチェック
5.調査したい問題を再現させ、ネットワークタブに通信状況やグラフが表示されることを確認
6.Export HAR(ダウンロードボタン)を選択
7.ファイル名を指定して保存
Edge
1.デベロッパーツールを開く(キーボードのF12キーを押す)
2.ネットワークタブのNetwork(ネットワーク)タブを選択
3.Preserve log(ログを保持)をチェック
4.Disable cache(キャッシュを無効にする)をチェック
5.調査したい問題を再現させ、ネットワークタブに通信状況やグラフが表示されることを確認
6.Export HAR(ダウンロードボタン)を選択
7.ファイル名を指定して保存
Firefox
1.デベロッパーツールを開く(キーボードのF12キーを押す)
2.ネットワークタブのNetwork(ネットワーク)タブを選択
3.歯車アイコン／Persist logs(ログを保持)をチェック
4.Disable Cache(キャッシュを無効にする)をチェック
5.調査したい問題を再現させ、ネットワークタブに通信状況やグラフが表示されることを確認
6.歯車アイコン／Save All As HAR(HAR形式ですべて保存)を選択
7.ファイル名を指定して保存
Safari
1.デベロッパーツールを開く(キーボードのF12キーを押す)
2.ネットワークタブのNetwork(ネットワーク)タブを選択
3.Preserve Log(ログを保持)をチェック
4.Use the resource cache when loading resources(リソースの読み込み時にリソースキャッシュを使用)を押し、無視に変更
5.調査したい問題を再現させ、ネットワークタブに通信状況やグラフが表示されることを確認
6.Export(書き出す)を選択
7.ファイル名を指定して保存
＜留意事項＞
・上記は以下記事の抄訳/翻訳となります。
KB記事タイトル(英語). How to generate a HAR File, May 18, 2022, https://experienceleague.adobe.com/docs/experience-cloud-kcs/kbarticles/KA-19572.html, (参照 2022-05-20).
・本記事にいただいたコメントへの返信はお約束できません。あらかじめご了承ください。
