Quickstart: Een ASP.NET Core-app maken met Azure App Configuration

In deze quickstart gebruikt u Azure App Configuration om de opslag en het beheer van uw app-instellingen voor een ASP.NET Core-app te externaliseren. ASP.NET Core bouwt één configuratieobject op basis van sleutelwaarden met behulp van instellingen van een of meer configuratieproviders. App Configuration biedt een .NET-configuratieproviderbibliotheek. Daarom kunt u App Configuration gebruiken als extra configuratiebron voor uw app. Als u een bestaande app hebt, hebt u slechts enkele kleine wijzigingen in de opstartcode van uw app nodig om app-configuratie te gaan gebruiken.

Vereiste voorwaarden

• Een Azure-account met een actief abonnement. Maak gratis een account.
• Een App Configuration-winkel, zoals uiteengezet in de zelfstudie voor het maken van een winkel.
• .NET SDK 6.0 of hoger

Sleutelwaarden toevoegen

Voeg de volgende sleutelwaarden toe aan het App Configuration-archief en laat label en inhoudstype ongewijzigd met de standaardwaarden. Ga naar Een sleutelwaarde maken voor meer informatie over het toevoegen van sleutelwaarden aan een opslag met de Azure Portal of de CLI.

Een ASP.NET Core-web-app maken

Gebruik de .NET-opdrachtregelinterface (CLI) om een nieuw ASP.NET Core-web-app-project te maken. De Azure Cloud Shell biedt deze hulpprogramma's voor u. Ze zijn ook beschikbaar op de Windows-, macOS- en Linux-platforms.

Voer het volgende commando uit om een ASP.NET Core-web-app te maken in een nieuwe map TestAppConfig:

dotnet new webapp --output TestAppConfig

Verbinding maken met het App Configuration-archief

Maak verbinding met uw App Configuration-winkel door middel van Microsoft Entra ID (aanbevolen) of een connectiestring.

1. Navigeer naar de map TestAppConfig van het project en voer de volgende opdracht uit om NuGet-pakketverwijzingen toe te voegen.

   • Microsoft Entra-id (aanbevolen)
   • Verbindingsstring

   dotnet add package Microsoft.Azure.AppConfiguration.AspNetCore
   dotnet add package Azure.Identity
   

2. Maak een gebruikersgeheim voor de toepassing door naar de map TestAppConfig te navigeren en de volgende opdracht uit te voeren.

   • Microsoft Entra-id (aanbevolen)
   • Verbindingsstring

   De opdracht maakt gebruik van Secret Manager voor het opslaan van een geheim met de naam Endpoints:AppConfiguration, waarin het eindpunt voor uw App Configuration-archief wordt opgeslagen. Vervang de tijdelijke aanduiding door het <your-App-Configuration-endpoint> eindpunt van uw App Configuration-archief. U vindt het eindpunt op de blade Overzicht van uw App Configuration-archief in Azure Portal.

   dotnet user-secrets init
   dotnet user-secrets set Endpoints:AppConfiguration "<your-App-Configuration-endpoint>"
   

3. Open Program.cs en voeg de volgende naamruimten toe:

   • Microsoft Entra-id (aanbevolen)
   • Verbindingsstring

   using Microsoft.Extensions.Configuration;
   using Microsoft.Azure.AppConfiguration.AspNetCore;
   using Azure.Identity;
   

4. Maak verbinding met uw App Configuration-archief door de AddAzureAppConfiguration methode in het Program.cs bestand aan te roepen.

   • Microsoft Entra-id (aanbevolen)
   • Verbindingsstring

   U gebruikt de DefaultAzureCredential om u te authentiseren bij uw App Configuration-opslagplaats. Volg de instructies om uw referentie de rol App Configuration Data Reader toe te wijzen. Zorg ervoor dat u voldoende tijd geeft voor de machtiging om zich te verspreiden voordat u de toepassing uitvoert.

   var builder = WebApplication.CreateBuilder(args); 
   
   // Retrieve the endpoint
   string endpoint = builder.Configuration.GetValue<string>("Endpoints:AppConfiguration")
       ?? throw new InvalidOperationException("The setting `Endpoints:AppConfiguration` was not found.");
   
   // Load configuration from Azure App Configuration 
   builder.Configuration.AddAzureAppConfiguration(options =>
   {
       options.Connect(new Uri(endpoint), new DefaultAzureCredential());
   });
   
   // The rest of existing code in program.cs
   // ... ...    
   

   Met deze code worden alle sleutelwaarden geladen die geen label hebben uit uw App Configuration-archief. Zie de API-verwijzing van de App Configuration-provider voor meer informatie over het laden van gegevens uit App Configuration.

