Esta tradução está em curso.

O Monitor de Rede mostra-lhe os pedidos de rede que o Firefox efetua (por exemplo, quand o este carrega uma página, ou ddevido a XMLHttpRequests), quanto tempo demora cada pedido, e detalhes de cada pedido.

Abrir o Monitor de Rede

Existem algumas maneiras diferentes de abrir o 'Monitor de Rede':

Por favor, note que o atalho de teclado foi alterado na versão 55 do Firefox

  • Pressione  CtrlShift +  E ( CommandOption +  E  num Mac).
  • Select "Network" from the Web Developer menu, (which is a submenu in the Tools menu on OS X and Linux).
  • Click the wrench icon (), which is in the main toolbar or under the Hamburger menu (), then select "Network".

The Network Monitor will appear at the bottom of the browser window. Reload the page to see the requests:

The Network Monitor records network requests any time the Toolbox is open, even if the Network Monitor itself is not selected. This means you can start debugging a page in, for example, the Web Console, then switch to the Network Monitor to see network activity without having to reload the page.

IU - Sinopse

A IU é dividida em 4 partes principais:

Barra de Ferramentas

From Firefox 47 onwards, the toolbar is at the top of the main window. In earlier versions of Firefox, it's at the bottom.

It provides:

Note: From Firefox 58 onwards, the "Flash" filter button is no longer available, and Flash requests are included in the "Others" filter (bug 1413540).

Lista de pedidos de rede

By default, the Network Monitor shows a list of all the network requests made in the course of loading the page. Each request is displayed in its own row:

By default, the Network Monitor is cleared each time you navigate to a new page or reload the current page. You can override this behavior by checking "Enable persistent logs" in the Settings.

Colunas de pedido de rede

From Firefox 55 onwards, you can toggle different columns by right-clicking on the table header and choosing the specific column from the context menu. A "Reset Columns" option is also available to reset the columns to their initial configuration. Here is a list of all available columns:

  • Status: The HTTP status code returned. This is displayed as a color-coded icon:
    • blue circle for informational (1XX codes). Notably, this includes 101 (switching protocols) for WebSocket upgrades.
    • green circle for success (2XX codes)
    • orange triangle for redirection (3XX)
    • red square for errors (4XX and 5XX)
    • hollow grey circle for responses that were fetched from the browser cache.
    The exact code is displayed immediately after the icon.
  • Method: The HTTP request method used.
  • File: The basename of the file requested.
  • Protocol: The network protocol used to transfer the data, this column is hidden by default. This is new in Firefox 55.
  • Scheme: The scheme (https/http/ftp/...) of the path requested. This column is hidden by default. This is new in Firefox 55.
  • Domain: Domain of the path requested.
    • If the request used SSL/TLS and the connection had security weaknesses such as weak ciphers, you'll see a warning triangle next to the domain. You will be able to see more details about the problem in the Security tab.
    • Hover over the domain to see the IP address.
    • There's an icon next to the domain that gives you extra information about the security status of that request. See Security icons.
  • Remote IP: The IP address of the server answering the request. This column is hidden by default. This is new in Firefox 55.
  • Cause: The reason that the network request occurred, for example XHR request, <img>, script, script requesting an image, etc. This is new in Firefox 49.
  • Type: Content-type of the response.
  • Cookies: The number of request cookies associated to the request. This column is hidden by default. This is new in Firefox 55.
  • Set-Cookies: The number of response cookies associated to the request. This column is hidden by default. This is new in Firefox 55.
  • Transferred: The number of bytes that were actually transferred to load the resource. This will be less than Size if the resource was compressed. From Firefox 47, if the resource was fetched from a service worker cache, then this cell displays "service worker".
  • Size: The size of the transferred resource.

The toolbar at the top labels these columns, and clicking the label sorts all the requests by that column.

Miniaturas de imagem

If the file is an image, the row includes a thumbnail of the image, and hovering over the filename shows a preview in a tooltip:

Ícones de segurança

The Network Monitor displays an icon in the Domain column:

This gives you extra information about the security status of the request:

Ícone Significado
HTTPS
Weak HTTPS (for example, a weak cipher was used)
Failed HTTPS (for example, a certificate was invalid)
HTTP
Localhost

