Partager via


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

Par défaut, dev Proxy affiche ses messages dans l’invite de commandes. Si vous utilisez le proxy de développement avec une application qui émet de nombreuses demandes, il est difficile de trouver les messages qui vous intéressent. De plus, vous pouvez 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 pour afficher les DevToolsPlugin messages dev proxy 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 des messages 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 dev proxy :

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

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

    {
      "name": "DevToolsPlugin",
      "enabled": true,
      "pluginPath": "~appFolder/plugins/dev-proxy-plugins.dll",
      "configSection": "devTools"
    }
    
  3. Ajoutez la devTools section 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 complet devproxyrc.json se présente comme suit :

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