자습서: 애플리케이션에 로그인 추가

  • 아티클

이전 자습서에서는 인증을 위해 ASP.NET Core 프로젝트를 만들고 구성했습니다. 이 자습서에서는 필요한 패키지를 설치하고 로그인 및 로그아웃 환경에 인증을 구현하는 코드를 추가합니다.

이 자습서에서:

  • 인증에 필요한 NuGet 패키지 식별 및 설치
  • 코드에서 인증 구현
  • 로그인 및 로그아웃 환경 추가

필수 조건

ID 패키지 설치

사용자 인증을 사용하도록 설정하려면 프로젝트에 ID 관련 NuGet 패키지를 설치해야 합니다.

  1. Visual Studio 메뉴에서 도구 > NuGet 패키지 관리자 > 솔루션용 NuGet 패키지 관리를 선택합니다.
  2. 찾아보기 탭을 선택한 상태에서 Microsoft.Identity.Web.UI를 검색하여 선택합니다. 프로젝트 확인란을 선택하고 설치를 선택합니다.
  3. Microsoft.Identity.Web.Diagnostics 및 Microsoft.Identity.Web.DownstreamApi에 이 작업을 반복합니다.

인증 구현 및 토큰 획득

  1. Program.cs를 열고 전체 파일 콘텐츠를 다음 코드 조각으로 바꿉니다.

    // <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();

로그인 및 로그아웃 환경 추가

NuGet 패키지를 설치하고 인증에 필요한 코드를 추가한 후 로그인 및 로그아웃 환경을 추가합니다.

_LoginPartial.cshtml 파일 만들기

  1. 페이지를 확장하고 공유를 마우스 오른쪽 단추로 클릭한 다음 >Razor 페이지 추가를 선택합니다.
  2. Razor 페이지 - 비어 있음을 선택한 다음 추가를 선택합니다.
  3. 이름으로 _LoginPartial.cshtml을 입력한 다음 추가를 선택합니다.

_LoginPartial.cshtml 파일 편집

  1. _LoginPartial.cshtml을 열고 로그인 및 로그아웃 환경을 추가하기 위한 다음 코드를 추가합니다.

    @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. _Layout.cshtml을 열고 이전 단계에서 만든 _LoginPartial에 대한 참조를 추가합니다. 이 단일 줄은 </ul>과(와) </div>사이에 배치되어야 합니다.

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

다음 단계

자습서: API 호출 및 결과 표시