Dev Proxy gebruiken met Aspire-toepassingen

In één oogopslag
Doel: Dev Proxy gebruiken met Aspire
Tijd: 15 minuten
Plugins: Verschillende
Vereisten:Dev Proxy instellen, Aspire

Aspire is een gestructureerde, cloudklare stack voor het bouwen van productieklare, waarneembare en gedistribueerde toepassingen. Het is gebouwd op .NET en biedt een modern, snel en schaalbaar platform voor het bouwen van webtoepassingen.

Als u Dev Proxy wilt gebruiken met uw Aspire-toepassing, gebruikt u het NuGet-pakket DevProxy.Hosting. Het pakket biedt Dev Proxy Aspire-extensies om Dev Proxy gemakkelijk te integreren in uw Aspire-toepassing.

Installeer het NuGet-pakket voor Dev Proxy Aspire-extensies

Als u het NuGet-pakket Dev Proxy Aspire-extensies wilt installeren, voert u de volgende opdracht uit in de hoofdmap van uw Aspire-toepassing:

dotnet add package DevProxy.Hosting

Met behulp van het dev Proxy Aspire-uitbreidingspakket kunt u Dev Proxy integreren vanuit het lokaal geïnstalleerde uitvoerbare bestand of vanuit een Docker-container.

Dev Proxy integreren vanuit het lokaal geïnstalleerde uitvoerbare bestand

Als u Dev Proxy lokaal hebt geïnstalleerd, is de handigste manier om deze te integreren in uw Aspire-toepassing om te verwijzen naar het lokale uitvoerbare bestand. Het volgende codefragment laat zien hoe u Dev Proxy integreert vanuit het lokaal geïnstalleerde uitvoerbare bestand met de Aspire Starter-toepassing.

Belangrijk

Wanneer u Dev Proxy configureert voor het gebruik van het lokale uitvoerbare bestand, moet u ervoor zorgen dat het uitvoerbare bestand beschikbaar is op alle computers waarop u uw toepassing uitvoert. Als u Dev Proxy in een containeromgeving wilt gebruiken, kunt u overwegen om in plaats daarvan de Docker-container te gebruiken.

using DevProxy.Hosting;

var builder = DistributedApplication
    .CreateBuilder(args);

// Add an API service to the application
var apiService = builder.AddProject<Projects.AspireStarterApp_ApiService>("apiservice")
    .WithHttpsHealthCheck("/health");

var devProxy = builder.AddDevProxyExecutable("devproxy")
    .WithConfigFile(".devproxy/config/devproxy.json")
    .WithUrlsToWatch(() => [$"{apiService.GetEndpoint("https").Url}/*"]);

// Add a web frontend project and configure it to use Dev Proxy
builder.AddProject<Projects.AspireStarterApp_Web>("webfrontend")
    .WithExternalHttpEndpoints()
    .WithHttpsHealthCheck("/health")
    .WithEnvironment("HTTPS_PROXY", devProxy.GetEndpoint(DevProxyResource.ProxyEndpointName))
    .WithReference(apiService)
    .WaitFor(apiService)
    .WaitFor(devProxy);

// Build and run the application
builder.Build().Run();

Eerst voegt u met behulp van de Dev Proxy Aspire-extensies een Dev Proxy-service toe aan uw toepassing. De AddDevProxyExecutable-methode specificeert de naam van het uitvoerbare Dev Proxy-bestand. Met behulp van de WithConfigFile methode geeft u het pad op naar het configuratiebestand van de Dev Proxy. Met behulp van de WithUrlsToWatch methode geeft u de lijst met URL's op die moeten worden bekeken. In dit voorbeeld wilt u dat Dev Proxy aanvragen onderschept die de web-app aan de API-service doet.

Belangrijk

U ziet dat de WithUrlsToWatch methode een functie accepteert die een lijst met URL's retourneert die moeten worden bekeken. Dit komt doordat het API-service-eindpunt niet beschikbaar is wanneer u Dev Proxy configureert, zodat u de URL niet rechtstreeks kunt doorgeven. In plaats daarvan gebruikt u een lambda-expressie die de URL van de API-service retourneert wanneer deze beschikbaar is.

Vervolgens gebruikt u in de web-app de HTTPS_PROXY omgevingsvariabele om de web-app te configureren voor het gebruik van Dev Proxy. Met behulp van de WaitFor methode instrueert u de web-app om te wachten tot Dev Proxy beschikbaar is voordat u begint.

