Esercitazione: Implementare funzionalità per gruppi di destinatari target in un'applicazione ASP.NET Core

Articolo
07/16/2024

In questa esercitazione si userà il filtro di destinazione per implementare una funzionalità ai gruppi di destinatari target per l'applicazione ASP.NET Core. Per altre informazioni sul filtro di destinazione, vedere Implementare le funzionalità ai gruppi di destinatari target.

Prerequisiti

Un account Azure con una sottoscrizione attiva. Crearne una gratuitamente.
Un Archivio di configurazione app. Creare un archivio.
Flag di funzionalità con filtro di destinazione. Creare il flag di funzionalità.
.NET SDK 6.0 o versione successiva.

Creare un'applicazione Web con un flag di funzionalità

In questa sezione si creerà un'applicazione Web che consente agli utenti di accedere e usare il flag di funzionalità Beta creato in precedenza.

Creare un'applicazione Web che esegue l'autenticazione in un database locale usando il comando seguente.
```
dotnet new webapp --auth Individual -o TestFeatureFlags
```

Aggiungere riferimenti ai pacchetti NuGet seguenti.

dotnet add package Microsoft.Azure.AppConfiguration.AspNetCore
dotnet add package Microsoft.FeatureManagement.AspNetCore

Archiviare la stringa di connessione per l'archivio di Configurazione app.

dotnet user-secrets init
dotnet user-secrets set ConnectionStrings:AppConfig "<your_connection_string>"

Aggiungere Configurazione app di Azure e gestione delle funzionalità all'applicazione.

Aggiornare il file Program.cs con il codice seguente.

// Existing code in Program.cs
// ... ...

var builder = WebApplication.CreateBuilder(args);

// Retrieve the App Config connection string
string AppConfigConnectionString = builder.Configuration.GetConnectionString("AppConfig") ?? throw new InvalidOperationException("Connection string 'AppConfig' not found."); ;

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

// Add Azure App Configuration middleware to the container of services
builder.Services.AddAzureAppConfiguration();

// Add feature management to the container of services
builder.Services.AddFeatureManagement();

// The rest of existing code in Program.cs
// ... ...

Abilitare l'aggiornamento della configurazione e del flag di funzionalità da Configurazione app di Azure con il middleware di Configurazione app.

Aggiornare Program.cs con il codice seguente.

// Existing code in Program.cs
// ... ...

var app = builder.Build();

// Use Azure App Configuration middleware for dynamic configuration refresh
app.UseAzureAppConfiguration();

// The rest of existing code in Program.cs
// ... ...

Aggiungere una nuova pagina Razor vuota denominata Beta nella directory Pages. Include due file Beta.cshtml e Beta.cshtml.cs.

@page
@model TestFeatureFlags.Pages.BetaModel
@{
    ViewData["Title"] = "Beta Page";
}

<h1>This is the beta website.</h1>

Aprire Beta.cshtml.cs e aggiungere l'attributo FeatureGate alla classe BetaModel.

using Microsoft.AspNetCore.Mvc.RazorPages;
using Microsoft.FeatureManagement.Mvc;

namespace TestFeatureFlags.Pages
{
    [FeatureGate("Beta")]
    public class BetaModel : PageModel
    {
        public void OnGet()
        {
        }
    }
}

Aprire Pages/_ViewImports.cshtml e registrare l'helper tag di gestione funzionalità usando una direttiva @addTagHelper.
```
@addTagHelper *, Microsoft.FeatureManagement.AspNetCore
```

Aprire _Layout.cshtml nella directory Pages/Shared. Inserire un nuovo tag <feature> tra gli elementi Home e Privacy della barra di spostamento, come illustrato nelle righe evidenziate di seguito.

<nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-light bg-white border-bottom box-shadow mb-3">
    <div class="container">
        <a class="navbar-brand" asp-area="" asp-page="/Index">TestAppConfigNet3</a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target=".navbar-collapse" aria-controls="navbarSupportedContent"
                aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="navbar-collapse collapse d-sm-inline-flex flex-sm-row-reverse">
            <ul class="navbar-nav flex-grow-1">
                <li class="nav-item">
                    <a class="nav-link text-dark" asp-area="" asp-page="/Index">Home</a>
                </li>
                <feature name="Beta">
                    <li class="nav-item">
                        <a class="nav-link text-dark" asp-area="" asp-page="/Beta">Beta</a>
                    </li>
                </feature>
                <li class="nav-item">
                    <a class="nav-link text-dark" asp-area="" asp-page="/Privacy">Privacy</a>
                </li>
            </ul>
        </div>
    </div>