For weak and failed HTTPS requests, you'll see more details of the problem in the Security tab.

Cause column

The Cause column indicates what the cause of the request was. This is usually fairly obvious, and you can generally see the correlation between this and the Type column entry. The most common values are:

  • document: The source HTML document.
  • img: <img> element.
  • imageset: <img> element.
  • script: A JavaScript file.
  • stylesheet: A CSS file.

When a request was triggered by JavaScript, a small JS icon is shown to the left of the entry in the Cause column. Hovering over this displays a popup containing the stack trace for the request, to provide more clues as to why a request happened. Note that since Firefox 55, stack traces can be found in the Stack Trace tab of the Network request details panel instead.

You can then click on any of the entries in the popup to open up the relevant script in the Debugger pane.

Barra Cronológica

The request list also displays a timeline for the different parts of each request.

Each timeline is given a horizontal position in its row relative to the other network requests, so you can see the total time taken to load the page. For more details on the color-coding used here, see the section on the Timings page.

Starting in Firefox 45, the timeline also contains two vertical lines:

  • The blue line marks the point at which the page's DOMContentLoaded event is triggered.
  • The red line marks the point at which the page's load event is triggered.

Pedidos de filtragem

You can filter requests by content type, by whether they are XMLHttpRequests or WebSocket requests, by URL, or by request properties.

Filtering by content type

To filter by content type, use the buttons in the toolbar.

Filtering XHR

To see only XHR requests, use the "XHR" button in the toolbar.

Filtering WebSockets

Novo na versão 48 do Firefox

To see only WebSocket connections, use the "WS" button in the toolbar.

To monitor the data exchanged in WebSocket connections, try the WebSocket Monitor add-on.

Filtering by URL

To filter by URL, use the search box in the toolbar. Click in the search box, or press Ctrl + F (or Cmd + F on a Mac), and start typing. The list of network requests will be filtered to include only requests that contain your filter string, in either the Domain or the File portions.

From Firefox 45,  you can filter requests that don't contain your filter string by prefixing your query with the "-" operator. For example, the query "-google.com" will show all requests that don't have "google.com" in their URL.

Filtering by properties

Novo na versão 55 do in Firefox

To filter by specific request properties, use the search box in the toolbar. The search box recognizes specific keywords, which can be used to filter the requests by specific request properties. Those keywords are followed by a colon and a related filter value. The filter values are matched case insensitive. Prepending a minus (-) negates the filter. You can combine different filters together by seperating them with a space.

Palavra-chave Significado Exemplos
status-code Shows resources that have the specific HTTP status code. status-code:304
method Shows resources that have were requested via the specific HTTP request method. method:post
domain Shows resources coming from a specifc domain. domain:mozilla.org
remote-ip Shows resources coming from a server with the specified IP. remote-ip:63.245.215.53
remote-ip:[2400:cb00:2048:1::6810:2802]
cause Shows resources matching a specific cause type. The types can be found in the description of the cause column. cause:js
cause:stylesheet
cause:img
transferred Shows resources having a specific transferred size or a transferred size close to the one specified.  k can be used as suffix for kilobytes and m for megabytes, e.g. the value 1k is equivalent to 1024. transferred:1k
size Shows resources having a specific size (after decompression) or a size close to the one specified. k can be used as suffix for kilobytes and m for megabytes, e.g. the value 1k is equivalent to 1024. size:2m
larger-than Shows resources that are larger than the specified size in bytes. k can be used as suffix for kilobytes and m for megabytes, e.g. the value 1k is equivalent to 1024. larger-than:2000
-larger-than:4k
mime-type Shows resources that match the specified MIME type. mime-type:text/html
mime-type:image/png
mime-type:application/javascript
is is:cached and is:from-cache shows only resources coming from cache.
is:running shows only resources, which are currently being transferred.
is:cached
-is:running
scheme Shows resources transferred via the given scheme. scheme:http
has-response-header Shows resources that contain the specified HTTP response header. has-response-header:cache-control
has-response-header:X-Firefox-Spdy
set-cookie-domain Shows the resources that have a Set-Cookie header with a Domain attribute that matches the specified value. set-cookie-domain:.mozilla.org
set-cookie-name Shows the resources that have a Set-Cookie header with a name that matches the specified value. set-cookie-name:_ga
set-cookie-value Shows the resources that have a Set-Cookie header with a value that matches the specified value. set-cookie-value:true
regexp Shows the resources having a URL that matches the given regular expression. regexp:\d{5}
regexp:mdn|mozilla

