Partilhar via


Quickstart: Crie uma solução Aspire com Configuração de Aplicações do Azure

Neste quickstart, vais usar o Azure App Configuration para externalizar o armazenamento e a gestão das definições da tua aplicação para um projeto Aspire. Irá utilizar as bibliotecas de integração Azure App Configuration Aspire para provisionar um recurso de Configuração de Aplicações e utilizar a Configuração de Aplicações em cada aplicação distribuída.

Pré-requisitos

Testar o aplicativo localmente

O modelo Aspire Starter inclui uma aplicação web frontend que comunica com um projeto Minimal API. O projeto API é usado para fornecer dados meteorológicos falsos ao frontend. O aplicativo frontend é configurado para usar a descoberta de serviço para se conectar ao projeto de API. Existe também um AppHost projeto que orquestra todas as aplicações distribuídas na solução Aspire.

  1. Execute o projeto AppHost. Vês o painel do Aspire no teu navegador.

    Captura de ecrã do painel do Aspire com recursos de interface web e serviços API.

  2. Clique na URL da interface web. Vês uma página com uma mensagem de boas-vindas.

    Captura de ecrã de uma aplicação web com uma mensagem de boas-vindas.

Adicionar a Configuração de Aplicações Azure à solução Aspire

  1. Navegue até ao AppHost diretório do projeto. Execute o seguinte comando para adicionar o Aspire.Hosting.Azure.AppConfiguration pacote Nuget.

    dotnet add package Aspire.Hosting.Azure.AppConfiguration
    
  2. Abra o ficheiro AppHost.csproj para verificar os pacotes. Deverias ver um pacote nomeado Aspire.Hosting.AppHost a ser referenciado. Certifique-se de que a Aspire.Hosting.AppHost versão do pacote é pelo menos tão alta quanto a versão Aspire.Hosting.Azure.AppConfiguration que foi instalada.

  3. Abra o ficheiro AppHost.cs e adicione o seguinte código.

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

    Importante

    Quando liga AddAzureAppConfiguration, instrui a aplicação a gerar recursos Azure dinamicamente durante o arranque da aplicação. O aplicativo deve configurar a assinatura e o local apropriados. Para mais informações, consulte Local Azure provisioning. Se estiver a usar o mais recente SDK do Aspire, pode configurar a informação da subscrição através do painel do Aspire. Captura de ecrã do painel da Aspire a pedir informações de subscrição Azure.

    Observação

    Deve ter o papel de Proprietário ou Administrador de Acesso ao Utilizador atribuído na subscrição do Azure. Estas funções são necessárias para criar atribuições de funções como parte do processo de provisionamento.

    Sugestão

    Pode consultar recursos existentes de Configuração de Aplicações encadeando uma chamada RunAsExisting() em builder.AddAzureAppConfiguration("appconfig"). Para mais informações, consulte Utilizar recursos Azure existentes.

  4. Adicione a referência do recurso de Configuração da Aplicação e configure o projeto webfrontend para aguardar por ela.

    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
    
  5. Execute o projeto AppHost. Vê que o recurso de Configuração da Aplicação Azure está a fazer provisionamento.

    Captura de ecrã do painel Aspire a provisionar o recurso Azure App Configuration.

  6. Espere alguns minutos e verá que o recurso de configuração da aplicação Azure está provisionado e a correr.

    Captura de ecrã do painel do Aspire com recurso de configuração de aplicações Azure a correr.

  7. Aceda ao portal Azure clicando no URL de implementação no painel da Aspire. Vê que a implementação está concluída e pode aceder ao seu recurso de Configuração de Aplicações Azure.

    Captura de ecrã do portal Azure mostrando que a implementação da Configuração da App está completa.

Adicionar um valor-chave

Adicione a seguinte chave-valor à sua loja de Configuração de Aplicações e deixe Rótulo e Tipo de Conteúdo com os seus valores predefinidos. Para obter mais informações sobre como adicionar valores-chave a uma loja usando o portal do Azure ou a CLI, vá para Criar um valor-chave.

Key Valor
TestApp:Configurações:Mensagem Olá do Configurador de Aplicações do Azure!

