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

Neste guia de início rápido, utiliza o Azure App Configuration para externalizar o armazenamento e a gestão das definições da sua aplicação de um projeto Aspire. Utiliza-se as bibliotecas de integração Azure App Configuration Aspire para provisionar um recurso de Configuração de Aplicações e usar 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 fornece dados meteorológicos falsos para o frontend. A aplicação frontend utiliza a descoberta de serviços para se ligar ao projeto API. Um AppHost orquestra todos os recursos da solução Aspire.

  1. A partir da raiz da solução, execute o AppHost:

    aspire run

    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. Vai ao diretório AppHost. Execute o seguinte comando para adicionar o Aspire.Hosting.Azure.AppConfiguration pacote NuGet.

    aspire add Aspire.Hosting.Azure.AppConfiguration

    Para mais informações, consulte aspire add e integração de alojamento do Azure App Configuration.

  2. 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ã da caixa de diálogo Alterar contexto do Azure no painel do Aspire.

    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

    Referenciar uma loja de Configuração de Aplicações existente passando o seu nome e grupo de recursos como parâmetros para AsExisting():

    var storeName = builder.AddParameter("appConfigurationName");
var resourceGroup = builder.AddParameter("appConfigurationResourceGroup");

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

    Para mais informações, consulte Utilizar recursos existentes no Azure.

  3. 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

  4. A partir da raiz da solução, execute aspire run. Vês o recurso Azure App Configuration a ser provisionado.

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

  5. 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.

  6. 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. Vai ao diretório AppHost . Execute o seguinte comando para adicionar o Aspire.Hosting.Azure.AppConfiguration pacote NuGet.

    aspire add Aspire.Hosting.Azure.AppConfiguration

    Para mais informações, consulte aspire add e a integração do Azure App Configuration Hosting.

  2. 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.

  3. 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

  4. Inicia o runtime do seu contentor. Neste tutorial, usamos o Docker Desktop.

  5. A partir da raiz da solução, execute aspire run. 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. Vai para o diretório do Web 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. Pare o processo atual aspire run , execute aspire run novamente e depois selecione a URL da interface web no painel do Aspire.

    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.

Para mais informações sobre como as aplicações consumidoras recebem e utilizam o endpoint App Configuration, consulte Connect to 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.

Ativar configuração dinâmica

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

Usar sinais de funcionalidades no Aspire

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

Visão geral do emulador Azure App Configuration

  • Última atualização a