トラブルシューティングのためにHARファイルやコンソールログを取得する方法

他にご質問がございましたら、リクエストを送信してください

HARファイルやコンソールログを作成することは、トラブルシューティングにおいて非常に役立ちます。「Via Support」では、技術的な問題のトラブルシューティングを行うために、HARファイルやコンソールログのスクリーンショットをリクエストする場合があります。以下に、これらのファイルを取得する方法について詳しく説明します。

HARファイルとは何ですか?

HAR(HTTP Archive)ファイルは、ウェブブラウザとウェブサイトとのやり取りを記録したものです。弊社では、サイト上で行われた特定の操作を調査するためにこれらのファイルを使用しており、問題を再現しようとする際に役立ちます。

コンソールログとは何ですか?

ブラウザのコンソールログとは、ウェブサイトやブラウザ自体によって生成されるイベント、エラー、および情報メッセージの記録のことです。これらのログは、サイト上で行われた操作に関する詳細を明らかにするのに役立ちます。

HARファイルおよびコンソールログの生成手順

これらの詳細情報を収集する方法については、お使いのブラウザによって異なります。以下のリストから、お使いのブラウザに該当する手順をご確認ください。

Google Chrome

ChromeでのHARファイルの作成

  1. Chromeを開き、問題が発生するページにアクセスしてください。
  2. ⋮ボタンを探し、「その他のツール」>「開発者ツール」を選択してください。
  3. パネルから「ネットワーク」タブを選択してください。問題を再現している間は、このメニューを開いたままにしておく必要があります。
  4. タブの左上隅にある丸い記録ボタンを探し、そのボタンが赤色になっていることを確認してください。灰色になっている場合は、ボタンを 1 回クリックして記録を開始してください。
  5. 「ログを保持する」チェックボックスにチェックを入れます。
  6. 灰色の×印のついた円形のボタンをクリックして、[ネットワーク] タブから既存のログを消去してください。
  7. ページを更新し、ネットワークリクエストが記録されている状態で問題を再現してください。
  8. ダウンロードボタン「HARをエクスポート」をクリックし、ファイルをダウンロードしてコンピュータに保存してください:「HARとして(コンテンツを含む)保存」を選択してください。

    Download button from the network tab in Chrome
  9. 詳細な調査のため、HARファイルをリクエストにアップロードしてください。
Animation showing how to generate a HAR file in Chrome

Chrome でコンソールログを取得する

  1. Chromeのメインメニューを開きます。
  2. [その他のツール] > [開発者ツール] の順に選択します。
  3. コンソール」タブを開き、エラーがあればスクリーンショットを撮影してください。

Chromeでのファイル生成に関する問題については、Webセッションのトラフィックをキャプチャしてください。

バイト数が 0 の空の HAR ファイルが生成される場合は、「機密データを含む HAR のエクスポート」を有効にしてください。

機密データを含むHARエクスポートを有効にする

  1. Chrome を開いてください。
  2. ⋮ ボタンを探し、「その他のツール」>「開発者ツール」を選択してください。
  3. [設定] > [ネットワーク] をクリックします。
  4. [HAR の生成を許可(機密データを含む)] チェックボックスを選択してください。
  5. [ネットワーク] パネルに戻り、矢印の付いた [エクスポート] ボタンを長押しします。
  6. ドロップダウンメニューから [HAR をエクスポート(機密データを含む)] を選択してください。Inspect and export HAR data from Google Chrome.gif

Microsoft Edge

Edge での HAR ファイルの生成

  1. Edge を開き、[ネットワーク] ツールに移動します。
  2. ページを更新し、ネットワークリクエストが記録されている間に問題を再現してください。
  3. キャプチャされたトラフィックをHARファイルとしてエクスポートしてください。
  4. 詳細な調査のため、HARファイルをリクエストにアップロードしてください。

Edgeでのファイル生成に関する問題については、「ネットワークアクティビティの検査」ツールをご利用ください。

Edge でのコンソールログの取得

  1. ブラウザウィンドウの右上隅にある3つのドットを選択してください。
  2. [その他のツール] > [開発者ツール] をクリックします。
  3. DevTools パネルで、「コンソール」タブをクリックします。
  4. コンソールを右クリックし、「既存のログをすべて消去」を選択してください。
  5. [ログを保持する] チェックボックスにチェックを入れます。
  6. ページを更新し、Edge ブラウザで問題を再現してください。
  7. エラーが発生した場合は、そのスクリーンショットを撮影してください。

Firefox

Firefox での HAR ファイルの作成

  1. Firefox を開き、問題が発生するページにアクセスしてください。
  2. ネットワークモニターを開いてください。
  3. ページを更新し、ネットワークリクエストが記録されている間に問題を再現してください。
  4. 「ファイル」列の任意の場所を右クリックし、「すべてをHARとして保存」をクリックします。

    Save All As HAR in Firefox
  5. HARファイルを適切な場所に保存してください。
  6. 詳細な調査のため、HARファイルをリクエストにアップロードしてください。

 

Firefoxでのファイル生成に関する問題については、ネットワークモニターツールをご利用ください。

 

Firefox でコンソールログを取得する

  1. [ツール] メニューから [Web 開発者] を選択してください。
  2. コンソールログが別のウィンドウに表示されます。
  3. エラーがあればスクリーンショットを撮ってください。

Safari

SafariでのHARファイルの作成

  1. Safari を開き、「開発」メニューに移動します。「開発」メニューが表示されない場合は、「Mac の Safari で開発」メニューの開発者ツールを使用する」の手順に従ってください。
  2. 「Web インスペクタを表示」を選択してください。
  3. ネットワーク」タブをクリックしてください。問題を再現している間は、このタブを開いたままにしておく必要があります。
  4. ページを更新し、ネットワークリクエストが記録されている間に問題を再現してください。
  5. エクスポート」アイコンをクリックし、HARファイルを保存してください。 

    Safari export logs
  6. 詳細な調査のため、HARファイルをリクエストにアップロードしてください。

Safariでのファイル生成に関する問題については、Web Inspectorツールをご利用ください。

Safariでのコンソールログの取得

  1. 「環境設定」を開き、「詳細」タブに移動してください。
  2. 「メニューバーに『開発者』メニューを表示」を選択してください。
  3. 「環境設定」を閉じてください。
  4. メニューバーから、「開発」>「エラーコンソールを表示」を選択してください。
  5. エラーが発生した場合はスクリーンショットを撮ってください。

それでも解決しない場合は?

お探しの情報が見つからない場合は、お気軽にお問い合わせください!リクエストを送信していただければ、サポートチームが可能な限り早くご連絡いたします。

この記事は役に立ちましたか?
0人中0人がこの記事が役に立ったと言っています