Condividi tramite

Eseguire il debug con il proxy di sviluppo

A colpo d'occhio
Obiettivo: Eseguire il debug dell'applicazione mentre Dev Proxy simula gli errori dell'API
Tempo: 15 minuti
Plugins:GenericRandomErrorPlugin
Prerequisiti:Configurare il proxy di sviluppo, VS Code

Quando si compilano applicazioni che chiamano API, è necessario assicurarsi che il codice gestisca correttamente gli errori. Combinando Dev Proxy con Visual Studio (VS) Code debugger, è possibile simulare gli errori dell'API ed esaminare il codice di gestione degli errori per verificarne il corretto funzionamento.

Informazioni generali

Il debug con Dev Proxy prevede tre passaggi:

  1. Configurare VS Code per instradare le richieste HTTP tramite Dev Proxy
  2. Configurare il proxy di sviluppo per simulare errori specifici
  3. Impostare punti di interruzione nel codice di gestione degli errori ed eseguire il debug

Configurare VS Code per il debug con Dev Proxy

La configurazione di VS Code dipende dal linguaggio di programmazione usato. Le sezioni seguenti illustrano come configurare VS Code per le applicazioni Node.js, .NET e Python.

Node.js

Per eseguire il debug di un'applicazione Node.js con Dev Proxy, configurare il file per impostare le variabili di ambiente proxy e disabilitare la verifica del certificato TLS/SSL.

File: .vscode/launch.json

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Debug with Dev Proxy",
      "skipFiles": [
        "<node_internals>/**"
      ],
      "program": "${workspaceFolder}/index.js",
      "env": {
        "NODE_ENV": "development",
        "http_proxy": "http://127.0.0.1:8000",
        "https_proxy": "http://127.0.0.1:8000",
        "GLOBAL_AGENT_HTTP_PROXY": "http://127.0.0.1:8000",
        "NODE_TLS_REJECT_UNAUTHORIZED": "0"
      }
    }
  ]
}

Importante

L'impostazione disabilita la verifica del certificato TLS/SSL. Usare questa impostazione solo durante lo sviluppo. Per un approccio più sicuro, usare per considerare attendibile direttamente il certificato del proxy di sviluppo:

macOS/Linux:

"NODE_EXTRA_CA_CERTS": "${env:HOME}/.devproxy/rootCert.pem"

Windows:

"NODE_EXTRA_CA_CERTS": "${env:USERPROFILE}\\.devproxy\\rootCert.pem"

La variabile viene usata dal pacchetto, che fornisce il supporto proxy per molte librerie HTTP Node.js. Per altre informazioni sulla configurazione di librerie HTTP diverse, vedere Usare Dev Proxy con applicazioni Node.js.

.NET

.NET applicazioni usano automaticamente le impostazioni del proxy di sistema. Per eseguire il debug di un'applicazione .NET con Dev Proxy, in genere non è necessario impostare variabili di ambiente. Creare una configurazione di debug di base:

File: .vscode/launch.json

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Debug with Dev Proxy",
      "type": "coreclr",
      "request": "launch",
      "preLaunchTask": "build",
      "program": "${workspaceFolder}/bin/Debug/net8.0/MyApp.dll",
      "args": [],
      "cwd": "${workspaceFolder}",
      "console": "internalConsole",
      "stopAtEntry": false
    }
  ]
}

Se l'applicazione non preleva il proxy di sistema, impostare in modo esplicito le variabili di ambiente proxy:

File: .vscode/launch.json (con impostazioni proxy esplicite)

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Debug with Dev Proxy",
      "type": "coreclr",
      "request": "launch",
      "preLaunchTask": "build",
      "program": "${workspaceFolder}/bin/Debug/net8.0/MyApp.dll",
      "args": [],
      "cwd": "${workspaceFolder}",
      "console": "internalConsole",
      "stopAtEntry": false,
      "env": {
        "http_proxy": "http://127.0.0.1:8000",
        "https_proxy": "http://127.0.0.1:8000"
      }
    }
  ]
}

Suggerimento

Su Windows e macOS, .NET considera attendibile automaticamente il certificato del Dev Proxy se è stato installato come certificato radice attendibile durante l'installazione del Dev Proxy. In Linux potrebbe essere necessario considerare attendibile manualmente il certificato. Per la configurazione dei certificati attendibili, vedere la documentazione della distribuzione.