Context-clicking on a row in the list displays a context menu with the following options:

  • Copy URL
  • Copy URL Parameters (new in Firefox 40)
  • Copy POST Data (new in Firefox 40, only for POST requests)
  • Copy as cURL
  • Copy Request Headers (new in Firefox 40)
  • Copy Response Headers (new in Firefox 40)
  • Copy Response (new in Firefox 40)
  • Copy Image as Data URI (only for images)
  • Copy All As HAR (new in Firefox 41)
  • Save All As HAR (new in Firefox 41)
  • Save Image As (new in Firefox 55, only for images)
  • Edit and Resend
  • Open in New Tab
  • Start Performance Analysis for the page

Edit and Resend

This option opens an editor enabling you to edit the request's method, URL, parameters, and headers, and resend the request.

Open in New Tab

Resends the request in a new tab — very useful for debugging asynchronous requests.

Nota: Since Firefox 59, POST requests are correctly resent as POST requests (bug 1220758), with the expected POST parameters (bug 1407515).

Copy as cURL

This option copies the network request to the clipboard as a cURL command, so you can execute it from a command line. The command may include the following options:

-X [METHOD] If the method is not GET or POST
--data For URL encoded request parameters
--data-binary For multipart request parameters
--http/VERSION If the HTTP version is not 1.1
-I If the method is HEAD
-H

One for each request header.

From Firefox 34, if the "Accept-Encoding" header is present, the cURL command will include --compressed instead of -H "Accept-Encoding: gzip, deflate". This means that the response will be automatically decompressed.

Copy/Save All As HAR

These options create an HTTP Archive (HAR) for all requests listed. The HAR format enables you to export detailed information about network requests. 'Copy All As HAR' copies the data to the clipboard, 'Save All As HAR' opens a dialog allowing you to save the archive to disk.

Note that as of Firefox 61, we have included a toolbar menu to make these options easier to discover (bug 1403530). The new 'HAR' dropdown menu includes both the 'Copy All As HAR' and 'Save All As HAR' commands, as well as an 'Import...' option.

Detalhes do pedido de rede

Clicking on a row displays a new pane in the right-hand side of the network monitor, which provides more detailed information about the request.

The tabs at the top of this pane enable you to switch between the following pages:

  • Headers
  • Cookies
  • Params
  • Response
  • Cache
  • Timings
  • Security (only for secure pages)
  • Stack trace (only when the request has a stack trace, e.g. a script called by another script). This has been available since Firefox 55.

Clicking the icon at the right-hand end of the toolbar closes the details pane and returns you to the list view.

Cabeçalhos

This tab lists basic information about the request:

This includes:

  • Request URL
  • Request method
  • Remote IP address and port (new in Firefox 39)
  • Status code with question mark icon linking to MDN doc for more details (if available)
  • The HTTP request and response headers that were sent
  • An Edit and Resend button to edit and resend the request
  • A Raw headers button to display the raw request and response headers

You can filter the headers that are displayed:

New in Firefox 54

From Firefox 54 onwards, you will see a question mark icon next to each header in the Status code row — this is a link to more information about that particular status code, in the MDN documentation of the HTTP headers.

Cookies

This tab lists full details of any cookies sent with the request or response:

As with headers, you can filter the list of cookies displayed. The full list of cookie attributes is shown — see the below screenshot from a Response cookies examples with further attributes shown.

cookies panel in firefox devtools network monitor, showing a number of cookie attributes including samesite

The samesite attribute has been shown since Firefox 62 (bug 1452715).

Paramêtros

This tab displays the GET parameters and POST data of a request:

Resposta

The complete content of the response. If the response is HTML, JS, or CSS, it will be shown as text:

If the response is JSON, it will be shown as an inspectable object.

If the response is an image, the tab displays a preview:

Cache

If the response is cached (i.e. a 304), the Cache tab will display details about that cached resource.

