Snabbstart: Skapa en Aspire-lösning med Azure App Configuration

I denna quickstart använder du Azure App Configuration för att externalisera lagring och hantering av dina appinställningar för ett Aspire-projekt. Du använder Azure App Configuration Aspire-integrationsbibliotek för att tillhandahålla en App Configuration-resurs och använder App Configuration i varje distribuerad app.

Förutsättningar

Testa appen lokalt

Mallen Aspire Starter innehåller en klientwebbapp som kommunicerar med ett minimalt API-projekt. API-projektet tillhandahåller falska väderdata till frontend. Frontend-appen använder serviceupptäckt för att ansluta till API-projektet. En AppHost orkestrerar alla resurser i Aspire-lösningen.

  1. Från lösningsroten, kör AppHost:

    aspire run
    

    Du ser Aspire-instrumentpanelen i din webbläsare.

    Skärmbild av Aspire-instrumentpanelen med webbklientdels- och API-tjänstresurser.

  2. Klicka på URL:en för webbklientdelen. Du ser en sida med ett välkomstmeddelande.

    Skärmbild av en webbapp med ett välkomstmeddelande.

Lägga till Azure App Configuration i Aspire-lösningen

  1. Gå till AppHost-katalogen. Kör följande kommando för att lägga till Aspire.Hosting.Azure.AppConfiguration NuGet-paketet.

    aspire add Aspire.Hosting.Azure.AppConfiguration
    

    För mer information, se aspire addintegration av Azure App Configuration Hosting.

  2. Öppna filen AppHost.cs och lägg till följande kod.

    var builder = DistributedApplication.CreateBuilder(args);
    
    // Add an Azure App Configuration resource
    var appConfiguration = builder.AddAzureAppConfiguration("appconfiguration");
    

    Viktigt!

    När du anropar AddAzureAppConfigurationinstruerar du appen att generera Azure-resurser dynamiskt under appstarten. Appen måste konfigurera lämplig prenumeration och plats. Mer information finns i Lokal Azure-etablering. Om du använder den senaste Aspire SDK:en kan du konfigurera prenumerationsinformationen via Aspire-instrumentpanelen. Skärmdump av Aspire-dashboardens Ändra Azure-kontextdialog.

    Anmärkning

    Du måste ha rollen Ägare eller Administratör för användaråtkomst tilldelad för Azure-prenumerationen. Dessa roller krävs för att skapa rolltilldelningar som en del av etableringsprocessen.

    Tips/Råd

    Referera till en befintlig App Configuration-butik genom att skicka dess namn och resursgrupp som parametrar till AsExisting():

    var storeName = builder.AddParameter("appConfigurationName");
    var resourceGroup = builder.AddParameter("appConfigurationResourceGroup");
    
    var appConfiguration = builder.AddAzureAppConfiguration("appconfiguration")
        .AsExisting(storeName, resourceGroup);
    

    För mer information, se Använd befintliga Azure-resurser.

  3. Lägg till referensen för appkonfigurationsresursen webfrontend och konfigurera projektet att vänta på den.

    builder.AddProject<Projects.AspireApp_Web>("webfrontend")
        .WithExternalHttpEndpoints()
        .WithHttpHealthCheck("/health")
        .WithReference(apiService)
        .WaitFor(apiService)
        .WithReference(appConfiguration) // reference the App Configuration resource
        .WaitFor(appConfiguration); // wait for the App Configuration resource to enter the Running state before starting the resource
    
  4. Från lösningsroten, kör aspire run. Du ser att Azure App Configuration-resursen provisioneras.

    Skärmbild av Aspire-instrumentpanel för tilldelning av Azure App Configuration-resursen.

  5. Vänta några minuter så ser du att Azure App Configuration-resursen har etablerats och körs.

    Skärmbild av Aspire-instrumentpanelen med Azure App Configuration-resursen igång.

  6. Gå till Azure-portalen genom att klicka på distributions-URL:en på Aspire-instrumentpanelen. Du ser att distributionen är klar och du kan gå till din Azure App Configuration-resurs.

    Skärmbild av Azure-portalen som visar att appkonfigurationsdistributionen är klar.

Lägga till ett nyckelvärde

Lägg till följande nyckelvärde i appkonfigurationsarkivet och lämna Etikett och innehållstyp med sina standardvärden. Mer information om hur du lägger till nyckelvärden i en lagring med hjälp av Azure-portalen eller CLI finns i Skapa ett nyckelvärde.

Key Värde
TestApp:Settings:Message Hej från Azure App Configuration!

Lägga till Azure App Configuration i Aspire-lösningen

  1. Gå till AppHost-katalogen . Kör följande kommando för att lägga till Aspire.Hosting.Azure.AppConfiguration NuGet-paketet.

    aspire add Aspire.Hosting.Azure.AppConfiguration
    

    För mer information, se aspire addintegration av Azure App Configuration Hosting.

  2. Öppna filen AppHost.cs och lägg till följande kod.

    var builder = DistributedApplication.CreateBuilder(args);
    
    // Add an Azure App Configuration resource
    var appConfiguration = builder.AddAzureAppConfiguration("appconfiguration")
        .RunAsEmulator(emulator => { // use the App Configuration emulator
            emulator.WithDataBindMount();
        });
    

    Viktigt!

    När du anropar RunAsEmulatorhämtas appkonfigurationsemulatorns avbildning och en container körs som appkonfigurationsresurs. Kontrollera att du har en OCI-kompatibel containerkörning på datorn. Mer information finns i Aspire Container Runtime.

    Tips/Råd

    Du kan anropa WithDataBindMount eller WithDataVolume konfigurera emulatorresursen för beständig containerlagring så att du inte behöver återskapa nyckelvärden varje gång.

  3. Lägg till referensen för appkonfigurationsresursen webfrontend och konfigurera projektet att vänta på den.

    builder.AddProject<Projects.AspireApp_Web>("webfrontend")
        .WithExternalHttpEndpoints()
        .WithHttpHealthCheck("/health")
        .WithReference(apiService)
        .WaitFor(apiService)
        .WithReference(appConfiguration) // reference the App Configuration resource
        .WaitFor(appConfiguration); // wait for the App Configuration resource to enter the Running state before starting the resource
    
  4. Starta containerkörningen. I den här handledningen använder vi Docker Desktop.

  5. Från lösningsroten, kör aspire run. Gå till Aspire-instrumentpanelen. Du ser att appkonfigurationsemulatorresursen körs.

    Skärmbild av Instrumentpanelen Aspire som visar appkonfigurationsemulatorresursen.

    En container har startats för att köra appkonfigurationsemulatorn.

    Skärmbild av docker-skrivbordet som kör en container.

Lägga till ett nyckelvärde

  1. Klicka på resursens appconfiguration URL. Du ser användargränssnittet för appkonfigurationsemulatorn.

  2. Create Klicka på knappen i det övre högra hörnet.

    Skärmbild av användargränssnittet för appkonfigurationsemulatorn.

  3. Lägg till följande nyckelvärde.

    Key Värde
    TestApp:Settings:Message Hej från Azure App Configuration!
  4. Klicka på knappen Save.

    Skärmbild av appkonfigurationsemulatorns användargränssnitt för att skapa ett nytt nyckelvärde.

Använda App Configuration i webbprogrammet

  1. Gå till Web projektets katalog. Kör följande kommando för att lägga till Aspire.Microsoft.Extensions.Configuration.AzureAppConfiguration NuGet-paketet.

    dotnet add package Aspire.Microsoft.Extensions.Configuration.AzureAppConfiguration
    
  2. Öppna filen Program.cs och lägg till följande kod.

    var builder = WebApplication.CreateBuilder(args);
    
    // Use Azure App Configuration
    builder.AddAzureAppConfiguration("appconfiguration"); // use the resource name defined in the AppHost project
    
  3. Öppna filen Components/Pages/Home.razor och uppdatera den med följande kod.

    @page "/"
    
    @inject IConfiguration Configuration
    
    <PageTitle>Home</PageTitle>
    
    <h1>Hello, world!</h1>
    
    @if (!string.IsNullOrWhiteSpace(message))
    {
        <div class="alert alert-info">@message</div>
    }
    else
    {
        <div class="alert alert-info">Welcome to your new app.</div>
    }
    
    @code {
        private string? message;
    
        protected override void OnInitialized()
        {
            string? msg = Configuration["TestApp:Settings:Message"];
            message = string.IsNullOrWhiteSpace(msg) ? null : msg;
        }
    }
    
  4. Stoppa den aktuella aspire run processen, kör aspire run igen och välj sedan webbfrontend-URL:en i Aspire-dashboarden.

    Skärmbild av Aspire-instrumentpanelen som visar resurser.

  5. Du ser en sida med ett välkomstmeddelande från Azure App Configuration.

    Skärmbild av en webbapp med ett välkomstmeddelande från Azure App Configuration.

För mer information om hur konsumentapplikationer tar emot och använder App Configuration-endpointen, se Connect to Azure App Configuration.

Nästa steg

I den här snabbstarten kommer du att göra följande:

  • Lade till en Azure App Configuration-resurs i en Aspire-lösning.
  • Läs dina nyckelvärden från Azure App Configuration med integrationsbiblioteket för App Configuration Aspire.
  • Visade en webbsida med de inställningar som du konfigurerade i appkonfigurationen.

Om du vill lära dig hur du konfigurerar din Aspire-app för att dynamiskt uppdatera konfigurationsinställningarna fortsätter du till nästa självstudie.

Om du vill lära dig hur du använder funktionsflaggor i din Aspire-app, gå vidare till nästa handledning.

Om du vill veta mer om Azure App Configuration-emulatorn fortsätter du till följande dokument.