Python

Per eseguire il debug di un'applicazione Python con Dev Proxy, configurare il file launch.json per impostare le variabili di ambiente proxy. La configurazione dipende dal fatto che si usi la libreria o altre librerie HTTP.

File: .vscode/launch.json

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Debug with Dev Proxy",
      "type": "debugpy",
      "request": "launch",
      "program": "${workspaceFolder}/main.py",
      "console": "integratedTerminal",
      "env": {
        "HTTP_PROXY": "http://127.0.0.1:8000",
        "HTTPS_PROXY": "http://127.0.0.1:8000",
        "REQUESTS_CA_BUNDLE": ""
      }
    }
  ]
}

Importante

L'impostazione su una stringa vuota indica alla libreria di ignorare la verifica del certificato TLS/SSL. Usare questa impostazione solo durante lo sviluppo.

Per un approccio più sicuro, puntare al certificato del proxy di sviluppo:

macOS/Linux:

"REQUESTS_CA_BUNDLE": "${env:HOME}/.devproxy/rootCert.pem"

Windows:

"REQUESTS_CA_BUNDLE": "${env:USERPROFILE}\\.devproxy\\rootCert.pem"

Se si usa la libreria, configurare la verifica TLS/SSL usando invece la variabile di ambiente:

{
  "env": {
    "HTTP_PROXY": "http://127.0.0.1:8000",
    "HTTPS_PROXY": "http://127.0.0.1:8000",
    "TLS/SSL_CERT_FILE": "${env:HOME}/.devproxy/rootCert.pem"
  }
}

Configurare il proxy di sviluppo per simulare gli errori

Per eseguire il debug della gestione degli errori, configurare Dev Proxy per restituire errori specifici quando l'app chiama le API. Usare il GenericRandomErrorPlugin per simulare errori come, ad esempio, o .

Simulare un errore 429 (troppe richieste)

Creare un file di configurazione di Dev Proxy che simula la limitazione:

File: devproxyrc.json

{
  "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v2.3.0/rc.schema.json",
  "plugins": [
    {
      "name": "GenericRandomErrorPlugin",
      "enabled": true,
      "pluginPath": "~appFolder/plugins/DevProxy.Plugins.dll",
      "configSection": "errorsConfig"
    }
  ],
  "urlsToWatch": [
    "https://api.contoso.com/*"
  ],
  "rate": 100,
  "errorsConfig": {
    "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v2.3.0/genericrandomerrorplugin.schema.json",
    "errorsFile": "errors.json"
  }
}

Creare il file degli errori con le risposte di errore specifiche:

File: errors.json

{
  "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v2.3.0/genericrandomerrorplugin.errorsfile.schema.json",
  "errors": [
    {
      "request": {
        "url": "https://api.contoso.com/*"
      },
      "responses": [
        {
          "statusCode": 429,
          "headers": [
            {
              "name": "content-type",
              "value": "application/json"
            },
            {
              "name": "Retry-After",
              "value": "60"
            }
          ],
          "body": {
            "error": {
              "code": "TooManyRequests",
              "message": "Rate limit exceeded. Retry after 60 seconds."
            }
          }
        }
      ]
    }
  ]
}

Suggerimento

Impostare su un valore che faccia fallire ogni richiesta, in modo da attivare costantemente il codice di gestione degli errori durante il debug. Ridurre la frequenza quando si desidera testare errori intermittenti.

Simulare un errore 500 (errore interno del server)

Per simulare gli errori del server, aggiungere un'altra risposta di errore:

File: errors.json (più errori)

{
  "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v2.3.0/genericrandomerrorplugin.errorsfile.schema.json",
  "errors": [
    {
      "request": {
        "url": "https://api.contoso.com/*"
      },
      "responses": [
        {
          "statusCode": 429,
          "headers": [
            {
              "name": "content-type",
              "value": "application/json"
            },
            {
              "name": "Retry-After",
              "value": "60"
            }
          ],
          "body": {
            "error": {
              "code": "TooManyRequests",
              "message": "Rate limit exceeded. Retry after 60 seconds."
            }
          }
        },
        {
          "statusCode": 500,
          "headers": [
            {
              "name": "content-type",
              "value": "application/json"
            }
          ],
          "body": {
            "error": {
              "code": "InternalServerError",
              "message": "An unexpected error occurred."
            }
          }
        }
      ]
    }
  ]
}