</nav>

Abilitare la selezione dell'applicazione Web come destinazione

Il filtro di destinazione valuta lo stato della funzionalità di un utente in base al contesto di destinazione dell'utente, che comprende l'ID utente e i gruppi a cui appartiene l'utente. In questo esempio si usa l'indirizzo di posta elettronica dell'utente connesso come ID utente e il nome di dominio dell'indirizzo di posta elettronica come gruppo.

Aggiungere un file ExampleTargetingContextAccessor.cs con il codice seguente. Si implementa l'interfaccia ITargetingContextAccessor per fornire il contesto di destinazione per l'utente connesso della richiesta corrente.

using Microsoft.FeatureManagement.FeatureFilters;

namespace TestFeatureFlags
{
    public class ExampleTargetingContextAccessor : ITargetingContextAccessor
    {
        private const string TargetingContextLookup = "ExampleTargetingContextAccessor.TargetingContext";
        private readonly IHttpContextAccessor _httpContextAccessor;

        public ExampleTargetingContextAccessor(IHttpContextAccessor httpContextAccessor)
        {
            _httpContextAccessor = httpContextAccessor ?? throw new ArgumentNullException(nameof(httpContextAccessor));
        }

        public ValueTask<TargetingContext> GetContextAsync()
        {
            HttpContext httpContext = _httpContextAccessor.HttpContext;
            if (httpContext.Items.TryGetValue(TargetingContextLookup, out object value))
            {
                return new ValueTask<TargetingContext>((TargetingContext)value);
            }
            List<string> groups = new List<string>();
            if (httpContext.User.Identity.Name != null)
            {
                groups.Add(httpContext.User.Identity.Name.Split("@", StringSplitOptions.None)[1]);
            }
            TargetingContext targetingContext = new TargetingContext
            {
                UserId = httpContext.User.Identity.Name,
                Groups = groups
            };
            httpContext.Items[TargetingContextLookup] = targetingContext;
            return new ValueTask<TargetingContext>(targetingContext);
        }
    }
}

Aprire il file Program.cs e abilitare il filtro di destinazione chiamando il metodo WithTargeting. Passare il tipo ExampleTargetingContextAccessor che il filtro di destinazione userà per ottenere il contesto di destinazione durante la valutazione del flag di funzionalità. Aggiungere HttpContextAccessor alla raccolta di servizi per consentire a ExampleTargetingContextAccessor di accedere alle informazioni dell'utente connesso da HttpContext.
```
// Existing code in Program.cs
// ... ...

// Add feature management to the container of services
builder.Services.AddFeatureManagement()
                .WithTargeting<ExampleTargetingContextAccessor>();

// Add HttpContextAccessor to the container of services.
builder.Services.AddHttpContextAccessor();

// The rest of existing code in Program.cs
// ... ...
```
Nota

Per le applicazioni Blazor, vedere le istruzioni per abilitare la gestione delle funzionalità come servizi con ambito.

Filtro di destinazione in azione

Compilare ed eseguire l'applicazione. Inizialmente, l'elemento Beta non viene visualizzato sulla barra degli strumenti, perché l'opzione Percentuale predefinita è impostata su 0.
Selezionare il collegamento Registra nell'angolo in alto a destra per creare un nuovo account utente. Usare un indirizzo di posta elettronica test@contoso.com. Nella schermata Conferma registrazione selezionare Fare clic qui per confermare l'account.
Accedere come test@contoso.com, usando la password impostata durante la registrazione dell'account.

L'elemento Beta viene ora visualizzato sulla barra degli strumenti, perché test@contoso.com viene specificato come utente di destinazione.

Accedere ora come testuser@contoso.com, usando la password impostata durante la registrazione dell'account. L'elemento Beta non viene visualizzato sulla barra degli strumenti, perché testuser@contoso.com viene specificato come utente escluso.

È possibile creare più utenti con gli indirizzi di posta elettronica @contoso.com e @contoso-xyz.com per visualizzare il comportamento delle impostazioni del gruppo.

Gli utenti con indirizzi di posta elettronica contoso-xyz.com non vedranno l'elemento Beta. Mentre il 50% degli utenti con indirizzi di posta elettronica @contoso.com visualizzerà l'elemento Beta, l'altro 50% non visualizzerà l'elemento Beta.