{"id":10756,"date":"2016-09-17T13:17:01","date_gmt":"2016-09-17T11:17:01","guid":{"rendered":"http:\/\/flaven.fr\/?p=10756"},"modified":"2016-09-17T13:17:01","modified_gmt":"2016-09-17T11:17:01","slug":"test-genymotion-android-tracer-les-flux-dune-application-avec-charles-sur-un-emulateur-genymotion","status":"publish","type":"post","link":"https:\/\/flaven.fr\/2016\/09\/test-genymotion-android-tracer-les-flux-dune-application-avec-charles-sur-un-emulateur-genymotion\/","title":{"rendered":"Test, Genymotion, Android – Tracer les flux d’une application avec Charles sur un \u00e9mulateur genymotion"},"content":{"rendered":"

On avait vu comment utiliser genymotion comme solution pour tester les .apk<\/code> sur un parc quasi-infini de terminaux Android. Tr\u00e8s souvent dans la phase de d\u00e9licate de la recette et\/ou du testing, il est souvent indispensable de tracer le traffic sur l’application, l’appel aux webservices notamment.
\nC’est \u00e0 ce moment pr\u00e9cis que l’on souhaite coupler cet \u00e9mulateur d’\u00e9ventuels outils que l’on utilise par ailleurs dans d’autres contextes notamment comme pour un site web par exemple, je veux parler de Charles.<\/p>\n

Petit introduction \u00e0 Charles, prince du debug<\/H4>
\nEn clair, dans sa d\u00e9finition la plus simple, Charles est un logiciel qui permet de tracer toutes le trafic HTTP et SSL \/ HTTPS entre votre machine et “le internet”.<\/p>\n

Ci-dessous, l’ADN du logiciel Charles livr\u00e9 in-extenso en anglais.<\/p>\n

Charles is an HTTP proxy \/ HTTP monitor \/ Reverse Proxy that enables a developer to view all of the HTTP and SSL \/ HTTPS traffic between their machine and the Internet. This includes requests, responses and the HTTP headers (which contain the cookies and caching information).<\/p><\/blockquote>\n

Configurer un \u00e9mulateur de Genymotion<\/h4>\n

Sans s’appesantir en d\u00e9tail, voil\u00e0 les principales \u00e9tapes.<\/p>\n

On part du principe que vous avez d\u00e9j\u00e0 installer Genymotion et que vous \u00eates en mesure de lancer un terminal Android quelconque. Voil\u00e0 ensuite les 7 \u00e9tapes \u00e0 suivre pour que le trafic de cette \u00e9mulateur soit pist\u00e9 dans Charles :<\/p>\n

    \n
  1. Il faut ouvrir les “Settings” de votre terminal Android sous Genymotion puis appuyer sur l’onglet “Wi-Fi” pour voir les connections sans-fil.<\/li>\n

    \tL’onglet “Wi-Fi”<\/b>
    \n\t\"Test,<\/p>\n

  2. Vous voyez apparaitre quelque chose comme “WiredSSID”. En maintenant appuyer un menu va apparaitre vous permettant de configurer la connexion wifi.<\/li>\n
  3. S\u00e9lectionner “Modify network”.<\/li>\n

    \"Test,<\/p>\n

  4. Changer le “Proxy settings” pour “Manual”.<\/li>\n
  5. Il faut ensuite changer la valeur du champs “Proxy hostname” en tapant 10.0.3.2<\/code>
    \nA noter c’est une adresse IP sp\u00e9cifique \u00e0 Genymotion IP. Inutile d’essayer de la mettre dans la VM directement sur laquelle l’\u00e9mulateur est adoss\u00e9, cela ne fonctionnera pas.<\/b><\/li>\n
  6. Changer la valeur du champs “Proxy port” \u00e0 8888<\/code>.<\/li>\n
  7. Appuyer sur “Save”. Le plus s\u00fbr est de red\u00e9marrer \u00e0 la fois Charles et Genymotion pour \u00eatre certain que les changements ont \u00e9t\u00e9 pris en compte. Pour chaque nouvelle \u00e9mulateur employ\u00e9, vous \u00eates dans l’obligation de faire la m\u00eame manipulation.<\/li>\n<\/ol>\n

    Une capture de Charles coupl\u00e9 \u00e0 une application Android sur un \u00e9mulateur de Genymotion<\/b>
    \n\"Test,<\/p>\n

    Dernier conseil, il est possible de faire fonctionner Charles pour tracer l’activit\u00e9 sur un terminal physique, en clair un vrai smartphone. A priori, la condition requise pour un tel usage est de faire pointer le proxy de votre smartphone vers l’IP de votre machine sur le port 888<\/code>, PC ou Mac, sur laquelle est install\u00e9 Charles.<\/p>\n

    Pour conclure, la combinaison des deux outils est un “must-have” \u00e9tant donn\u00e9 la facilit\u00e9 d’installation de deux logiciels. C’est un gain de temps pour “monitorer, tester, debuger” vos applications mobiles sous iOS comme sur Android.<\/b><\/p>\n

    La connexion de Charles \u00e0 un terminal physique<\/b>
    \n\"Test,<\/p>\n

    S’assurer dans Charles que votre smartphone pointera vers l’IP de votre machine sur le port 888<\/code><\/b>
    \n\"Test,<\/p>\n

    Charles trace une application sur un smartphone<\/b>
    \n\"Test,<\/p>\n

    En savoir plus<\/h2>\n