Charles : Web debugging proxy

Un outil pour bien développer

Charles Web debugging proxy  est sans doute le meilleur outils d’analyse de trames HTTP qui soit. Je ne ferai pas le détails ici des autres solutions, même si j’ai longtemps utilisé HTTPWatch 4.x et que d’autres versions sont sorties entretemps. La version 7 m’a l’air pas mal du tout mais la licence est un peu chère, 315 € pour un utilisateur unique! Il existe également Fiddler avec lequel j’ai longtemps joué mais qui ne me satisfaisait pas vraiment en raison d’une interface glauque et finalement peu pratique. Charles se positionne entre votre poste et Internet et interceptera toutes les trames issues des différents logiciels comme ceux de navigation, messageries instantanées, de microblogging ou encore des widgets. Firefox nécessite un add-on pour s’interfacer avec Charles. Ce dernier vous demande de l’installer au premier lancement du logiciel.

Revenons-en au produit, avant tout c’est un logiciel payant dont le prix est compris entre $50 et $700. Je n’ai pas de mal à payer des logiciels de qualité surtout quand ils me font gagner des nombreuses heures, c’est d’autant plus vrai si vous bosser sur des sites Flash ou que vous faites de l’AJAX. Il me semble que $50 pour une licence est abordable pour les freelances ou petites structures et que $700 est un prix juste pour les licences illimités.

Interface générale


Il y a deux types de vue. La vue « Séquence », qui est celle par défaut et qui liste les requêtes au fur et à mesure qu’elles sont émises par les logiciels et la vue « Structure » qui tri les trames par domaine.

Je travaille habituellement avec la vue « Séquence » qui affiche par ordre chronologique les appels des applications web.

Dans la partie basse de la fenêtre vous avez plusieurs onglets, principalement voici ceux qui m’intéressent :

  • Overview pour avoir des informations comme la réponse HTTP, le début / la fin du chargement de la page, le temps que la page a mis pour être chargée
  • Request permet de voir les variables envoyés sur la page
  • Response permet de voir ce qui est retourné par le serveur, c’est-à-dire la page HTML, ou un JSON / XML issu d’un webservice
  • Charts pour avoir une représentation graphique sous forme de barGraph, en sélectionnant plusieurs lignes dans la séquence vous pourrez comparer le temps de chargement des vos fichiers

Vous pouvez cliquer droit sur chaque ligne de la séquence pour éditer la requête en cours ! C’est vraiment très pratique car cela évite de recharger toute la page. On peut éditer variable par variable mais également une chaine XML qu’on envoie sur un webservice. Il est également possible de répéter une requête si vous avez un doute sur le fonctionnement d’une page ou si vous voulez tester des chargements sur différents serveurs.

Au niveau de la configuration, vous pouvez bien sur configurer des proxy de sortie en fonction de ce que vous utilisez. Mais il y a plus intéressant, comme pouvoir filtrer sur des domaines et des urls, très pratique pour éviter de voir votre séquence polluée par autre chose que ce que vous voulez tracker. Au hasard les DNS de votre client, des services de tracking ou de facebook pour vos applications.

Vous pouvez également empêcher le « caching » pour être certains de charger la dernière version des fichier sur lesquels vous travaillez.

Enfin, vous pouvez également « mapper » des appels distants sur des fichiers locaux, c’est très pratique si vous n’avez pas accès à votre serveur de dév., ou que la configuration est différente sur le serveur de production. Ainsi vous associez un url distant avec un fichier local, par exemple un fichier de configuration XML ou un fichier CSS.

Vous pouvez également exporter des sessions mais personnellement je n’ai pas trouvé d’utilisation vraiment utile car le seul format proposé est celui de Charles, c’est dommage que ça ne génère pas une page HTML, ça peut-être très pratique pour attester auprès d’une régie pub que l’implémentation de leur tracker fonctionne correctement dans votre page.

J’espère que vous aurez l’occasion d’essayer ce logiciel dont je ne peux personnellement plus me passer que je recommande à tous développeurs web.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *