Comment créer un fichier HAR à partir de Google Chrome, Firefox et l'analyser ?

Comprendre et utiliser les fichiers HAR pour le dépannage web

Les fichiers HAR sont des outils précieux pour identifier et résoudre les problèmes de réseau et de performance, tels que les temps de chargement de page excessivement longs ou les interruptions lors de certaines actions sur un site internet. Ils sont couramment utilisés pour diagnostiquer les causes de mauvaises performances.

Les équipes de support technique de nombreuses entreprises utilisent ces fichiers afin de localiser et de corriger divers problèmes, allant des lenteurs de chargement aux erreurs d'affichage, en passant par les codes d'erreur qui peuvent survenir.

Qu'est-ce qu'un fichier HAR ?

Un fichier HAR, abréviation de "HTTP Archive", est un fichier d'archive au format JSON. Il capture l'activité réseau récente de votre navigateur web, enregistrant les échanges de données, comme les requêtes et les réponses, entre votre navigateur et le site visité.

Ce fichier consigne chaque ressource chargée par le navigateur et le temps nécessaire à son chargement. Il contient donc des données textuelles détaillées sur les communications HTTP entre le client et le serveur.

.har est l'extension de ces fichiers d'archive.

Pourquoi générer un fichier HAR ?

Lorsqu'un utilisateur signale un problème, l'équipe de support peut demander l'analyse d'un fichier HAR pour aider à la résolution.

Ces fichiers fournissent une multitude d'informations essentielles pour le débogage : les paramètres du navigateur, les cookies, le temps nécessaire pour obtenir les données de réponse, le temps de chargement des images, le temps d'établissement de la connexion serveur et le temps total de chaque échange. Tout cela facilite grandement le diagnostic.

Comment procéder ?

Commencez par vous rendre sur la page web qui pose problème, et lancez l'enregistrement des interactions réseau.
Reproduisez ensuite le problème en effectuant les actions nécessaires.
Terminez la capture, et sauvegardez le fichier HAR ainsi créé.
Vous pouvez analyser ce fichier vous-même, ou le transmettre à l'équipe de support pour qu'elle se charge de l'analyse et de la résolution.

Générer un fichier HAR selon le navigateur

La procédure pour enregistrer une session HTTP dans un fichier HAR varie selon les navigateurs.

Chrome

Tous les navigateurs possèdent des outils de développement qui permettent d'enregistrer les sessions HTTP. Dans Chrome :

Ouvrez la page qui pose problème.
Accédez aux outils de développement (Menu > Plus d'outils > Outils de développement), et sélectionnez l'onglet "Réseau".
Assurez-vous que le bouton d'enregistrement (en haut à gauche) est rouge. S'il est gris, cliquez dessus pour démarrer l'enregistrement.
Activez l'option de conservation du journal pour capturer l'ensemble des requêtes et réponses.
Cliquez sur l'icône de téléchargement (flèche vers le bas) dans l'onglet "Réseau" pour exporter le fichier HAR.
Enregistrez le fichier HAR sur votre disque dur.

Firefox

Cliquez sur le menu Firefox (trois barres horizontales) en haut à droite de la fenêtre.
Choisissez "Plus d'outils" puis "Développeur Web" et enfin "Réseau".
Activez l'option de persistance des journaux.
Actualisez la page et reproduisez le problème pour capturer les échanges.
Faites un clic droit sur une ligne du journal et sélectionnez "Enregistrer tout au format HAR" une fois le problème reproduit.
Si le journal de la console est également nécessaire, allez dans l'onglet "Console", cliquez droit, sélectionnez tout, copiez et collez le contenu dans un fichier texte à transmettre au support.

Microsoft Edge

Cliquez sur l'icône "..." (trois points) en haut à droite, puis "Plus d'outils" et "Outils de développement".
Allez dans l'onglet "Réseau" et démarrez l'enregistrement.
Reproduisez le problème sur la page web.
Exportez le fichier HAR en choisissant "Exporter au format HAR".

Internet Explorer

Ouvrez Internet Explorer et allez sur la page qui pose problème.
Cliquez sur l'icône d'engrenage (en haut à droite).
Choisissez "Outils de développement" puis l'onglet "Réseau".
Actualisez la page et reproduisez le problème.
Cliquez sur l'icône "Exporter au format HAR" (disquette) une fois le problème reproduit.

L'outil HTTPWatch

Pour Chrome, Internet Explorer et Edge, vous pouvez également utiliser HTTPWatch un outil d'analyse intégré au navigateur.

Téléchargez et installez HTTPWatch.
Lancez la capture, chargez la page qui pose problème, et arrêtez l'enregistrement lorsque le problème est reproduit.
Sauvegardez la capture au format HAR.

Sites d'analyse de fichiers HAR

Voici quelques outils en ligne pour visualiser et analyser vos fichiers HAR :

Analyseur Google HAR : Permet d'importer et d'analyser un fichier HAR. Il offre un filtrage par code d'état HTTP.
Softwareishard.com : Affiche une chronologie des requêtes, permettant d'explorer chaque interaction. L'outil accepte le glisser-déposer de fichiers.
Site24x7 : Un autre outil web pour analyser les fichiers HAR, via l'importation ou le copier-coller de contenu.

Conclusion

Un fichier HAR n'est rien de plus qu'un fichier JSON contenant les échanges HTTP. Il peut donc contenir des informations sensibles, telles que :

Les en-têtes de requêtes et de réponses.
Le contenu des requêtes et des réponses.
Des jetons d'authentification, des cookies, des identifiants de session, des mots de passe ou encore des clés d'API.

Il est impératif de supprimer toute information confidentielle d'un fichier HAR avant de le transmettre à une équipe de support, surtout si le fichier contient des interactions avec des services tiers.

Nous espérons que cet article vous a été utile pour comprendre l'utilisation des fichiers HAR et leur génération dans différents navigateurs.

Vous pourriez également être intéressé par notre article sur le dépannage de la latence réseau avec Wireshark.

Avez-vous apprécié cet article ? N'hésitez pas à le partager !