Exercício – Implementar um sinalizador de recurso para controlar os recursos do aplicativo ASP.NET Core

12 minutos

Neste exercício, implemente um sinalizador de recurso para alternância de uma faixa de vendas sazonal para seu aplicativo. Os sinalizadores de recursos permitem que você alterne a disponibilidade de recursos sem reimplantar seu aplicativo.

Você usará o Gerenciamento de Recursos na biblioteca de sinalizadores de recursos do .NET. Essa biblioteca fornece auxiliares para implementar sinalizadores de recursos em seu aplicativo. A biblioteca dá suporte a casos de uso simples, como instruções condicionais, a cenários mais avançados, como adicionar condicionalmente rotas ou filtros de ação. Além disso, ele dá suporte a filtros de recursos, que permitem habilitar recursos com base em parâmetros específicos. Exemplos desses parâmetros incluem um tempo de janela, porcentagens ou um subconjunto de usuários.

Nesta unidade, você vai:

Crie uma instância de Configuração de Aplicativo do Azure.
Adicionar um sinalizador de recursos ao armazenamento da Configuração de Aplicativos.
Conecte seu aplicativo ao repositório de Configuração de Aplicativos.
Altere o aplicativo para usar o sinalizador de recurso.
Altere a página de produtos para exibir um banner promocional.
Compile e teste o aplicativo.

Abrir o ambiente de desenvolvimento

Você pode optar por usar um codespace do GitHub que hospeda o exercício ou concluí-lo localmente no Visual Studio Code.

Para usar um codespace, crie um Codespace do GitHub pré-configurado com este link de criação do Codespace.

O GitHub leva vários minutos para criar e configurar o codespace. Quando terminar, você verá os arquivos de código do exercício. O código usado para o restante deste módulo está no diretório /dotnet-feature-flags .

Para usar o Visual Studio Code, clone o https://github.com/MicrosoftDocs/mslearn-dotnet-cloudnative repositório em seu computador local. Em seguida:

Instale todos os requisitos do sistema para executar o Contêiner de Desenvolvimento no Visual Studio Code.
Confira se o Docker está em execução.
Em uma nova janela do Visual Studio Code, abra a pasta do repositório clonado
Pressione Ctrl+Shift+P para abrir a paleta de comandos.
Pesquisa: >Contêineres de Desenvolvimento: Recompilar e Reabrir no Contêiner
Escolha eShopLite - dotnet-feature-flags na lista de seleção. O Visual Studio Code cria seu contêiner de desenvolvimento localmente.

Criar uma instância de Configuração de Aplicativo

Conclua as seguintes etapas para criar uma instância de Configuração de Aplicativo em sua assinatura do Azure:

No novo painel do terminal, entre na CLI do Azure.
```
az login --use-device-code
```
Exiba sua assinatura do Azure selecionada.
```
az account show -o table
```
Se a assinatura errada estiver selecionada, selecione a correta usando o comando az account set .
Execute o seguinte comando da CLI do Azure para obter uma lista das regiões do Azure e o Nome associado a ele:
```
az account list-locations -o table
```
Localize uma região mais próxima de você e use-a na próxima etapa para substituir [Closest Azure region]
Execute os seguintes comandos da CLI do Azure para criar uma instância de Configuração de Aplicativo:
```
export LOCATION=[Closest Azure region]
export RESOURCE_GROUP=rg-eshop
export CONFIG_NAME=eshop-app-features$SRANDOM    
```
Você precisa alterar o LOCAL para uma região do Azure próxima a você, por exemplo, eastus. Se você quiser um nome diferente para o grupo de recursos ou a configuração do aplicativo, altere os valores acima.
Execute o seguinte comando para criar o Grupo de Recursos do Azure:
```
az group create --name $RESOURCE_GROUP --location $LOCATION
```

Execute o seguinte comando para criar uma instância de Configuração de Aplicativo:

az appconfig create --resource-group $RESOURCE_GROUP --name $CONFIG_NAME --location $LOCATION --sku Free

Uma variação do seguinte resultado é exibida:

