Edit

Share via

Inspect requests and responses using Chrome DevTools

At a glance
Goal: View requests in Chrome DevTools
Time: 5 minutes
Plugins: DevToolsPlugin
Prerequisites: Set up Dev Proxy

By default, Dev Proxy displays its messages in the command prompt. If you use Dev Proxy with an application that issues many requests, it's difficult to find the messages you're interested in. What's more, you might want to inspect the requests and responses intercepted by Dev Proxy.

To make it easier to find the messages you're interested in, use the DevToolsPlugin plugin to display Dev Proxy messages in Chrome DevTools.

Tip

Dev Proxy supports using Chrome DevTools with Microsoft Edge, Microsoft Edge Dev and Google Chrome.

The DevToolsPlugin exposes Dev Proxy messages, and information about intercepted requests and responses in Chrome DevTools.

Screenshot of Microsoft Edge with dev tools showing Dev Proxy messages.

Screenshot of Microsoft Edge with dev tools showing requests and responses intercepted by Dev Proxy.

To use Chrome DevTools with Dev Proxy:

  1. Open the devproxyrc.json file stored in your Dev Proxy installation directory. You can also use the devproxy config open command.

  2. Enable the DevToolsPlugin plugin and add the devTools configuration section. Supported preferredBrowser values are: Edge, EdgeDev, Chrome.

    The complete devproxyrc.json file looks like:

    File: devproxyrc.json

    {
  "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v2.0.0/rc.schema.json",
  "plugins": [
    {
      "name": "DevToolsPlugin",
      "enabled": true,
      "pluginPath": "~appFolder/plugins/DevProxy.Plugins.dll",
      "configSection": "devTools"
    }
  ],
  "devTools": {
    "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v2.0.0/devtoolsplugin.schema.json",
    "preferredBrowser": "Edge"
  }
}

  3. Save the devproxyrc.json file and start Dev Proxy.

See also

  • Last updated on