path: root/files/ja/tools/network_monitor/request_list/index.html

---
title: ネットワークリクエストリスト
slug: Tools/Network_Monitor/request_list
tags:
  - '110n:priority'
translation_of: Tools/Network_Monitor/request_list
---
<p>{{ToolsSidebar}}</p>

<p>ネットワークモニターのリクエストリストには、ページのロード中に行われたすべてのネットワークリクエストの一覧が表示されます。</p>

<h2 id="ネットワークリクエストリスト">ネットワークリクエストリスト</h2>

<p>デフォルトでは、ネットワークモニタにはページの読み込み中に行われたすべてのネットワークリクエストの一覧が表示されます。各リクエストはそれ自身の行に表示されます：</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/16258/Network_request_list.png" style="border: 1px solid black; display: block; height: 328px; margin: 0px auto; width: 900px;"></p>

<p>デフォルトでは、新しいページに移動するか現在のページをリロードするたびに、ネットワークモニタがクリアされます。<a href="/ja/docs/Tools/Tools_Toolbox#Common_preferences">設定</a>の [永続ログを有効にする] をオンにするとこの動作を無効にすることができます。</p>

<h3 id="ネットワークリクエスト列">ネットワークリクエスト列</h3>

<p>テーブルヘッダーを右クリックし、コンテキストメニューから特定の列を選択することによって、異なる列を切り替えることができます。"Reset Columns" オプションで初期設定に戻すこともできます。使用可能なすべての列のリストは次のとおりです。</p>

<ul>
 <li><strong>Status</strong>: 返された HTTP ステータスコード。これは、色分けされたアイコンとして表示されます。

  <ul>
   <li><img alt="" src="https://mdn.mozillademos.org/files/13136/1x.png" style="height: 17px; width: 17px;"> 情報のための青い丸 (1XXコード)。特に WebSocket のアップグレードには 101 (スイッチングプロトコル) が含まれています</li>
   <li><img alt="" src="https://mdn.mozillademos.org/files/10941/200.png" style="height: 17px; width: 17px;"> 緑の丸は成功 (2XX コード)</li>
   <li><img alt="" src="https://mdn.mozillademos.org/files/10945/300.png" style="height: 17px; width: 17px;"> オレンジの三角はリダイレクト (3XX)</li>
   <li><img alt="" src="https://mdn.mozillademos.org/files/10943/4-500.png" style="height: 17px; width: 17px;"> 赤い四角はエラー (4XX と 5XX)</li>
   <li><img alt="" src="https://mdn.mozillademos.org/files/10947/cached.png" style="height: 17px; width: 17px;"> 中空の灰色の円はブラウザのキャッシュから取得されたレスポンス。</li>
  </ul>
  正確なコードはアイコンの直後に表示されます。</li>
 <li><strong>Method</strong>: 使用された HTTP リクエストメソッド。</li>
 <li><strong>File</strong>: リクエストされたファイルのベース名。</li>
 <li><strong>Protocol:</strong> データを転送するために使用されたネットワークプロトコル。この列はデフォルトでは表示されません。これは Firefox 55 の新機能です。</li>
 <li><strong>Scheme:</strong> リクエストされたパスのスキーム (https/http/ftp/...)。 この列はデフォルトで非表示になっています。これは Firefox 55 の新機能です。</li>
 <li><strong>Domain</strong>: リクエストされたパスのドメイン。
  <ul>
   <li>リクエストに SSL/TLS を使用し、接続に弱い暗号などのセキュリティの弱点があった場合は、ドメインの横に警告の三角形が表示されます。問題の詳細は <a href="/ja/docs/Tools/Network_Monitor#Security">[セキュリティ] タブ</a>で確認できます</li>
   <li>IP アドレスを表示するにはドメインにカーソルを合わせます。</li>
   <li>ドメインの横には、そのリクエストのセキュリティステータスに関する追加情報を示すアイコンがあります。 <a href="/ja/docs/Tools/Network_Monitor#Security_icons">セキュリティアイコン</a>を参照してください。</li>
  </ul>
 </li>
 <li><strong>Remote IP</strong>: リクエストに応答しているサーバーの IP アドレス。この列はデフォルトで非表示になっています。これは Firefox 55 の新機能です。</li>
 <li><strong>Cause</strong>: XHR リクエスト、{{htmlelement("img")}}、スクリプト、画像を要求するスクリプトなど、ネットワーク要求が発生した理由。これは Firefox 49 で新しく追加されました。</li>
 <li><strong>Type</strong>: レスポンスの <code>Content-type</code></li>
 <li><strong>Cookies:</strong> リクエストに関連付けられたリクエストクッキーの数。 この列はデフォルトで非表示になっています。これは Firefox 55 の新機能です。</li>
 <li><strong>Set-Cookies:</strong> リクエストに関連付けられたレスポンスクッキーの数。この列はデフォルトで非表示になっています。これは Firefox 55 の新機能です。</li>
 <li><strong>Transferred</strong>: リソースをロードするために実際に転送されたバイト数。リソースが圧縮されている場合は <strong>Size</strong> より小さくなります。Firefox 47 から、リソースが<a href="/ja/docs/Web/API/ServiceWorker_API">サービスワーカー</a>キャッシュからフェッチされた場合、このセルには "service worker" が表示されます。</li>
 <li><strong>Size</strong>: 転送されたリソースのサイズ。</li>
