開発者ツール（DevTools）での確認方法
エラーや不具合のお問い合わせ時に、サポートチームから確認をお願いすることがあります。
本記事の手順に沿って、該当するデータを取得・共有してください。
サポートから依頼された内容を確認してください
| コンソールログ | → セクション1・2 をご確認ください |
| ネットワーク通信 | → セクション1・3 をご確認ください |
| HARファイル | → セクション1・4 をご確認ください |
事前準備：エラーが発生する画面、またはエラーとなる操作を行う画面を開いた状態で、以下の手順を進めてください。
1. 開発者ツールを起動する
以下のいずれかの方法で開発者ツールを開きます。
方法A：ショートカットキーで開く（推奨）
| Windows | F12 または Ctrl + Shift + I |
| Mac | Command + Option + I |
方法B：メニューから開く
- 画面右上の 「︙」（その他アイコン）をクリック
- 「その他のツール」 → 「デベロッパー ツール」を選択
画面の右側または下部に開発者ツールのパネルが表示されます。
2. コンソールログを保存する
コンソールにはエラーメッセージや警告が表示されます。
以下の手順でログをファイルとして保存し、サポートチームに共有してください。
手順
- 開発者ツール上部の 「Console」タブをクリック
- 赤色のエラーメッセージや黄色の警告が表示されていることを確認
- コンソール内のログ表示エリア（メッセージが表示されている部分）を右クリック
- 表示されたメニューから 「名前を付けて保存...」（Save as...）を選択
- ファイル名はそのままで、任意の場所に .log ファイルを保存
保存した .log ファイルを、お問い合わせの返信メールに添付してサポートチームに共有してください。
3. ネットワーク通信を確認する
ネットワークタブでは、ブラウザとサーバー間の通信状況を確認できます。
通信エラー（赤く表示される行）がある場合、その情報が原因特定に役立ちます。
手順
- 開発者ツール上部の 「Network」タブをクリック
- Networkタブを開いた状態で、エラーが発生する操作を再度実行（またはページを再読み込み）
※ Networkタブを開く前の通信は記録されません。必ず開いた後に操作してください。
- 通信の一覧が表示されます。赤色で表示されている行がエラーです
- 赤い行が含まれた状態の画面のスクリーンショットを撮影して共有してください
スクリーンショットの撮影方法
| Windows | Windows + Shift + S で範囲を選択 |
| Mac | Command + Shift + 4 で範囲を選択 |
4. HARファイルを保存する
HARファイルは、ネットワーク通信の詳細なログを記録したファイルです。
サポートチームがより詳しく原因を調査するために必要になることがあります。
※ セクション3のネットワーク確認と同じ「Network」タブを使用します。
手順
- 「Network」タブを開いた状態で、エラーが発生する操作を再度実行
- 通信ログが記録されたことを確認
- 上部のダウンロードマークからダウンロード
- 任意の場所に .har ファイルを保存し、サポートチームに共有してください
HARファイルに関する注意
HARファイルにはアクセスしたURLや通信内容が含まれます。共有先はサポートチームのみとし、他の方への転送はお控えください。
データの共有方法
取得したファイル（.log / スクリーンショット / .har）を、お問い合わせの返信メールに添付して送信してください。
ご不明な点がございましたら、サポートチームまでお気軽にお問い合わせください。
お問い合わせフォームはこちら