Utilizza il riquadro Network per analizzare il caricamento della pagina e ispezionare le risorse di rete.
Panoramica
Il riquadro Rete ti consente di:
- Registrare l'attività di rete
- Esaminare le richieste di rete
- Filtrare e ordinare le richieste di rete
- Intestazioni e risposte della rete di ricerca
- Modificare il comportamento di caricamento
- Bloccare le richieste di rete
- Modificare le condizioni di rete
- Eseguire il debug delle regole di speculazione
prefetch - Sostituire le intestazioni di risposta HTTP
- Sostituisci le intestazioni per più URL con caratteri jolly.
- Salvare ed esportare i dati delle richieste di rete
Consulta Esaminare l'attività di rete per un tutorial guidato che illustra alcune delle funzionalità più utilizzate del riquadro Rete.
Apri il riquadro Rete
Per aprire il riquadro Rete, apri DevTools e fai clic su Rete nella barra delle azioni in alto.
In alternativa, per aprire il riquadro Rete tramite il menu Comando:
- Apri DevTools.
- Apri il menu Comando premendo:
- macOS: Comando+Maiusc+P
- Windows, Linux, ChromeOS: Control+Maiusc+P
- Inizia a digitare
Network, seleziona Mostra pannello della rete e premi Invio.
Registra l'attività di rete
Quando apri DevTools, le richieste di rete vengono registrate automaticamente nel riquadro Rete, a condizione che DevTools sia aperto.
Oltre a registrare, puoi:
- Interrompi la registrazione delle richieste di rete.
- Cancella tutte le richieste dalla tabella Richieste.
- Salva le richieste tra i caricamenti di pagina.
- Emula un'esperienza offline.
- Simula connessioni di rete più lente.
Controllare le richieste di rete
Tutte le richieste di rete vengono registrate nella tabella Richieste al centro del riquadro.
Per scoprire di più sulle colonne visualizzate per impostazione predefinita e su quelle aggiuntive che puoi aggiungere, consulta Visualizzare un log delle richieste.
Fai clic sul nome di una richiesta per visualizzare le schede con ulteriori informazioni sulla richiesta, tra cui:
- Intestazioni: le intestazioni HTTP della risorsa selezionata.
- Payload: i parametri della stringa di query e i dati del modulo di una richiesta.
- Anteprima: un rendering di base del codice HTML.
- Risposta: il codice sorgente HTML della risorsa selezionata.
- Initiator: indica cosa ha causato la richiesta di una risorsa.
- Tempi: un'analisi dettagliata dell'attività di rete per la risorsa selezionata.
- Cookie: cookie di una richiesta e della relativa risposta.
Filtrare e ordinare le richieste di rete
Il riquadro Rete ti offre due modi per ordinare le richieste nella tabella Richieste:
Di seguito sono riportati diversi modi per filtrare le richieste nella tabella Richieste:
- Filtrare le richieste per proprietà
- Filtrare le richieste per tipo
- Filtrare le richieste in base all'ora
- Nascondere gli URL dati
- Nascondere gli URL delle estensioni
- Mostra solo le richieste con cookie di risposta bloccati
- Mostra solo le richieste bloccate
- Mostra solo le richieste di terze parti
Intestazioni e risposte della rete di ricerca
Per scoprire come cercare una determinata stringa o espressione regolare nelle intestazioni e nelle risposte HTTP di tutte le risorse, consulta Cercare intestazioni e risposte di rete.
Modificare il comportamento di caricamento
Testa l'esperienza utente della tua pagina modificando il comportamento di caricamento nel riquadro Rete.
Utilizzando il riquadro Rete, puoi:
- Emula un visitatore alla prima visita disattivando la cache del browser
- Svuotare manualmente la cache del browser
- Eliminare manualmente i cookie del browser
- Esegui l'emulazione offline
- Simulare una connessione di rete lenta
- Sostituire le intestazioni di risposta HTTP
- Ignorare l'user agent
Salvare ed esportare i dati delle richieste di rete
Per salvare ed esportare i dati delle richieste di rete, consulta quanto segue: