Zelfstudie: Aspire toevoegen aan een bestaande .NET-app

1. Start Visual Studio en selecteer Bestand>Open>Project/Oplossing.

2. Navigeer naar de map op het hoogste niveau van de oplossing die u hebt gekloond, selecteer eShopLite.slnen selecteer vervolgens openen.

3. Klik in Solution Explorermet de rechtermuisknop op de eShopLite-oplossing en selecteer Opstartprojecten configureren.

4. Selecteer Meerdere opstartprojecten.

5. Selecteer in de kolom Actie de optie Start voor zowel de projecten Producten als Winkel.

6. Kies OK.

7. Als u de oplossing wilt opsporen, drukt u op F5- of selecteert u Start.

8. Er worden twee pagina's geopend in de browser:

   • Een pagina toont producten in JSON-formaat van een aanroep naar de Producten Web-API.
   • Op een pagina wordt de startpagina van de website weergegeven. Selecteer in het menu aan de linkerkant Producten om de catalogus te bekijken die u hebt verkregen via de web-API.

9. Sluit de browser om de foutopsporing te stoppen.

1. Start Visual Studio Code en open de map die je hebt gekloond. Voer vanuit de terminal waar u de opslagplaats hebt gekloond de volgende opdracht uit:

   code .
   

2. Selecteer het menu-item Uitvoeren en fouten opsporen of druk op Ctrl+Shift+D.

3. Selecteer de een launch.json bestand maken koppeling.

   

4. Kopieer en plak de volgende JSON in dit bestand en opslaan.

   • Unix
   • Windows

   {
       "version": "0.2.0",
       "compounds": [
           {
               "name": "Run all",
               "configurations": [
                   "Run products",
                   "Run store",
               ]
           }
       ],
       "configurations": [
           {
               "name": "Run products",
               "type": "dotnet",
               "request": "launch",
               "projectPath": "${workspaceFolder}/Products/Products.csproj"
           },
           {
               "name": "Run store",
               "type": "dotnet",
               "request": "launch",
               "projectPath": "${workspaceFolder}/Store/Store.csproj"
           }
       ]
   }
   

5. Als u de oplossing wilt opsporen, drukt u op F5- of selecteert u Start.

6. Er worden twee pagina's geopend in de browser:

   • Een pagina toont producten in JSON-formaat van een aanroep naar de Producten Web-API.
   • Op een pagina wordt de startpagina van de website weergegeven. Selecteer in het menu aan de linkerkant Producten om de catalogus te bekijken die u hebt verkregen via de web-API.

7. Als u de foutopsporing wilt stoppen, sluit u de browser en selecteert u vervolgens tweemaal de knop Stop (eenmaal voor elk actieve foutopsporingsexemplaren).

1. Open een terminalvenster en wijzig mappen in de zojuist gekloonde opslagplaats.

2. Voer de volgende opdracht uit om de Products-app te starten:

   dotnet run --project ./Products/Products.csproj
   

3. Er wordt een browserpagina geopend, die de JSON toont voor de producten.

4. Open een nieuw terminalvenster en navigeer opnieuw naar de gekloneerde opslagplaats.

5. Start de Store-app door de volgende opdracht uit te voeren:

   dotnet run --project ./Store/Store.csproj
   

6. De browser opent een pagina waarop de startpagina van de website wordt weergegeven. Selecteer in het menu aan de linkerkant Producten om de catalogus te bekijken die u hebt verkregen via de web-API.

7. Als u de foutopsporing wilt stoppen, sluit u de browser en drukt u op Ctrl+C- in beide terminals.

1. Klik Visual Studioin Solution Explorer met de rechtermuisknop op het Store-project , selecteer Toevoegen en selecteer Aspire Vervolgens Orchestrator-ondersteuning.

2. Selecteer Aspire in het dialoogvenster Orchestrator-ondersteuning toevoegen.

   

U hebt nu twee nieuwe projecten, beide toegevoegd aan de oplossing:

• eShopLite.AppHost: een orchestratorproject dat is ontworpen om de verschillende projecten en services van uw app te verbinden en te configureren. De orchestrator is ingesteld als het opstartprojecten is afhankelijk van het eShopLite.Store project.
• eShopLite.ServiceDefaults: een Aspire gedeeld project voor het beheren van configuraties die opnieuw worden gebruikt in de projecten in uw oplossing met betrekking tot tolerantie, servicedetectie en telemetrie.

Open in het project eShopLite.AppHost het bestand AppHost.cs. Let op deze coderegel, waarmee het Store-project wordt geregistreerd in de Aspire indeling:

builder.AddProject<Projects.Store>("store");

Zie AddProjectvoor meer informatie.

Het project Producten toevoegen aan Aspire:

1. Klik Visual Studioin Solution Explorer met de rechtermuisknop op het project Producten , selecteer Toevoegen en selecteer Aspire Orchestrator-ondersteuning.

2. Een dialoogvenster dat aangeeft dat Aspire het Orchestrator-project al bestaat, selecteert u OK.

   

Open in het project eShopLite.AppHost het bestand AppHost.cs. Let op deze coderegel, waarmee het Products project wordt geregistreerd in de Aspire orchestratie.

builder.AddProject<Projects.Products>("products");

U ziet ook dat het project eShopLite.AppHost nu afhankelijk is van zowel de Store als Products projecten.

Een AppHost-project maken

Als u de bestaande projecten wilt organiseren, moet u een nieuw AppHost-project maken. Als u een nieuw AppHost-project wilt maken op basis van de beschikbare Aspire sjablonen, gebruikt u de volgende .NET CLI-opdracht:

dotnet new aspire-apphost -o eShopLite.AppHost

Voeg het AppHost-project toe aan een bestaande oplossing:

dotnet sln ./eShopLite.sln add ./eShopLite.AppHost/eShopLite.AppHost.csproj

dotnet sln .\eShopLite.sln add .\eShopLite.AppHost\eShopLite.AppHost.csproj

Voeg het Store-project toe als een projectreferentie aan het AppHost-project met behulp van de volgende .NET CLI-opdracht:

dotnet add ./eShopLite.AppHost/eShopLite.AppHost.csproj reference ./Store/Store.csproj

dotnet add .\eShopLite.AppHost\eShopLite.AppHost.csproj reference .\Store\Store.csproj

Zie Aspire sjablonen voor meer informatie over de beschikbare sjablonen.

Een 'service defaults' project maken

Nadat het AppHost-project is gemaakt, moet u een nieuw standaardproject voor de service maken. Gebruik de volgende CLI-opdracht om een nieuw project met standaardservices te maken op basis van de beschikbare sjablonen:

dotnet new aspire-servicedefaults -o eShopLite.ServiceDefaults

Gebruik de volgende .NET CLI-opdracht om het project toe te voegen aan de oplossing:

dotnet sln ./eShopLite.sln add ./eShopLite.ServiceDefaults/eShopLite.ServiceDefaults.csproj

dotnet sln .\eShopLite.sln add .\eShopLite.ServiceDefaults\eShopLite.ServiceDefaults.csproj

Werk het AppHost-project bij om een projectreferentie toe te voegen aan het project Producten :

dotnet add ./eShopLite.AppHost/eShopLite.AppHost.csproj reference ./Products/Products.csproj

dotnet add .\eShopLite.AppHost\eShopLite.AppHost.csproj reference .\Products\Products.csproj

Zowel de projecten Store als Products moeten verwijzen naar de standaardinstellingen van de -service project, zodat ze eenvoudig servicedetectiekunnen bevatten. Gebruik de volgende CLI-opdracht om een verwijzing naar het service defaults project toe te voegen in het Store project:

dotnet add ./Store/Store.csproj reference ./eShopLite.ServiceDefaults/eShopLite.ServiceDefaults.csproj

dotnet add .\Store\Store.csproj reference .\eShopLite.ServiceDefaults\eShopLite.ServiceDefaults.csproj

Gebruik dezelfde opdracht met enigszins andere paden om een verwijzing toe te voegen aan het service defaults project in het Products project.

dotnet add ./Products/Products.csproj reference ./eShopLite.ServiceDefaults/eShopLite.ServiceDefaults.csproj

dotnet add .\Products\Products.csproj reference .\eShopLite.ServiceDefaults\eShopLite.ServiceDefaults.csproj

Werk in de projecten Store en Products hun Program.cs-bestanden bij en voeg de volgende regel toe direct na de var builder = WebApplication.CreateBuilder(args); regel:

builder.AddServiceDefaults();

Het AppHost-project bijwerken

Open het AppHost.cs bestand van het AppHost-project en vervang de inhoud door de volgende C#-code:

var builder = DistributedApplication.CreateBuilder(args);

builder.AddProject<Projects.Store>("store");

builder.AddProject<Projects.Products>("products");

builder.Build().Run();

De voorgaande code:

• Hiermee maakt u een nieuw DistributedApplicationBuilder-exemplaar.
• Hiermee voegt u het Store-project toe aan de orchestrator.
• Hiermee voegt u het project Products toe aan de orchestrator.
• Bouwt en voert de orchestrator uit.

1. In Visual Studio, druk op F5om te beginnen met foutopsporing,Visual Studio bouwt de projecten.
2. Als het Start Docker Bureaublad dialoogvenster verschijnt, selecteert u Ja. Visual Studio start de Docker-engine en maakt de benodigde containers. Wanneer de implementatie is voltooid, wordt het Aspire dashboard weergegeven.
3. Selecteer in het dashboard het eindpunt voor de producten project. Er wordt een nieuw browsertabblad weergegeven en de productcatalogus wordt weergegeven in JSON indeling.
4. Selecteer in het dashboard het eindpunt voor het winkel project. Er wordt een nieuw browsertabblad weergegeven en de startpagina voor de web-app wordt weergegeven.
5. In het menu aan de linkerkant, selecteer Producten. De productcatalogus wordt weergegeven.
6. Sluit de browser om de foutopsporing te stoppen.

Verwijder het launch.json bestand dat u eerder hebt gemaakt. Het is niet langer bedoeld. Start in plaats daarvan het AppHost-project , waarmee de andere projecten worden ingedeeld:

1. Start het AppHost-project door met de rechtermuisknop te klikken op het project eShopLite.AppHost in Solution Explorer en de foutopsporing>Start New Instance te selecteren:

   

   Note

   Als Docker Desktop (of Podman) niet wordt uitgevoerd, treedt er een fout op. Start de containerruntime en probeer het opnieuw.

1. Start het AppHost-project door de volgende opdracht uit te voeren:

   dotnet run --project ./eShopLite.AppHost/eShopLite.AppHost.csproj
   

   Note

   Als Docker Desktop (of Podman) niet wordt uitgevoerd, treedt er een fout op. Start de containerruntime en probeer het opnieuw.

2. Selecteer in het dashboard het eindpunt voor de producten project. Er wordt een nieuw browsertabblad weergegeven en de productcatalogus wordt weergegeven in JSON indeling.
3. Selecteer in het dashboard het eindpunt voor het winkel project. Er wordt een nieuw browsertabblad weergegeven en de startpagina voor de web-app wordt weergegeven.
4. In het menu aan de linkerkant, selecteer Producten. De productcatalogus wordt weergegeven.
5. Sluit de browser om de foutopsporing te stoppen.