Compartilhar via

Início Rápido: Criar uma solução Aspire com a Configuração de Aplicativos do Azure

Neste início rápido, você usará a Configuração de Aplicativos do Azure para externalizar o armazenamento e o gerenciamento das configurações do aplicativo para um projeto Aspire. Você usará as bibliotecas de integração Aspire do Azure App Configuration para provisionar um recurso de Configuração de Aplicativo e usar a Configuração de Aplicativo em cada aplicativo distribuído.

Pré-requisitos

Testar o aplicativo localmente

O modelo Aspire Starter inclui um aplicativo Web de front-end que se comunica com um projeto de API Mínima. O projeto de API é usado para fornecer dados meteorológicos falsos para o front-end. O aplicativo de front-end é configurado para usar a descoberta de serviço para se conectar ao projeto de API. Há também um AppHost projeto que orquestra todos os aplicativos distribuídos na solução Aspire.

  1. Execute o projeto AppHost. Você verá o painel do Aspire em seu navegador.

    Captura de tela do painel do Aspire com o front-end da Web e os recursos do serviço de API.

  2. Clique na URL do frontend da web. Você vê uma página com uma mensagem de boas-vindas.

    Captura de tela de um aplicativo Web com uma mensagem de boas-vindas.

Adicionar a Configuração de Aplicativos do Azure à solução Aspire

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

    dotnet add package Aspire.Hosting.Azure.AppConfiguration

  2. Abra o arquivo AppHost.csproj para verificar os pacotes. Você deve ver um pacote chamado Aspire.Hosting.AppHost sendo referenciado. Verifique se a versão do Aspire.Hosting.AppHost pacote é pelo menos tão alta quanto a versão do Aspire.Hosting.Azure.AppConfiguration que foi instalada.

  3. Abra o arquivo AppHost.cs e adicione o código a seguir.

    var builder = DistributedApplication.CreateBuilder(args);

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

    Importante

    Ao chamar AddAzureAppConfiguration, você instrui o aplicativo a gerar recursos do Azure dinamicamente durante a inicialização do aplicativo. O aplicativo deve configurar a assinatura e o local apropriados. Para obter mais informações, consulte o provisionamento local do Azure. Se você estiver usando o SDK do Aspire mais recente, poderá configurar as informações da assinatura por meio do painel do Aspire. Captura de tela do painel do Aspire solicitando informações sobre a Assinatura do Azure.

    Observação

    Você deve ter a função Proprietário ou Administrador de Acesso de Usuário atribuída na assinatura do Azure. Essas funções são necessárias para criar atribuições de função como parte do processo de provisionamento.

    Dica

    Você pode referenciar recursos de configuração de aplicativo existentes encadeando uma chamada RunAsExisting() no builder.AddAzureAppConfiguration("appconfig"). Para obter mais informações, acesse Usar recursos existentes do Azure.

  4. Adicione a referência do recurso do App Configuration e configure o projeto webfrontend para aguardá-lo.

    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. Você verá que o recurso de Configuração de Aplicativo do Azure está sendo provisionado.

    Captura de tela do provisionamento do recurso de Configuração de Aplicativos do Azure no painel do Aspire.

  6. Aguarde alguns minutos e você verá que o recurso de Configuração de Aplicativo do Azure está provisionado e está em execução.

    Captura de tela do painel do Aspire com o recurso de Configuração de Aplicativo do Azure em execução.

  7. Acesse o portal do Azure clicando na URL de implantação no painel do Aspire. Você vê que a implantação está concluída e pode acessar o recurso de Configuração de Aplicativos do Azure.

    Captura de tela do portal do Azure mostrando que a implantação da Configuração de Aplicativos está concluída.

Adicione um valor-chave

Adicione o valor de chave a seguir ao repositório de Configuração de Aplicativos e deixe o Rótulo e o Tipo de Conteúdo com seus valores padrão. Para mais informações sobre como adicionar valores-chave a um repositório usando o portal do Azure ou a CLI, acesse Criar um valor-chave.

Key Value
TestApp:Settings:Message Olá, da Configuração de Aplicativos do Azure!