Adicionar a Configuração de Aplicações Azure à solução Aspire

  1. Navegue até ao AppHost diretório do projeto. Execute o seguinte comando para adicionar o Aspire.Hosting.Azure.AppConfiguration pacote Nuget.

    dotnet add package Aspire.Hosting.Azure.AppConfiguration
    
  2. Abre o AppHost.csproj. Certifique-se de que a Aspire.Hosting.AppHost versão do pacote não é anterior à versão que instalou. Caso contrário, tens de atualizar o Aspire.Hosting.AppHost pacote.

  3. Abra o ficheiro AppHost.cs e adicione o seguinte código.

    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();
        });
    

    Importante

    Quando chamas RunAsEmulator, ele extrai a imagem do emulador de Configuração de Aplicações e executa um contentor que atua como recurso de Configuração de Aplicações. Certifica-te de que tens um runtime de contentores compatível com OCI na tua máquina. Para mais informações, consulte Aspire Container Runtime.

    Sugestão

    Pode chamar WithDataBindMount ou WithDataVolume configurar o recurso do emulador para armazenamento persistente em contentores, de modo a não precisar de recriar valores-chave a cada vez.

  4. Adicione a referência do recurso de Configuração da Aplicação e configure o projeto webfrontend para aguardar por ela.

    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
    
  5. Inicia o runtime do seu contentor. Neste tutorial, usamos o Docker Desktop.

  6. Execute o projeto AppHost. Vai ao painel do Aspire. Vê que o recurso do emulador App Configuration está a funcionar.

    Captura de ecrã do painel do Aspire a mostrar o recurso do emulador de Configuração de Aplicações.

    É iniciado um contentor para executar o emulador de Configuração da Aplicação.

    Captura de ecrã do ambiente de trabalho docker a correr um container.

Adicionar um valor-chave

  1. Clique na URL do recurso appconfiguration. Vê a interface do emulador de configuração de aplicações.

  2. Clica no Create botão no canto superior direito.

    Captura de ecrã da interface do emulador de configuração da aplicação.

  3. Adicione a seguinte chave-valor.

    Key Valor
    TestApp:Configurações:Mensagem Olá do Configurador de Aplicações do Azure!
  4. Clique no botão Save.

    Captura de ecrã da interface do emulador de configuração da aplicação a criar um novo valor-chave.

Use a Configuração de Aplicações na aplicação web

  1. Navegue até ao Web diretório do projeto. Execute o seguinte comando para adicionar o Aspire.Microsoft.Extensions.Configuration.AzureAppConfiguration pacote Nuget.

    dotnet add package Aspire.Microsoft.Extensions.Configuration.AzureAppConfiguration
    
  2. Abra o ficheiro Program.cs e adicione o seguinte código.

    var builder = WebApplication.CreateBuilder(args);
    
    // Use Azure App Configuration
    builder.AddAzureAppConfiguration("appconfiguration"); // use the resource name defined in the AppHost project
    
  3. Abra o ficheiro Components/Pages/Home.razor e atualize-o com o seguinte código.

    @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. Reinicia o AppHost projeto. Vai ao painel da Aspire e clica no URL da interface web.

    Captura de ecrã do painel do Aspire a mostrar recursos.

  5. Vês uma página com uma mensagem de boas-vindas do Azure App Configuration.

    Captura de ecrã de uma aplicação web com uma mensagem de boas-vindas do Azure App Configuration.

Próximos passos

Neste guia de início rápido, você irá:

  • Adicionei um recurso de Configuração de Aplicações Azure numa solução Aspire.
  • Leia os seus valores-chave do Azure App Configuration com a biblioteca de integração App Configuration Aspire.
  • Apresentou uma página web usando as definições que configurou na Configuração da Aplicação.

Para aprender a configurar a sua aplicação Aspire para atualizar dinamicamente as definições, continue para o próximo tutorial.

Para aprender a usar feature flags na sua aplicação Aspire, siga para o próximo tutorial.

Para saber mais sobre o emulador Azure App Configuration, continue para o seguinte documento.