</ul>

<p>上部のツールバーはこれらの列にラベルを付け、ラベルをクリックするとその列によるすべての要求がソートされます。</p>

<h4 id="イメージサムネイル">イメージサムネイル</h4>

<p>ファイルがイメージの場合、行にはイメージのサムネイルが含まれ、ファイル名の上にマウスを置くとツールチップのプレビューが表示されます。</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/16257/image_preview.png" style="border: 1px solid black; display: block; height: 334px; margin: 0px auto; width: 900px;"></p>

<h4 id="セキュリティアイコン">セキュリティアイコン</h4>

<p>ネットワークモニタは [ドメイン] 列にアイコンを表示します。</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/16194/network_message_list_63.png" style="border: 1px solid black; display: block; height: 191px; margin: 0 auto; width: 845px;"></p>

<p>これによりリクエストのセキュリティステータスに関する追加情報が得られます。</p>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">アイコン</th>
   <th scope="col">意味</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td><img alt="" src="https://mdn.mozillademos.org/files/11655/https.svg" style="height: 16px; width: 16px;"></td>
   <td>HTTPS</td>
  </tr>
  <tr>
   <td><img alt="" src="https://mdn.mozillademos.org/files/11653/https-weak.svg" style="height: 16px; width: 16px;"></td>
   <td>弱い HTTPS (例えば、弱い暗号が使用された場合)</td>
  </tr>
  <tr>
   <td><img alt="" src="https://mdn.mozillademos.org/files/11649/https-failed.svg" style="height: 16px; width: 16px;"></td>
   <td>失敗した HTTPS (たとえば、証明書が無効だった場合)</td>
  </tr>
  <tr>
   <td><img alt="" src="https://mdn.mozillademos.org/files/11651/http.svg" style="height: 16px; width: 16px;"></td>
   <td>HTTP</td>
  </tr>
  <tr>
   <td><img alt="" src="https://mdn.mozillademos.org/files/11657/localhost.svg" style="height: 16px; width: 16px;"></td>
   <td>Localhost</td>
  </tr>
  <tr>
   <td><img alt="" src="https://mdn.mozillademos.org/files/16192/tracker_icon.png" style="height: 16px; width: 16px;"></td>
   <td>URL がコンテンツブロッキングを有効にしてブロックされる既知のトラッカーに属していることを示します。</td>
  </tr>
 </tbody>
</table>

<p>弱い HTTPS リクエストと失敗した HTTPS リクエストについては、<a href="/ja/docs/Tools/Network_Monitor#Security">[セキュリティ]タブ</a>に問題の詳細が表示されます。</p>

<h4 id="原因列">原因列</h4>

<p>「原因」列には、リクエストの原因を示します。これは通常かなり明白であり、一般的にこれとタイプの列項目との間の相関を見ることができます。最も一般的な値は次のとおりです。</p>