Lezen uit de App Configuration-opslag

In dit voorbeeld werkt u een webpagina bij om de inhoud ervan weer te geven met behulp van de instellingen die u hebt geconfigureerd in uw App Configuration-archief.

1. Voeg een Settings.cs-bestand toe aan de hoofdmap van uw projectmap. Er wordt een sterk getypte klasse gedefinieerd Settings voor de configuratie die u gaat gebruiken. Vervang de naamruimte door de naam van uw project.

   namespace TestAppConfig
   {
       public class Settings
       {
           public string BackgroundColor { get; set; }
           public long FontSize { get; set; }
           public string FontColor { get; set; }
           public string Message { get; set; }
       }
   }
   

2. Bind de TestApp:Settings sectie in de configuratie aan het Settings object.

   Werk Program.cs bij met de volgende code en voeg de TestAppConfig naamruimte toe aan het begin van het bestand.

   using TestAppConfig;
   
   // Existing code in Program.cs
   // ... ...
   
   builder.Services.AddRazorPages();
   
   // Bind configuration "TestApp:Settings" section to the Settings object
   builder.Services.Configure<Settings>(builder.Configuration.GetSection("TestApp:Settings"));
   
   var app = builder.Build();
   
   // The rest of existing code in program.cs
   // ... ...
   

3. Open Index.cshtml.cs in de map Pagina's en werk de IndexModel klasse bij met de volgende code. Voeg de using Microsoft.Extensions.Options naamruimte toe aan het begin van het bestand, als dit nog niet is gebeurd.

   public class IndexModel : PageModel
   {
       private readonly ILogger<IndexModel> _logger;
   
       public Settings Settings { get; }
   
       public IndexModel(IOptionsSnapshot<Settings> options, ILogger<IndexModel> logger)
       {
           Settings = options.Value;
           _logger = logger;
       }
   }
   

4. Open Index.cshtml in de map Pages en werk de inhoud bij met de volgende code.

   @page
   @model IndexModel
   @{
       ViewData["Title"] = "Home page";
   }
   
   <style>
       body {
           background-color: @Model.Settings.BackgroundColor;
       }
   
       h1 {
           color: @Model.Settings.FontColor;
           font-size: @(Model.Settings.FontSize)px;
       }
   </style>
   
   <h1>@Model.Settings.Message</h1>
   

De app lokaal bouwen en uitvoeren

1. Als u de app wilt bouwen met behulp van de .NET CLI, gaat u naar de hoofdmap van uw project. Voer de volgende opdracht uit in de opdrachtshell:

   dotnet build
   

2. Nadat de build is voltooid, voert u de volgende opdracht uit om de web-app lokaal uit te voeren:

   dotnet run
   

3. De uitvoer van de dotnet run opdracht bevat twee URL's. Open een browser en navigeer naar een van deze URL's om toegang te krijgen tot uw toepassing. Voorbeeld: https://localhost:5001.

   Als u in Azure Cloud Shell werkt, selecteert u de knop Webvoorbeeld , gevolgd door Configureren. Wanneer u wordt gevraagd om de poort voor preview te configureren, voert u 5000 in en selecteert u Openen en bladeren.

   

   De webpagina ziet er als volgt uit:

De hulpbronnen opschonen

Als u de resources die in dit artikel zijn gemaakt niet wilt blijven gebruiken, verwijdert u de resourcegroep die u hier hebt gemaakt om kosten te voorkomen.

1. Meld u aan bij de Azure-portal en selecteer Resourcegroepen.
2. Voer in het vak Filteren op naam de naam van uw resourcegroep in.
3. Selecteer in de resultatenlijst de resourcegroepnaam om een overzicht te bekijken.
4. Selecteer Resourcegroep verwijderen.
5. U wordt gevraagd om het verwijderen van de resourcegroep te bevestigen. Voer de naam van de resourcegroep in die u wilt bevestigen en selecteer Verwijderen.

Na enkele ogenblikken worden de resourcegroep en alle bijbehorende resources verwijderd.

Volgende stappen

In deze snelstart, gaat u het volgende doen:

• Er is een nieuwe App Configuration-opslag ingesteld.
• Verbonden met uw App Configuration-archief met behulp van de App Configuration-providerbibliotheek.
• Lees de sleutelwaarden van uw App Configuration store met de configuratieproviderbibliotheek.
• Er wordt een webpagina weergegeven met behulp van de instellingen die u hebt geconfigureerd in uw App Configuration-archief.

Als u wilt weten hoe u uw ASP.NET Core-web-app configureert om configuratie-instellingen dynamisch te vernieuwen, gaat u verder met de volgende zelfstudie.