{
  "createMode": null,
  "creationDate": "2023-10-31T15:40:10+00:00",
  "disableLocalAuth": false,
  "enablePurgeProtection": false,
  "encryption": {
    "keyVaultProperties": null
  },
  "endpoint": "https://eshop-app-features1168054702.azconfig.io",
  "id": "/subscriptions/aaaa0a0a-bb1b-cc2c-dd3d-eeeeee4e4e4e/resourceGroups/rg-eshop/providers/Microsoft.AppConfiguration/configurationStores/eshop-app-features1168054702",
  "identity": null,

Execute este comando para recuperar a cadeia de conexão para a instância de Configuração de Aplicativo:
```
az appconfig credential list --resource-group $RESOURCE_GROUP --name $CONFIG_NAME --query [0].connectionString --output tsv
```
Essa cadeia de caracteres prefixada com Endpoint= representa a cadeia de conexão do repositório de Configuração de Aplicativos.
Copie a cadeia de conexão. Você vai usá-lo em um momento.

Armazenar a cadeia de conexão da Configuração de Aplicativos

Agora você adicionará a cadeia de conexão da Configuração de Aplicativos ao aplicativo. Conclua as seguintes etapas:

Abra o arquivo /dotnet-feature-flags/docker-compose.yml.

Adicione uma nova variável de ambiente na linha 13.

- ConnectionStrings:AppConfig=[PASTE CONNECTION STRING HERE]

O docker-compose.yml será semelhante ao seguinte YAML:

environment: 
  - ProductEndpoint=http://backend:8080
  - ConnectionStrings:AppConfig=Endpoint=https://eshop-app-features1168054702.azconfig.io;Id=<ID>;Secret=<Secret value>

A linha anterior representa um par chave-valor, no qual ConnectionStrings:AppConfig é um nome de variável de ambiente. Store No projeto, o provedor de configuração de variáveis de ambiente lê seu valor.

Dica

A cadeia de conexão da Configuração de Aplicativo do Azure contém um segredo em texto simples. Em aplicativos do mundo real, considere a integração da Configuração de Aplicativos ao Azure Key Vault para armazenamento seguro de segredos. O Key Vault está fora do escopo deste módulo, mas as diretrizes podem ser encontradas no Tutorial: Usar referências do Key Vault em um aplicativo ASP.NET Core.

Adicionar o sinalizador de recursos ao armazenamento da Configuração de Aplicativos

Na Configuração de Aplicativos do Azure, crie e habilite um par chave-valor para ser tratado como um sinalizador de recurso. Conclua as seguintes etapas:

Em outra guia do navegador, entre no portal do Azure com a mesma conta e diretório utilizados na CLI do Azure.
Use a caixa de pesquisa para localizar e abrir o recurso de Configuração de Aplicativo prefixado com eshop-app-features.
Na seção Operações , selecione Gerenciador de Recursos.
No menu superior, selecione + Criar.
Selecione a caixa de seleção Habilitar sinalizador de recursos.
Na caixa de texto Nome do sinalizador de recurso, insira SeasonalDiscount.
Selecione Aplicar.

Agora que o sinalizador de recursos existe no armazenamento da Configuração de Aplicativos, o projeto do Store requer algumas alterações para ser lido.

Examinar o código

Examine os diretórios no painel do explorer no IDE. Observe que há três projetos DataEntities, Products e Store. O projeto Store é a aplicação Blazor. O Products projeto é uma biblioteca .NET Standard que contém o serviço de produto. O DataEntities projeto é uma biblioteca .NET Standard que contém o modelo de produto.

Conectar seu aplicativo ao repositório de Configuração de Aplicativos

Para acessar valores do repositório de Configuração de Aplicativos em um aplicativo ASP.NET Core, o provedor de configuração da Configuração de Aplicativos é necessário.

Aplique as seguintes alterações ao seu Store projeto:

Na janela do terminal, navegue até a pasta Store:
```
cd dotnet-feature-flags/Store
```

Execute o seguinte comando para instalar um pacote NuGet que contém o provedor de configuração do .NET para o serviço de Configuração de Aplicativo:

dotnet add package Microsoft.Azure.AppConfiguration.AspNetCore
dotnet add package Microsoft.FeatureManagement.AspNetCore
dotnet add package Microsoft.Extensions.Configuration.AzureAppConfiguration

Abra o arquivo Store/Program.cs.

Adicione as novas referências de pacote na parte superior do arquivo:

using Microsoft.FeatureManagement;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.Configuration.AzureAppConfiguration;

Adicione este código abaixo do comentário // Adicionar o código AddAzureAppConfiguration.
```
// Retrieve the connection string
var connectionString = builder.Configuration.GetConnectionString("AppConfig");

// Load configuration from Azure App Configuration
builder.Configuration.AddAzureAppConfiguration(options => {
  options.Connect(connectionString)
    .UseFeatureFlags();
});

// Register the Feature Management library's services
builder.Services.AddFeatureManagement();
builder.Services.AddAzureAppConfiguration();
```
No snippet de código anterior:
- O Connect método é autenticado no repositório de Configuração de Aplicativos. Lembre-se de que a cadeia de conexão está sendo passada como uma variável ConnectionStrings:AppConfigambiental.
- O UseFeatureFlags método permite que a biblioteca de Gerenciamento de Recursos leia sinalizadores de recursos do repositório de Configuração de Aplicativos.
- As duas chamadas builder.Services registram os serviços da biblioteca de Gerenciamento de Funcionalidades no contêiner de injeção de dependências do aplicativo.
Na parte inferior do arquivo, abaixo // Adicione o middleware de configuração do aplicativo, adicione este código:
```
app.UseAzureAppConfiguration();
```
O código anterior adiciona o middleware de Configuração de Aplicativo ao pipeline de solicitação. O middleware dispara uma operação de atualização para os parâmetros de Gerenciamento de Recursos para cada solicitação de entrada. Em seguida, cabe ao provedor AzureAppConfiguration decidir, com base nas configurações de atualização, quando realmente se conectar ao repositório para obter os valores.

Seu aplicativo agora pode ler o sinalizador de recursos, mas a página de produtos precisa ser atualizada para mostrar que uma venda está ativada. Conclua as seguintes etapas:

Abra o arquivo Store/Components/Pages/Products.razor.
Na parte superior do arquivo, adicione o seguinte código:
```
@using Microsoft.FeatureManagement
@inject IFeatureManager FeatureManager
```
O código anterior importa os namespaces da biblioteca de Gerenciamento de Recursos e injeta a IFeatureManager interface no componente.
Na seção @code, adicione a seguinte variável para armazenar o estado do sinalizador de recurso:
```
private bool saleOn = false;  
```

OnInitializedAsync No método, adicione o seguinte código:

saleOn = await FeatureManager.IsEnabledAsync("SeasonalDiscount");

O método deve ser como o seguinte código:

protected override async Task OnInitializedAsync()
{
    saleOn = await FeatureManager.IsEnabledAsync("SeasonalDiscount");

    // Simulate asynchronous loading to demonstrate streaming rendering
    products = await ProductService.GetProducts();
}

Na linha 26, no  comentário, adicione o seguinte código:
```

@if (saleOn)
{
<div class="alert alert-success" role="alert">
  Our sale is now on.
</div>
}
```
O código anterior exibe um alerta de vendas se o sinalizador de recursos estiver habilitado.

Criar o aplicativo

Verifique se você salvou todas as suas alterações e está no diretório dotnet-feature-flags . No terminal, execute o seguinte comando:
```
dotnet publish /p:PublishProfile=DefaultContainer 
```
Execute o aplicativo usando o Docker:
```
docker compose up
```

Testar o sinalizador de recursos

Para verificar se o sinalizador de recurso funciona conforme o esperado em um codespace, conclua as seguintes etapas:

Mude para a aba PORTS e, à direita do endereço local da porta Front End, selecione o ícone de globo. O navegador abre uma nova aba na página inicial.
Selecione Produtos.

Se você estiver usando o Visual Studio Code localmente, abra http://localhost:32000/products.

No portal do Azure, você pode habilitar e desabilitar o sinalizador de recursos e atualizar a página de produtos para ver o sinalizador em ação.

Comentários

Esta página foi útil?