<ul>
 <li>document: ソースHTMLドキュメント</li>
 <li>img: {{htmlelement("img")}} 要素</li>
 <li>imageset: {{htmlelement("img")}} 要素</li>
 <li>script: JavaScriptファイル</li>
 <li>stylesheet: CSSファイル</li>
</ul>

<h3 id="タイムライン">タイムライン</h3>

<p>リクエストリストには、各リクエストのさまざまな部分のタイムラインも表示されます。</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/16259/timeline.png" style="border: 1px solid black; display: block; height: 331px; margin: 0px auto; width: 900px;"></p>

<p>各タイムラインには、その行の他のネットワークリクエストに対する相対的な水平位置が与えられているため、ページのロードに要した合計時間を確認できます。ここで使用される色分けの詳細については、<a href="/ja/docs/Tools/Network_Monitor#Timings">タイミング</a>ページのセクションを参照してください。</p>

<p>Firefox 45 以降、タイムラインには 2 つの垂直線も含まれています：</p>

<ul>
 <li><span style="color: blue;">青い</span>線はページの <code><a href="/ja/docs/Web/Events/DOMContentLoaded">DOMContentLoaded</a></code> イベントがトリガーされるポイントを示します</li>
 <li><span style="color: red;">赤い</span>線はページのロードイベントがトリガーされるポイントを示します</li>
</ul>

<h3 id="リクエストのフィルタリング">リクエストのフィルタリング</h3>

<p>リクエストをコンテンツタイプ、XMLHttpRequests リクエスト、WebSocket リクエスト、URL、リクエストプロパティ別のいずれかでフィルタリングできます。</p>

<h4 id="コンテンツタイプによるフィルタリング">コンテンツタイプによるフィルタリング</h4>

<p>コンテンツタイプ別にフィルタリングするには、<a href="/ja/docs/Tools/Network_Monitor#Toolbar">ツールバー</a>のボタンを使用します。</p>

<h4 id="XHRのフィルタリング">XHRのフィルタリング</h4>

<p>{{Glossary("XHR (XMLHttpRequest)", "XHR")}} のみを表示するには、<a href="/ja/docs/Tools/Network_Monitor#Toolbar">ツールバー</a>の "XHR" ボタンを使用します。</p>

<h4 id="WebSocketsのフィルタリング">WebSocketsのフィルタリング</h4>

<p>WebSocket接続のみを表示するには、<a href="/ja/docs/Tools/Network_Monitor#Toolbar">ツールバー</a>の "WS" ボタンを使用します。</p>

<p>WebSocket 接続で交換されるデータを監視するには、<a href="https://addons.mozilla.org/ja/firefox/addon/websocket-monitor/">WebSocket Monitor アドオン</a>を試してください。</p>

<h4 id="URLによるフィルタリング">URLによるフィルタリング</h4>

<p>URL でフィルタリングするには、<a href="/ja/docs/Tools/Network_Monitor#Toolbar">ツールバー</a>の検索ボックスを使用します。検索ボックスの中をクリックするか、あるいは <kbd>Ctrl</kbd> + <kbd>F</kbd> (または Mac の場合は <kbd>Cmd</kbd> + <kbd>F</kbd> )を押して、入力を開始します。ネットワークリクエストのリストは、フィルタ文字列を含むリクエストのみをドメインまたはファイルの部分に含めるようにフィルタリングされます。</p>

<p>Firefox 45 では、クエリ文字列に "-" 演算子をつけることでフィルタ文字列を含まないリクエストをフィルタリングできます。たとえば、"-google.com" というクエリでは、URL に "google.com" がないすべてのリクエストが表示されます。</p>

<h4 id="プロパティによるフィルタリング">プロパティによるフィルタリング</h4>

