Importateurs de violoneux

Apprenez à créer vos propres importateurs Fiddler avec ce guide simple.

Lors de la reproduction d'un bogue sur un site Web ou un service Web, les captures de trafic sont d'une valeur inestimable, car elles permettent aux développeurs et aux testeurs de voir facilement ce qui se passe au niveau du réseau, même sans accès environnement de reproduction. Au fil des ans, Le format de fichier Session Archive Zip (SAZ) de Fiddler est devenu la référence en la matière car il permet de capturer facilement des fichiers SAZ (avec Fiddler, Fiddler Everywhere FiddlerCap ou un outil basé sur Fiddlercore) et sont facilement contrôlables avec le puissant client de bureau Fiddler.

Toutefois, dans certains cas, vous pouvez souhaiter déboguer le trafic réseau capturé à l’origine avec un autre outil et exporté dans un format. comme un PCAP Wireshark ou le format HAR (HTTP Archive Format) standard du navigateur. Fiddler inclut déjà les importateurs pour ces formats, mais que faire si vous souhaitez prendre en charge un format différent que Fiddler ne prend pas encore en charge?

Heureusement, Fiddler est extrêmement extensible, et cela s'étend jusqu'au système d'importation / exportation . Nous avons précédemment publié un exemple d’exportateur et, aujourd’hui, j'aimerais vous expliquer comment créer un importateur.

Je suis maintenant ingénieur dans l’équipe du navigateur Microsoft Edge et nos versions de prévisualisation sont maintenant testées par des utilisateurs du monde entier. Lorsque ces utilisateurs rencontrent des problèmes, le meilleur chemin pour le débogage commence parfois par la capture d'un journal de trafic réseau. Pour certains de nos utilisateurs plus techniques, cela pourrait impliquer de collecter un fichier SAZ en utilisant l’un des produits Fiddler- * existants. Mais pour d'autres utilisateurs (en particulier nos futurs utilisateurs MacOS), la collecte d'un fichier SAZ implique davantage de temps système. Dans des cas obscurs, la collecte d'un fichier SAZ pourrait entraîner la disparition d'une reproduction .

Heureusement, le nouveau navigateur Microsoft Edge est construit sur le moteur de navigateur à code source ouvert Chromium, et ce dernier inclut un réseau intégré. fonction de journalisation. Pour collecter un journal réseau dans Edge, il vous suffit de naviguer dans un onglet jusqu'à edge: // net-export (dans Google Chrome, vous visiteriez chrome: // net-export à la place).

Configurez les options à l'aide des boutons radio, puis cliquez sur Démarrer la journalisation sur disque. Ouvrez un nouvel onglet et reproduisez le problème. Une fois la repro terminée, cliquez sur Arrêter la journalisation. À la fin, vous aurez un fichier NetLog .json contenant tous les événements réseau. Le fichier JSON de sortie peut être visualisé à l'aide d'un visualiseur Web :

.

Cependant, dans de nombreux cas, il serait plus souhaitable de visualiser le fichier avec Fiddler. Contrairement au visualiseur Web (qui a tendance à afficher le contenu sous forme de chaîne codée en base64), Fiddler inclut des formateurs intégrés pour les formats Web courants (par exemple, les images, JSON, etc.) et facilite l’exportation des corps de réponse au format. fichiers, renvoyez les requêtes capturées à l’aide du Composer et relisez les réponses capturées à l’aide du répondeur automatique.

Fiddler n’inclut pas d’importateur NetLog par défaut, nous allons donc en créer un.

Commençons par examiner la documentation de Chromium pour le format de fichier relativement simple . Les fichiers NetLog sont des flux d'événements réseau sérialisés en JSON. Les événements de bas niveau (suivi des recherches DNS, connexions TCP / IP, vérifications de certificat HTTPS, etc.) sont associés à un identificateur de requête, qui représente une ou plusieurs requêtes réseau (ce que Fiddler appelle une "session Web" ). La tâche de notre importateur consiste donc à:

1. Analyser le fichier JSON dans une liste d'événements
       
2. Concentrez les événements en fonction des identificateurs de demande.
3. Générez une ou plusieurs sessions Web Fiddler à partir de chaque compartiment.

Le code source C pour l'extension FiddlerImportNetlog est disponible sur Github. Au-delà de tous les fichiers de projet types, l’extension elle-même ne comprend que deux fichiers, Importer.cs, FiddlerInterface.cs et Properties AssemblyInfo.cs.

Le AssemblyInfo.cs contient une seule ligne d'intérêt:

[assembly: Fiddler.RequiredVersion("4.6.0.0")]

Fiddler a besoin de cet attribut pour charger l'assemblage comme une extension; il spécifie la version minimale de Fiddler dans laquelle vous avez testé l’extension.

Le fichier FiddlerInterface.cs contient une classe simple qui implémente l’interface ISessionImporter . L'attribut ProfferFormat de la classe spécifie le type de format et une chaîne descriptive à afficher dans la boîte de dialogue d'importation:

L'interface importateur expose une seule méthode, ImportSessions, qui accepte une chaîne spécifiant le format sélectionné, un dictionnaire d'options et un gestionnaire d'événements facultatif à rappeler avec les événements de progression de l'importation. La fonction renvoie un tableau de sessions créées à partir des données importées.

L’essentiel de la logique de l’extension se trouve dans Importer.cs . L’appelant fournit un StreamReader à partir duquel le texte du fichier importé est lu, puis analysé à l’aide de la méthode JSON.JsonDecode rendue disponible par l’instruction using Fiddler.WebFormats en haut du fichier. WebFormats.JSON est un analyseur syntaxique simple et rapide qui lit le JSON dans des hachats (pour les objets JS), des ArrayLists (pour des tableaux JS) et des types primitifs (booléens, doubles, chaînes, etc.).

Après l'analyse, l'importateur a l'air place les mappages des types d’événements nommés (par exemple, URL_REQUEST_START_JOB) sur les identificateurs d’entier enregistrés dans les entrées d’événement, puis analyse la liste des entrées d’événement, en regroupant celles qui ont une source d’URL_REQUEST par l’identificateur de la demande. Ensuite, la méthode ParseSessionsFromBucket parcourt chaque événement de URL_REQUEST pour collecter les données (par exemple, en-têtes de requête, en-têtes de réponse, corps de réponse) nécessaires pour générer une session Web Fiddler. Deux détails notables:

1. Le format NetLog peut avoir plusieurs paires requête / réponse dans une seule URL_REQUEST (par exemple, si la requête a entraîné une redirection ou un challenge / réponse d'authentification automatique).
       
2. Le format NetLog ne stocke actuellement (nulle part) le contenu du corps de la requête pour les requêtes POST. En revanche, les octets du corps de la réponse peuvent être présents ou non, en fonction des options choisies par l'utilisateur lors du démarrage du processus de journalisation.
       

Après avoir généré la liste des sessions Web extraites, l'importateur génère quelques sessions fictives qui permettent à l'utilisateur de consulter les données brutes capturées dans le fichier (par exemple, la configuration du navigateur, la liste des extensions activées, etc.) [19659004] Après une heure de codage rapide, Fiddler peut maintenant importer des fichiers NetLog json:

Si vous souhaitez simplement utiliser cet importateur sans le créer vous-même, vous pouvez l'installer à partir de mon site Web . Si vous trouvez des bogues, veuillez les les classer !

J'espère que vous avez trouvé cette introduction utile sur la facilité avec laquelle il est facile de créer des importateurs pour importer vos données dans Fiddler!