Dela via


Självstudie: Lägga till inloggning i ett program

I föregående självstudie skapades ett ASP.NET Core-projekt och konfigurerades för autentisering. Den här självstudien installerar de paket som krävs och lägger till kod som implementerar autentisering i inloggnings- och utloggningsmiljön.

I den här självstudien:

  • Identifiera och installera De NuGet-paket som behövs för autentisering
  • Implementera autentisering i koden
  • Lägg till inloggnings- och utloggningsfunktionerna

Förutsättningar

Installera identitetspaket

Identitetsrelaterade NuGet-paket måste installeras i projektet för att autentisering av användare ska kunna aktiveras.

  1. På den översta menyn i Visual Studio väljer du Verktyg > NuGet Package Manager > Hantera NuGet-paket för lösning.
  2. Med fliken Bläddra markerad söker du efter och väljer Microsoft.Identity.Web.UI. Markera kryssrutan Projekt och välj sedan Installera.
  3. Upprepa detta för Microsoft.Identity.Web.Diagnostics och Microsoft.Identity.Web.DownstreamApi.

Implementera autentisering och hämta token

  1. Öppna Program.cs och ersätt hela filinnehållet med följande kodfragment:

    // <ms_docref_import_types>
    using Microsoft.AspNetCore.Authorization;
    using Microsoft.AspNetCore.Mvc.Authorization;
    using Microsoft.Identity.Web;
    using Microsoft.Identity.Web.UI;
    // </ms_docref_import_types>
    
    // <ms_docref_add_msal>
    WebApplicationBuilder builder = WebApplication.CreateBuilder(args);
    IEnumerable<string>? initialScopes = builder.Configuration["DownstreamApi:Scopes"]?.Split(' ');
    
    
    builder.Services.AddMicrosoftIdentityWebAppAuthentication(builder.Configuration, "AzureAd")
        .EnableTokenAcquisitionToCallDownstreamApi(initialScopes)
            .AddDownstreamApi("DownstreamApi", builder.Configuration.GetSection("DownstreamApi"))
            .AddInMemoryTokenCaches();
    // </ms_docref_add_msal>
    
    // <ms_docref_add_default_controller_for_sign-in-out>
    builder.Services.AddRazorPages().AddMvcOptions(options =>
        {
            var policy = new AuthorizationPolicyBuilder()
                          .RequireAuthenticatedUser()
                          .Build();
            options.Filters.Add(new AuthorizeFilter(policy));
        }).AddMicrosoftIdentityUI();
    // </ms_docref_add_default_controller_for_sign-in-out>
    
    // <ms_docref_enable_authz_capabilities>
    WebApplication app = builder.Build();
    
    app.UseAuthentication();
    app.UseAuthorization();
    // </ms_docref_enable_authz_capabilities>
    
    app.UseHttpsRedirection();
    app.UseStaticFiles();
    
    app.UseRouting();
    
    app.MapRazorPages();
    app.MapControllers();
    
    app.Run();
    

Lägg till inloggnings- och utloggningsupplevelsen

När du har installerat NuGet-paketen och lagt till nödvändig kod för autentisering lägger du till inloggnings- och utloggningsfunktionerna.

Skapa filen _LoginPartial.cshtml

  1. Expandera Sidor, högerklicka på Delad och välj sedan Lägg till > Razor-sida.
  2. Välj Razor-sida – Tom och välj sedan Lägg till.
  3. Ange _LoginPartial.cshtml som namn och välj sedan Lägg till.

Redigera filen _LoginPartial.cshtml

  1. Öppna _LoginPartial.cshtml och lägg till följande kod för att lägga till inloggnings- och utloggningsupplevelsen:

    @using System.Security.Principal
    
    <ul class="navbar-nav">
    @if (User.Identity?.IsAuthenticated == true)
    {
            <li class="nav-item">
                <span class="navbar-text text-dark">Hello @User.Identity?.Name!</span>
            </li>
            <li class="nav-item">
                <a class="nav-link text-dark" asp-area="MicrosoftIdentity" asp-controller="Account" asp-action="SignOut">Sign out</a>
            </li>
    }
    else
    {
            <li class="nav-item">
                <a class="nav-link text-dark" asp-area="MicrosoftIdentity" asp-controller="Account" asp-action="SignIn">Sign in</a>
            </li>
    }
    </ul>
    
  2. Öppna _Layout.cshtml och lägg till en referens som _LoginPartial skapades i föregående steg. Den här enkla linjen ska placeras mellan </ul> och </div>:

        </ul>
        <partial name="_LoginPartial" />
    </div>
    

Nästa steg