These details include:

  • Last fetched: The date the resource was last fetched.
  • Fetched count: The number of times in the current session that the resource has been fetched.
  • Data size: The size of the resource.
  • Last modified: The date the resource was last modified.
  • Expires: The date the resource expires.
  • Device: The device the resource was fetched from (e.g. "disk").

HTML preview

From Firefox 59 onwards, if the response is HTML, a preview of the rendered HTML appears inside the Response tab, above the response payload.

Timings

The Timings tab breaks a network request down into the following subset of the stages defined in the HTTP Archive specification:

Nome Descrição
Blocked

Time spent in a queue waiting for a network connection.

The browser imposes a limit on the number of simultaneous connections that can be made to a single server. In Firefox this defaults to 6, but can be changed using the network.http.max-persistent-connections-per-server preference. If all connections are in use, the browser can't download more resources until a connection is released.

DNS resolution Time taken to resolve a host name.
Connecting Time taken to create a TCP connection.
Sending Time taken to send the HTTP request to the server.
Waiting Waiting for a response from the server.
Receiving Time taken to read the entire response from the server (or cache).

It presents a more detailed, annotated, view of the timeline bar for that request showing how the total wait time is split into the various stages:

Segurança

If the site is being served over HTTPS, you get an extra tab labeled "Security". This contains details about the secure connection used including the protocol, the cipher suite, and certificate details:

The Security tab shows a warning for security weaknesses. Currently it warns you about two weaknesses:

  1. Using SSLv3 instead of TLS
  2. Using the RC4 cipher

Stack trace

Since Firefox 55, stack traces are shown in the Stack Trace tab, for responses that have a stack trace of course.

Pausing and resume network traffic recording

In Firefox 58 and above, the Network Monitor has a button that pauses and resumes recording of the current page's network traffic. This is useful in situations where, for example, you are trying to get a stable view of a page for debugging purposes, but under normal circumstances the view keeps evolving due to persistent network requests. The pause button allows you to look at a certain snapshot.

The button can be found at the far left of the main Network Monitor toolbar, and looks like a typical pause button — .

You can see it here in context:

Once pressed, the button changes to a play icon, and you can toggle network traffic recording back on by pressing it again.

Análise de desempenho

The Network Monitor includes a performance analysis tool, to help show you how long the browser takes to download the different parts of your site.

To run the performance analysis tool click the stopwatch icon in the toolbar.

(Alternatively, if you have only just opened the Network Monitor, so it's not yet populated with the list of requests, you'll get a stopwatch icon in the main window.)

The Network Monitor then loads the site twice: once with an empty browser cache, and once with a primed browser cache. This simulates the first time a user visits your site, and subsequent visits. It displays the results for each run side by side, or vertically if the browser window is narrow:

The results for each run are summarised in a table and a pie chart. The tables group resources by type, and show the total size of each resource and the total time it took to load them. The accompanying pie chart shows the relative size of each resource type.

To get back to the Network Monitor's list of network requests click the "Back" button on the left.

Clicking on a slice of the pie takes you to the Network Monitor for that run, with a filter automatically applied to see only that resource type.

Throttling

In Firefox 61 onwards, the toolbar includes a Throttling dropdown, which allows you to throttle your network speed to emulate various different network speed conditions. Simply choose an option from the menu, and it will persist across reloads.

The characteristics emulated are:

  • Download speed
  • Upload speed
  • Minimum latency

The table below lists the numbers associated with each network type, but please do not rely on this feature for exact performance measurements; it's intended to give an approximate idea of the user experience in different conditions.

Seleção Velocidade de transferência Velocidade de envio Latência mínima (ms)
GPRS 50 KB/s 20 KB/s 500
Regular 2G 250 KB/s 50 KB/s 300
Good 2G 450 KB/s 150 KB/s 150
Regular 3G 750 KB/s 250 KB/s 100
Good 3G 1.5 MB/s 750 KB/s 40
Regular 4G/LTE 4 MB/s 3 MB/s 20
DSL 2 MB/s 1 MB/s 5
Wi-Fi 30 MB/s 15 MB/s 2

Etiquetas do documento e contribuidores

Contribuidores para esta página: mansil, wbamberg
Última atualização por: mansil,