Dev Proxy integreren vanuit een Docker-container

U kunt Dev Proxy ook integreren in uw Aspire-toepassing vanuit een Docker-container. Het gebruik van de Docker-installatiekopie van de Dev Proxy is handig, omdat Aspire de installatiekopie automatisch ophaalt als deze niet lokaal beschikbaar is. Het nadeel is dat er nog enkele stappen zijn om Dev Proxy in uw toepassing te configureren.

In het volgende codefragment ziet u hoe u Dev Proxy integreert vanuit een Docker-container met de Aspire Starter-toepassing.

using DevProxy.Hosting;

var builder = DistributedApplication
    .CreateBuilder(args);

// Add an API service to the application
var apiService = builder.AddProject<Projects.AspireStarterApp_ApiService>("apiservice")
    .WithHttpsHealthCheck("/health");

// Add Dev Proxy as a container resource
var devProxy = builder.AddDevProxyContainer("devproxy")
    // specify the Dev Proxy configuration file; relative to the config folder
    .WithConfigFile("./devproxy.json")
    // mount the local folder with PFX certificate for intercepting HTTPS traffic
    .WithCertFolder(".devproxy/cert")
    // mount the local folder with Dev Proxy configuration
    .WithConfigFolder(".devproxy/config")
    // let Dev Proxy intercept requests to the API service
    .WithUrlsToWatch(() => [$"{apiService.GetEndpoint("https").Url}/*"]);

// Add a web frontend project and configure it to use Dev Proxy
builder.AddProject<Projects.AspireStarterApp_Web>("webfrontend")
    .WithExternalHttpEndpoints()
    .WithHttpsHealthCheck("/health")
    // set the HTTPS_PROXY environment variable to the Dev Proxy endpoint
    .WithEnvironment("HTTPS_PROXY", devProxy.GetEndpoint(DevProxyResource.ProxyEndpointName))
    .WithReference(apiService)
    .WaitFor(apiService)
    .WaitFor(devProxy);

// Build and run the application
builder.Build().Run();

De basisstappen zijn hetzelfde als wanneer u het lokaal geïnstalleerde uitvoerbare bestand gebruikt. Het belangrijkste verschil is hoe u het configuratiebestand en het certificaat voor het onderscheppen van HTTPS-verkeer opgeeft.

Wanneer u Dev Proxy integreert vanuit een Docker-container, moet u de lokale mappen koppelen aan het configuratiebestand en het certificaat in de container. In dit voorbeeld hebt u in uw Aspire-oplossing de volgende mapstructuur:

AspireStarterApp
├── .devproxy
│   ├── cert
│   │   └── rootCert.pfx
│   └── config
│       └── devproxy.json
├── Projects
│   ├── AspireStarterApp_ApiService
│   └── AspireStarterApp_Web
└── AspireStarterApp.sln

De cert map bevat het PFX-certificaat (Personal Information Exchange) dat door dev proxy wordt gebruikt om HTTPS-verkeer te onderscheppen.

Belangrijk

U moet het certificaat vertrouwen in de cert map op uw computer of aanvragen voor de API-service mislukken. Bovendien moet het certificaat, om door Dev Proxy te worden geladen, in het PFX-formaat zijn, de naam rootCert.pfx hebben en mag het niet met een wachtwoord zijn beveiligd.

De config map bevat het dev proxy-configuratiebestand en andere Dev Proxy-bestanden, zoals mocks of fouten.

Omdat u het certificaat en de configuratiebestanden aan het koppelen bent om volumes in de container te scheiden, moeten ze worden opgeslagen in afzonderlijke mappen.

Dev Proxy gebruiken met de Aspire Starter-toepassing

Nadat u de toepassing hebt gestart, wordt Dev Proxy weergegeven als een resource in de toepassing.

Schermopname van het Aspire-dashboard met toepassingsbronnen, waaronder Dev Proxy.

Wanneer u de webtoepassing gebruikt zodat deze aanvragen naar de API-service doet, onderschept Dev Proxy de aanvragen en verwerkt deze op basis van uw configuratie. U kunt de uitvoer van de Dev Proxy zien in de sectie Console van het Aspire-dashboard.

Schermopname van het Aspire-dashboard met de uitvoer van de Dev Proxy-console.

Zie ook