Come creare file HAR da Google Chrome, Firefox e analizzarlo?

Comprendere e utilizzare i file HAR per la diagnostica web

I file HAR, spesso utilizzati per la risoluzione di problematiche legate alle prestazioni di rete, come ad esempio caricamenti lenti o timeout durante l’interazione con siti web, rappresentano uno strumento cruciale.

Sia le aziende che i team di supporto web ricorrono all’analisi dei file HAR per identificare e risolvere problemi come i tempi di caricamento prolungati, errori di rendering delle pagine e codici di errore correlati a queste problematiche.

Cos’è un file HAR?

Un file HAR (HTTP Archive) è essenzialmente un file di archivio in formato JSON che registra l’attività di rete di un browser web. Questo file registra tutte le comunicazioni, come le richieste e le risposte tra il browser e un sito web.

Il file HAR documenta ogni risorsa che il browser carica, insieme al tempo necessario per il caricamento di ciascuna risorsa. Questi file contengono essenzialmente registrazioni testuali delle comunicazioni client-server HTTP.

L’estensione di questi file è appunto .har.

Perché generare un file HAR?

Il team di supporto o l’azienda potrebbero richiedere l’analisi di un file HAR quando un utente segnala un problema. L’analisi del file permette di comprendere meglio la situazione e di identificare la radice del problema.

I file HAR offrono informazioni dettagliate sulle interazioni HTTP client-server, utili nel debug. Queste informazioni includono le impostazioni del browser, i cookie, il tempo impiegato per ricevere i dati di risposta, il tempo necessario per caricare una specifica immagine, il tempo di connessione al server, il tempo per inviare una richiesta e ricevere la risposta.

Processo di acquisizione di un file HAR: Una panoramica

  • Iniziare navigando sulla pagina web che presenta problemi e attivare la registrazione di tutte le interazioni web.
  • Riprodurre il problema ripetendo i passaggi che lo causano.
  • Concludere la registrazione e salvare il file HAR.
  • Analizzare il file autonomamente o inviarlo al supporto per la risoluzione di problemi di prestazioni o di rendering della pagina.

Come generare file HAR nei principali browser

La procedura di generazione di file HAR per acquisire una sessione HTTP varia leggermente tra i diversi browser.

Chrome

La scheda “Rete” degli Strumenti per sviluppatori di qualsiasi browser è utile per registrare le sessioni HTTP.

  • In Chrome, navigare sulla pagina che presenta problemi.
  • Aprire gli Strumenti per sviluppatori tramite il menu (Menu > Altri strumenti > Strumenti per sviluppatori). Selezionare la scheda “Rete”.
  • Nella scheda “Rete”, assicurarsi che il pulsante circolare in alto a sinistra sia rosso. Se è grigio, cliccare per avviare la registrazione.
  • Abilitare il registro di conservazione per registrare tutte le richieste e le risposte.
  • Per esportare il file HAR, cliccare sul pulsante freccia in basso nella scheda “Rete”.
  • Salvare il file HAR sul computer.

Firefox

  • In alto a destra nella finestra del browser, cliccare sul menu Firefox (tre linee orizzontali parallele).
  • Selezionare Altri strumenti > Sviluppatore Web > Rete dal menu a tendina.
  • Cliccare sul pulsante delle impostazioni e attivare l’opzione di persistenza dei registri.
  • Mentre la registrazione è attiva, aggiornare la pagina e riprodurre il problema.
  • Cliccare con il pulsante destro del mouse su qualsiasi riga del pannello e selezionare “Salva tutto come HAR” se il problema è stato riprodotto correttamente.
  • Se necessario, per risolvere i problemi, andare alla scheda “Console”, selezionare tutto con il tasto destro su una qualsiasi riga e copiare il contenuto in un file di testo da condividere con il centro di supporto.

Microsoft Edge

  • Selezionare Altri strumenti > Strumenti per sviluppatori, cliccando sull’icona a tre punti (…) in alto a destra.
  • Passare alla scheda “Rete” e avviare la sessione di profilazione.
  • Visitare la pagina web e seguire le istruzioni per riprodurre il problema.
  • Salvare il file HAR selezionando “Esporta come HAR”.

Internet Explorer

  • Aprire Internet Explorer e andare alla pagina problematica.
  • Cliccare sull’icona dell’ingranaggio in alto a destra.
  • Andare su Strumenti per sviluppatori > Scheda “Rete”.
  • Mentre la registrazione è attiva, aggiornare la pagina e riprodurre il problema.
  • Cliccare sull’icona “Esporta come HAR” (a forma di floppy disk) dopo aver riprodotto il problema.

Strumento HTTP Watch

È possibile utilizzare HTTPWatch (uno sniffer HTTP per browser) con Google Chrome, Internet Explorer e Microsoft Edge per acquisire richieste e risposte web.

  • Scaricare e installare lo strumento HTTPwatch.
  • Avviare la registrazione HTTPwatch, caricare la pagina problematica e interrompere la registrazione una volta riprodotto il problema.
  • La registrazione viene salvata in formato HAR.

Siti web per l’analisi dei file HAR

Questi strumenti sono efficienti per visualizzare ed analizzare i file HAR.

  • Analizzatore Google HAR – Caricare un file cliccando su “Scegli file” per visualizzarne l’analisi. È disponibile un filtro per il codice di stato HTTP.
  • Softwareishard.com – Uno strumento gratuito che visualizza un grafico a cascata delle richieste e consente di analizzarle nel dettaglio. Caricare il registro HAR e cliccare “Anteprima” o trascinare il file sulla pagina.
  • Site24x7 – Uno strumento gratuito per la visualizzazione di file di archivio HTTP. Caricare o incollare il contenuto del file.

Conclusione

Un file HAR è essenzialmente un documento JSON contenente le richieste e le risposte web. Può contenere informazioni potenzialmente sensibili:

  • Intestazioni di richiesta e risposta
  • Contenuti di richiesta e risposta
  • Token di autenticazione, cookie, token di sessione, password e credenziali API

È fondamentale eliminare le informazioni sensibili prima di inviare un file HAR al supporto per l’analisi. L’invio di file HAR con interazioni di terze parti può esporre informazioni critiche.

Sperando che questo articolo sia stato utile per comprendere gli strumenti di analisi HAR e come generare file HAR nei diversi browser.

Potresti trovare interessante anche l’argomento sulla risoluzione dei problemi di latenza di rete con Wireshark.

Ti è piaciuto l’articolo? Condividilo con gli altri!