<p>特定のリクエストプロパティでフィルタリングするには、<a href="/ja/docs/Tools/Network_Monitor">ツールバー</a>の検索ボックスを使用します。検索ボックスは特定のキーワードを認識し、特定のリクエストプロパティによってリクエストをフィルタリングするために使用できます。これらのキーワードの後にコロンと関連するフィルター値が続きます。フィルター値は大文字と小文字を区別しません。マイナス (<code>-</code>) を前に付けると、フィルタは無効になります。異なるフィルタをスペースで区切って組み合わせることができます。</p>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">キーワード</th>
   <th scope="col">意味</th>
   <th scope="col">例</th>
  </tr>
  <tr>
   <td><code>status-code</code></td>
   <td>特定の HTTP ステータスコードを持つリソースを表示します。</td>
   <td><code>status-code:304</code></td>
  </tr>
  <tr>
   <td><code>method</code></td>
   <td>特定の HTTP リクエストメソッドを介して要求されたリソースを表示します。</td>
   <td><code>method:post</code></td>
  </tr>
  <tr>
   <td><code>domain</code></td>
   <td>特定のドメインからのリソースを表示します。</td>
   <td><code>domain:mozilla.org</code></td>
  </tr>
  <tr>
   <td><code>remote-ip</code></td>
   <td>指定された IP を持つサーバーからのリソースを表示します。</td>
   <td><code>remote-ip:63.245.215.53</code><br>
    <code>remote-ip:[2400:cb00:2048:1::6810:2802]</code></td>
  </tr>
  <tr>
   <td><code>cause</code></td>
   <td>特定の原因タイプに一致するリソースを表示します。 タイプは、<a href="/ja/docs/Tools/Network_Monitor/request_list#Cause_column">原因列</a>の説明に記載されています。</td>
   <td><code>cause:js</code><br>
    <code>cause:stylesheet<br>
    cause:img</code></td>
  </tr>
  <tr>
   <td><code>transferred</code></td>
   <td>特定の転送サイズまたは転送サイズが指定されたサイズに近いリソースを示します。<code>k</code> はキロバイトの接尾辞として、<code>m</code> はメガバイトに使用できます。例えば <code>1k</code> の値は <code>1024</code> に相当します。</td>
   <td><code>transferred:1k</code></td>
  </tr>
  <tr>
   <td><code>size</code></td>
   <td>
    <p>特定のサイズ (圧縮解除後) または指定されたサイズに近いサイズのリソースを表示します。<code>k</code> はキロバイトの接尾辞として、<code>m</code> はメガバイトに使用できます。<code>1k</code> の値は <code>1024</code> に相当します。</p>
   </td>
   <td><code>size:2m</code></td>
  </tr>
  <tr>
   <td><code>larger-than</code></td>
   <td>指定したサイズ (バイト単位) を超えるリソースを表示します。<code>k</code> はキロバイトの接尾辞として、<code>m</code> はメガバイトに使用できます。<code>1k</code> の値は <code>1024</code> に相当します。</td>
   <td><code>larger-than:2000</code><br>
    <code>-larger-than:4k</code></td>
  </tr>
  <tr>
   <td><code>mime-type</code></td>
   <td>指定された MIME タイプに一致するリソースを表示します。</td>
   <td><code>mime-type:text/html</code><br>
    <code>mime-type:image/png</code><br>
    <code>mime-type:application/javascript</code></td>
  </tr>
  <tr>
   <td><code>is</code></td>
   <td><code>is:cached</code> および <code>is:from-cache</code> はキャッシュから来るリソースのみを示します。<br>
    <code>is:running</code> は現在転送中のリソースのみを表示します。</td>
   <td><code>is:cached</code><br>
    <code>-is:running</code></td>
  </tr>
  <tr>
   <td><code>scheme</code></td>
   <td>指定されたスキームを介して転送されたリソースを表示します。</td>
   <td><code>scheme:http</code></td>
  </tr>
  <tr>
   <td><code>has-response-header</code></td>
   <td>指定された HTTP レスポンスヘッダを含むリソースを表示します。</td>
   <td><code>has-response-header:cache-control</code><br>
    <code>has-response-header:X-Firefox-Spdy</code></td>
  </tr>
  <tr>
   <td><code>set-cookie-domain</code></td>
   <td>指定された値と一致する <code>Domain</code> 属性を持つ <code>Set-Cookie</code> ヘッダを持つリソースを表示します。</td>
   <td><code>set-cookie-domain:.mozilla.org</code></td>
  </tr>
  <tr>
   <td><code>set-cookie-name</code></td>
   <td>指定された値と一致する名前を持つ <code>Set-Cookie</code> ヘッダを持つリソースを表示します。</td>
   <td><code>set-cookie-name:_ga</code></td>
  </tr>
  <tr>
   <td><code>set-cookie-value</code></td>
   <td>指定された値と一致する値を持つ <code>Set-Cookie</code> ヘッダを持つリソースを表示します。</td>
   <td><code>set-cookie-value:true</code></td>
  </tr>
  <tr>
   <td><code>regexp</code></td>
   <td>指定された {{Glossary("regular expression")}} と一致する URL を持つリソースを表示します。</td>
   <td><code>regexp:\d{5}<br>
    regexp:mdn|mozilla</code></td>
  </tr>
 </thead>
</table>

<h3 id="コンテキストメニュー">コンテキストメニュー</h3>

<p>リスト内の行の"コンテキストクリック"は、次のオプションを含むコンテキストメニューを表示します。</p>

<ul>
 <li>Copy URL</li>
 <li>Copy URL Parameters</li>
 <li>Copy POST Data (only for POST requests)</li>
 <li>Copy as cURL</li>
 <li>Copy Request Headers</li>
 <li>Copy Response Headers</li>
 <li>Copy Response</li>
 <li>Copy Image as Data URI (only for images)</li>
 <li>Copy All As HAR</li>
 <li>Save All As HAR</li>
 <li>Save Image As (only for images)</li>
 <li>Edit and Resend</li>
 <li>Open in New Tab</li>
 <li>Start <a href="/ja/docs/Tools/Network_Monitor#Performance_analysis">Performance Analysis</a> for the page</li>
</ul>

<h4 id="Edit_and_Resend">Edit and Resend</h4>

<p>このオプションを使用すると、リクエストのメソッド、URL、パラメータ、およびヘッダーを編集し、リクエストを再送信できるエディタが開きます。</p>

<h4 id="新規タブで開く">新規タブで開く</h4>

<p>リクエストを新しいタブで再送信します。非同期リクエストのデバッグには非常に便利です。</p>

<h4 id="Copy_as_cURL">Copy as cURL</h4>

<p>このオプションはネットワークリクエストを cURL コマンドとしてクリップボードにコピーするので、コマンドラインから実行することができます。 このコマンドには、次のオプションが含まれます。</p>

<table class="standard-table">
 <tbody>
  <tr>
   <td><code>-X [METHOD]</code></td>
   <td>メソッドが GET または POST でない場合</td>
  </tr>
  <tr>
   <td><code>--data</code></td>
   <td>URL エンコードされたリクエストパラメータ</td>
  </tr>
  <tr>
   <td><code>--data-binary</code></td>
   <td>マルチパートリクエストパラメータの場合</td>
  </tr>
  <tr>
   <td><code>--http/VERSION</code></td>
   <td>HTTP バージョンが 1.1 でない場合</td>
  </tr>
  <tr>
   <td><code>-I</code></td>
   <td>メソッドが HEAD の場合</td>
  </tr>
  <tr>
   <td><code>-H</code></td>
   <td>
    <p>各リクエストヘッダーごとに1つ。</p>

    <p>Firefox 34から、"Accept-Encoding" ヘッダが存在する場合、cURL コマンドに <code>-H "Accept-Encoding: gzip, deflate"</code> の代わりに <code>--compressed</code> が含まれます。これは、レスポンスが自動的に解凍されることを意味します。</p>
   </td>
  </tr>
 </tbody>
</table>

<h4 id="CopySave_All_As_HAR">Copy/Save All As HAR</h4>

<p>これらのオプションはリストされたすべての要求に対して HTTP アーカイブ (HAR) を作成します。HAR 形式を使用すると、ネットワークリクエストに関する詳細情報をエクスポートできます。'Copy All As HAR' はデータをクリップボードにコピーし、'Save All As HAR' はアーカイブをディスクに保存するダイアログを開きます。</p>

<p>Firefox 61 以降では、これらのオプションを簡単に発見できるようにツールバーメニューを追加しました ({{bug(1403530)}})。新しい 'HAR' ドロップダウンメニューには、'Copy All As HAR' コマンドと 'Save All As HAR' コマンドの両方と、'Import...' オプションがあります。</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/16056/har-dropdown.png" style="border-style: solid; border-width: 1px; height: 262px; width: 723px;"></p>