Partager via


Inspecter les demandes et les réponses à l’aide de Chrome DevTools

Par défaut, le proxy de développement affiche ses messages dans l’invite de commandes. Si vous utilisez le proxy de développement avec une application qui émet de nombreuses requêtes, il est difficile de trouver les messages qui vous intéressent. De plus, vous souhaiterez peut-être inspecter les demandes et les réponses interceptées par le proxy de développement.

Pour faciliter la recherche des messages qui vous intéressent, utilisez le plug-in DevToolsPlugin pour afficher les messages du proxy de développement dans Chrome DevTools.

Conseil

Dev Proxy prend en charge l’utilisation de Chrome DevTools avec Microsoft Edge, Microsoft Edge Dev et Google Chrome.

Le DevToolsPlugin expose les messages du proxy de développement et des informations sur les requêtes et réponses interceptées dans Chrome DevTools.

capture d’écran de Microsoft Edge avec les outils de développement montrant les messages du proxy de développement.

capture d’écran de Microsoft Edge avec les outils de développement montrant les demandes et les réponses interceptées par le proxy de développement.

Pour utiliser Chrome DevTools avec le proxy de développement :

  1. Ouvrez le fichier devproxyrc.json stocké dans votre répertoire d’installation du proxy de développement.

  2. Activez le plug-in DevToolsPlugin en ajoutant le fragment suivant au tableau plugins :

    {
      "name": "DevToolsPlugin",
      "enabled": true,
      "pluginPath": "~appFolder/plugins/dev-proxy-plugins.dll",
      "configSection": "devTools"
    }
    
  3. Ajoutez la section devTools et spécifiez votre navigateur préféré :

    "devTools": {
      "preferredBrowser": "Edge"
    }
    

    Conseil

    Les valeurs prises en charge sont les suivantes : Edge, EdgeDev, Chrome

  4. Le fichier devproxyrc.json complet ressemble à ceci :

    {
      "plugins": [
        {
          "name": "DevToolsPlugin",
          "enabled": true,
          "pluginPath": "~appFolder/plugins/dev-proxy-plugins.dll",
          "configSection": "devTools"
        }
      ],
      "devTools": {
        "preferredBrowser": "Edge"
      }
    }
    
  5. Enregistrez le fichier devproxyrc.json et démarrez le proxy de développement.