Adicionar a Configuração de Aplicativos do Azure à solução Aspire

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

    dotnet add package Aspire.Hosting.Azure.AppConfiguration

  2. Abra o AppHost.csproj. Verifique se a versão do Aspire.Hosting.AppHost pacote não é anterior à versão instalada. Caso contrário, você precisará atualizar o Aspire.Hosting.AppHost pacote.

  3. Abra o arquivo AppHost.cs e adicione o código a seguir.

    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 você chama RunAsEmulator, ele puxa a imagem do emulador de Configuração de Aplicativo e executa um contêiner como o recurso de Configuração de Aplicativo. Verifique se você tem um runtime de contêiner compatível com OCI em seu computador. Para obter mais informações, acesse Aspire Container Runtime.

    Dica

    Você pode chamar WithDataBindMount ou WithDataVolume configurar o recurso do emulador para o armazenamento de contêiner persistente para que você não precise recriar valores de chave sempre.

  4. Adicione a referência do recurso App Configuration e configure o projeto webfrontend para aguardá-lo.

    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. Inicie o runtime do contêiner. Neste tutorial, usamos o Docker Desktop.

  6. Execute o projeto AppHost. Acesse o painel do Aspire. Você verá que o recurso do emulador de Configuração de Aplicativo está em execução.

    Captura de tela do painel do Aspire mostrando o recurso do emulador de Configuração de Aplicativo.

    Um contêiner é iniciado para executar o emulador de Configuração de Aplicativo.

    Captura de tela da área de trabalho do Docker executando um contêiner.

Adicione um valor-chave

  1. Clique na URL do recurso appconfiguration. Você está vendo a interface do emulador de Configuração do Aplicativo.

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

    Captura de tela da interface do usuário do emulador de Configuração de Aplicativo.

  3. Adicione o seguinte par chave-valor.

    Key Value
    TestApp:Settings:Message Olá, da Configuração de Aplicativos do Azure!

  4. Clique no botão Save.

    Captura de tela da interface do emulador de configuração do aplicativo ao criar um novo valor de chave.

Usar a Configuração de Aplicativos no aplicativo Web

  1. Navegue para o diretório do Web projeto. Execute o comando a seguir para adicionar o Aspire.Microsoft.Extensions.Configuration.AzureAppConfiguration pacote Nuget.

    dotnet add package Aspire.Microsoft.Extensions.Configuration.AzureAppConfiguration

  2. Abra o arquivo Program.cs e adicione o código a seguir.

    var builder = WebApplication.CreateBuilder(args);

// Use Azure App Configuration
builder.AddAzureAppConfiguration("appconfiguration"); // use the resource name defined in the AppHost project

  3. Abra o arquivo Components/Pages/Home.razor e atualize-o com o código a seguir.

    @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. Reinicie o AppHost projeto. Vá para o painel do Aspire e clique na URL da interface da web.

    Captura de tela do painel do Aspire mostrando recursos.

  5. Você vê uma página com uma mensagem de boas-vindas da Configuração de Aplicativos do Azure.

    Captura de tela de um aplicativo Web com uma mensagem de boas-vindas da Configuração de Aplicativos do Azure.

Próximas etapas

Neste início rápido, você:

  • Adicionado um recurso de Configuração de Aplicativo do Azure em uma solução Aspire.
  • Leia seus valores-chave do Azure App Configuration com a biblioteca de integração App Configuration Aspire.
  • Exibida uma página da Web usando as configurações que você configurou na Configuração do Aplicativo.

Para saber como definir seu aplicativo Aspire para atualizar dinamicamente as configurações, prossiga para o próximo tutorial.

Habilitar configuração dinâmica

Para saber como usar sinalizadores de recursos em seu aplicativo Aspire, prossiga para o próximo tutorial.

Usar sinalizadores de recursos no Aspire

Para saber mais sobre o emulador de Configuração de Aplicativos do Azure, continue para o documento a seguir.

Visão geral do emulador da Configuração de Aplicativo do Azure

  • Last updated on