Quando si definiscono più risposte di errore, Il proxy di sviluppo seleziona in modo casuale uno per ogni richiesta intercettata.

Eseguire il debug del codice di gestione degli errori

Dopo aver configurato VS Code e Dev Proxy, è ora possibile eseguire il debug del codice di gestione degli errori.

Passaggio 1: Impostare punti di interruzione

Aprire il codice sorgente e impostare punti di interruzione nel codice di gestione degli errori. Ad esempio, in un'applicazione Node.js:

async function fetchData() {
  try {
    const response = await fetch('https://api.contoso.com/data');
    
    if (!response.ok) {
      // Set a breakpoint here to debug error responses
      throw new Error(`HTTP error: ${response.status}`);
    }
    
    return await response.json();
  } catch (error) {
    // Set a breakpoint here to debug exceptions
    console.error('Failed to fetch data:', error);
    throw error;
  }
}

Passaggio 2: Avviare il proxy di sviluppo

Avviare Dev Proxy con il file di configurazione:

devproxy --config-file devproxyrc.json

Passaggio 3: Avviare il debug in VS Code

  1. Aprire VS Code
  2. Premere F5 o selezionare Esegui Avvia il debug
  3. Quando l'applicazione effettua una chiamata API, Dev Proxy lo intercetta e restituisce un errore
  4. Vs Code si sospende in corrispondenza del punto di interruzione
  5. Usare i controlli di debug per scorrere il codice ed esaminare le variabili

Passaggio 4: Esaminare l'errore

Quando VS Code si interrompe al tuo punto di interruzione, usa il pannello di debug per:

  • Visualizzare il codice di stato della risposta di errore e il messaggio
  • Controllare i valori delle variabili locali
  • Scorrere la logica di ripetizione dei tentativi
  • Verificare che i messaggi di errore siano facili da capire per l'utente.

Avviare e arrestare automaticamente Il proxy di sviluppo

Per semplificare il flusso di lavoro di debug, configurare VS Code per avviare automaticamente Dev Proxy all'avvio del debug e arrestarlo al termine. Installare l'estensione Dev Proxy Toolkit e configurare le attività:

File: .vscode/tasks.json

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "devproxy-start",
      "type": "devproxy",
      "command": "start",
      "args": [
        "--config-file",
        "devproxyrc.json"
      ],
      "isBackground": true,
      "problemMatcher": "$devproxy-watch"
    },
    {
      "label": "devproxy-stop",
      "type": "devproxy",
      "command": "stop"
    }
  ]
}

Per usare queste attività, aggiornare :

File: .vscode/launch.json (Node.js con avvio automatico)

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Debug with Dev Proxy",
      "skipFiles": [
        "<node_internals>/**"
      ],
      "program": "${workspaceFolder}/index.js",
      "preLaunchTask": "devproxy-start",
      "postDebugTask": "devproxy-stop",
      "env": {
        "NODE_ENV": "development",
        "http_proxy": "http://127.0.0.1:8000",
        "https_proxy": "http://127.0.0.1:8000",
        "GLOBAL_AGENT_HTTP_PROXY": "http://127.0.0.1:8000",
        "NODE_TLS_REJECT_UNAUTHORIZED": "0"
      }
    }
  ]
}

Suggerimenti per il debug efficace

  • Per raggiungere in modo coerente i punti di interruzione, impostare nella configurazione del proxy di sviluppo in modo che ogni richiesta non riesca.
  • Per comprendere come il codice gestisce un errore specifico, usare una singola risposta di errore durante il debug.
  • Per controllare che il codice rispetti la limitazione, assicurarsi che legga e segua l'intestazione durante l'analisi degli errori 429.
  • Per garantire che il codice gestisca correttamente risposte insolite, usare Dev Proxy per simulare casi perimetrali come JSON in formato non valido o intestazioni mancanti.
  • Per interrompere solo errori specifici, usare punti di interruzione condizionali in VS Code facendo clic con il pulsante destro del mouse su un punto di interruzione e aggiungendo una condizione come .

Vedere anche

  • Last updated on