랩 06: OpenID 커넥트, MSAL 및 .NET SDK를 사용하여 인증

Microsoft Azure 사용자 인터페이스

Microsoft 클라우드 도구의 동적 특성을 고려할 때 이 교육 콘텐츠를 개발한 후 발생하는 Azure UI 변경이 발생할 수 있습니다. 따라서 랩 지침 및 랩 단계가 올바르게 정렬되지 않을 수 있습니다.

Microsoft는 커뮤니티에서 변경해야 할 사항이 있음을 알려줄 때 이 학습 과정을 업데이트합니다. 그러나 클라우드 업데이트가 자주 이루어지기 때문에 이 학습 콘텐츠가 업데이트되기 전에 UI가 변경될 수 있습니다. 이 경우 변경 사항에 적응하고 필요에 따라 랩에서 작업합니다.

Instructions

시작하기 전에

랩 환경에 로그인

다음 자격 증명을 사용하여 Windows 11 VM(가상 머신)에 로그인합니다.

  • 사용자 이름: Admin
  • 암호: Pa55w.rd

참고: 강사가 가상 랩 환경 연결에 대한 지침을 제공합니다.

설치된 애플리케이션 검토

Windows 11 데스크톱에서 작업 표시줄을 찾습니다. 작업 표시줄에는 다음을 포함하여 이 랩에서 사용할 애플리케이션에 대한 아이콘이 포함되어 있습니다.

  • Microsoft Edge
  • Visual Studio Code

랩 시나리오

이 랩에서는 Microsoft Entra ID에 애플리케이션을 등록하고 사용자를 추가한 다음 애플리케이션에 대한 사용자의 액세스를 테스트하여 Entra ID가 보안을 유지할 수 있는지 유효성을 검사합니다.

아키텍처 다이어그램

OpenID 커넥트, MSAL 및 .NET SDK를 사용한 사용자 인증을 보여 주는 아키텍처 다이어그램

연습 1: 단일 테넌트 Entra ID 환경 구성

작업 1: Azure Portal 열기

  1. 작업 표시줄에서 Microsoft Edge 아이콘을 선택합니다.

  2. 열린 브라우저 창에서 Azure Portal(https://portal.azure.com)로 이동한 다음, 이 랩에 사용할 계정으로 로그인합니다.

    참고: Azure Portal에 처음 로그인하는 경우 포털 둘러보기가 제공됩니다. 둘러보기를 건너뛰고 포털 사용을 시작하려면 시작하기를 선택합니다.

작업 2: Entra ID Directory에 애플리케이션 등록

  1. Azure Portal에서 리소스, 서비스 및 문서 검색 텍스트 상자를 사용하여 Entra ID를 검색하고 결과 목록에서 Microsoft Entra ID를 선택합니다.

    참고: 그러면 브라우저 세션이 Azure 구독과 연결된 Microsoft Entra ID 테넌트의 블레이드로 리디렉션됩니다.

  2.  Microsoft Entra ID 블레이드의 관리 섹션에서 앱 등록을 선택합니다.

  3. 앱 등록 섹션에서 + 새 등록을 선택합니다.

  4. 애플리케이션 등록 섹션에서 다음 작업을 수행한 다음, 등록을 선택합니다.

    설정 작업
    이름 텍스트 상자 webappoidc를 입력합니다.
    지원되는 계정 유형 목록 이 조직 디렉터리 내의 계정만(기본 디렉터리만 - 단일 테넌트) 을 선택합니다.

    참고: 테넌트 이름은 Azure 구독에 따라 다를 수 있습니다.

    다음 스크린샷은 애플리케이션 등록 섹션에 구성된 설정을 보여 줍니다.

    애플리케이션을 등록하도록 구성된 옵션이 표시된 스크린샷

작업 3: 고유 식별자 기록

  1. webappoidc 애플리케이션 등록 창에서 개요를 선택합니다.

  2. 개요 섹션에서 애플리케이션(클라이언트) ID 텍스트 상자의 값을 찾아 기록합니다. 이 값은 랩에서 나중에 사용합니다.

  3. 개요 섹션에서 디렉터리(테넌트) ID 텍스트 상자의 값을 찾아 기록합니다. 이 값은 랩에서 나중에 사용합니다.

작업 4: 애플리케이션 인증 설정 구성

  1. webappoidc 애플리케이션 등록 창의 관리 섹션에서 인증을 선택합니다.

  2. 인증 섹션에서 다음 작업을 수행하고 구성을 선택합니다.

    설정 작업
    플랫폼 구성 섹션 + 플랫폼 추가를 선택합니다.
    플랫폼 구성 창 웹을 선택합니다.
    리디렉션 URI 텍스트 상자 https://localhost:5001/을 입력합니다.
    프런트 채널 로그아웃 URL 텍스트 상자 https://localhost:5001/signout-oidc을 입력합니다.

  3. 플랫폼 구성 섹션으로 돌아가서 URI 추가를 선택한 다음, https://localhost:5001/signin-oidc를 입력합니다.

  4. 암시적 허용 및 하이브리드 흐름 섹션에서 ID 토큰(암시적 흐름과 하이브리드 흐름에 사용됨) 을 선택합니다.

  5. 저장을 선택합니다.

    다음 스크린샷은 인증 창에 구성된 설정을 보여 줍니다.

    인증 창에 구성된 옵션이 표시된 스크린샷

작업 5: Microsoft Entra ID 사용자 만들기

  1. Azure Portal에서 Cloud Shell 아이콘 Cloud Shell 아이콘을 선택하여 Cloud Shell을 엽니다. Cloud Shell이 기본적으로 Bash 세션을 사용하는 경우 Cloud Shell 메뉴에서 PowerShell로 전환을 선택한 다음 확인을 선택합니다.

    참고: Cloud Shell 아이콘은 더 큼 기호(>)와 밑줄 문자(_)로 표시됩니다.

    Cloud Shell을 처음 시작하는 경우 리소스를 만들라는 일련의 메시지가 표시됩니다. 다음 표에 제시된 작업을 수행합니다.

    프롬프트 작업
    Azure Cloud Shell을 시작합니다 PowerShell을 선택합니다.
    시작 스토리지 계정 탑재를 선택한 다음 드롭다운에서 스토리지 계정 구독을 선택하고 마지막으로 적용을 선택합니다.
    스토리지 계정 탑재 스토리지 계정을 만들어 드립니다를 선택한 후 다음을 선택합니다.

  2. Cloud Shell 창에서 다음 명령을 실행하여 Azure 구독과 연결된 Microsoft Entra 테넌트에 로그인합니다.

     Connect-AzureAD

  3. 다음 명령을 실행하여 Microsoft Entra 테넌트의 기본 DNS(Domain Name System) 도메인 이름을 검색하고 표시합니다.

     $aadDomainName = ((Get-AzureAdTenantDetail).VerifiedDomains)[0].Name
 $aadDomainName

    참고: DNS 도메인 이름의 값을 기록해 둡니다. 이 값은 랩에서 나중에 사용합니다.

  4. 다음 명령을 실행하여 Microsoft Entra ID 인증을 테스트하는 데 사용할 Microsoft Entra ID 사용자를 만듭니다.

     $passwordProfile = New-Object -TypeName Microsoft.Open.AzureAD.Model.PasswordProfile
 $passwordProfile.Password = 'Pa55w.rd1234'
 $passwordProfile.ForceChangePasswordNextLogin = $false
 New-AzureADUser -AccountEnabled $true -DisplayName 'aad_lab_user1' -PasswordProfile $passwordProfile -MailNickName 'aad_lab_user1' -UserPrincipalName "aad_lab_user1@$aadDomainName"

  5. 다음 명령을 실행하여 새로 만들어진 Microsoft Entra ID 사용자의 UPN(사용자 계정 이름)을 식별합니다.

     (Get-AzureADUser -Filter "MailNickName eq 'aad_lab_user1'").UserPrincipalName

    참고: UPN을 기록해 둡니다. 이 값은 랩에서 나중에 사용합니다.

  6. Cloud Shell 창을 닫습니다.

검토

이 연습에서는 단일 테넌트 Azure AD 애플리케이션을 등록하고 Azure AD 사용자 계정을 만들었습니다.

연습 2: 단일 테넌트 ASP.NET 웹앱 만들기

작업 1: ASP.NET 웹앱 프로젝트 만들기

  1. 랩 컴퓨터에서 명령 프롬프트를 시작합니다.

  2. 명령 프롬프트에서 다음 명령을 실행하여 현재 디렉터리를 만들고 Allfiles (F):\Allfiles\Labs\06\Starter\OIDCClient로 설정합니다.

     F:
 cd F:\Allfiles\Labs\06\Starter\OIDCClient

  3. 다음 명령을 실행하여 모델 뷰 컨트롤러(MVC) 템플릿에 기반한 새 .NET Core 웹앱을 만듭니다(자리 표시자 <application_ID>, <tenant_ID>, <domain_Name>을 이 랩의 앞부분에서 기록한 값으로 바꿈).

     dotnet new mvc --auth SingleOrg --client-id <application_ID> --tenant-id <tenant_ID> --domain <domain_Name>
 rmdir .\obj /S /Q

    참고: 터미널에서 오류가 발생했다면 PowerShell을 사용하고 있을 가능성이 있습니다. 이 경우에는 /S /Q 플래그를 제거하고 명령을 다시 실행합니다.

  4. 다음 명령을 실행하여 Visual Studio Code를 시작합니다.

     code .

    이 폴더에 있는 모든 파일의 작성자를 신뢰하나요? 메시지가 표시되면 예, 작성자를 신뢰합니다를 선택합니다.

  5. Visual Studio Code 탐색기 창에서 MVC 웹앱을 나타내는 자동 생성된 폴더 구조를 검토합니다.

  6. 속성 폴더로 이동하여 launchSettings.json 파일을 열고 다음 변경 내용을 적용합니다.

    섹션 속성 값
    iisSettings sslPort 44321
    https applicationUrl https://localhost:5001

    참고: 포트 번호는 Microsoft Entra ID 앱 등록을 만들 때 지정한 값과 일치해야 합니다.

  7. 파일을 저장하고 닫습니다.

  8. Visual Studio Code 탐색기 창에서 OIDCClient.csproj를 선택합니다.

  9. <TargetFramework> 요소의 값이 net8.0으로 설정되어 있는지 확인합니다.

  10. Microsoft.AspNetCore.Authentication.JwtBearer 및 Microsoft.AspNetCore.Authentication.OpenIdConnect NuGet 패키지의 버전이 8.0.0로 설정되어 있는지 확인합니다.

  11. OIDCClient.csproj 파일의 내용이 다음 목록과 유사한지 확인(UserSecretsId의 값이 다름)하고 변경 내용을 저장합니다.

     <Project Sdk="Microsoft.NET.Sdk.Web">

   <PropertyGroup>
     <TargetFramework>net8.0</TargetFramework>
     <Nullable>enable</Nullable>
     <ImplicitUsings>enable</ImplicitUsings>
     <UserSecretsId>aspnet-OIDCClient-5249f5b2-6266-4a13-b8b4-e79c6443aabc</UserSecretsId>
   </PropertyGroup>

   <ItemGroup>
     <PackageReference Include="Microsoft.AspNetCore.Authentication.JwtBearer" Version="8.0.0-rc.2.23480.2" NoWarn="NU1605" />
     <PackageReference Include="Microsoft.AspNetCore.Authentication.OpenIdConnect" Version="8.0.0-rc.2.23480.2" NoWarn="NU1605" />
     <PackageReference Include="Microsoft.Identity.Web" Version="2.13.0" />
     <PackageReference Include="Microsoft.Identity.Web.UI" Version="2.13.0" />
     <PackageReference Include="Microsoft.Identity.Web.DownstreamApi" Version="2.13.0" />
   </ItemGroup>

 </Project>

  12. OIDCClient.csproj 파일을 닫습니다.

  13. Views\Shared 폴더로 이동한 다음, _LoginPartial.cshtml 파일을 엽니다.

  14. 다음 줄과 같이 각 범위 요소의 asp-area 특성이 MicrosoftIdentity를 참조하는지 확인합니다.

     <a class="nav-link text-dark" asp-area="MicrosoftIdentity" asp-controller="Account" asp-action="SignOut">Sign out</a>

  15. 변경하지 않고 파일을 닫습니다.

  16. 루트 폴더에서 appsettings.json 파일을 열고 다음 요소를 포함하여 AzureAd 개체의 콘텐츠를 검토합니다.

    요소 값
    Instance https://login.microsoftonline.com/
    Domain Azure 구독과 연결된 Azure AD 테넌트의 기본 DNS 도메인입니다.
    TenantId Azure AD 테넌트의 GUID입니다.
    ClientId Azure AD 테넌트에 등록된 애플리케이션의 애플리케이션(클라이언트) ID입니다.
    CallbackPath /signin-oidc

  17. 변경하지 않고 파일을 닫습니다.

  18. Visual Studio Code 탐색기 창에서 Program.cs를 선택합니다.

  19. 파일에 다음 using 지시문이 포함되어 있는지 확인합니다.

     using Microsoft.AspNetCore.Authentication.OpenIdConnect;
 using Microsoft.Identity.Web;
 using Microsoft.Identity.Web.UI;

  20. 파일에 다음과 같이 관련 인증 서비스를 컨테이너에 추가하는 줄이 포함되어 있는지 확인합니다.

     // Add services to the container.
 builder.Services.AddAuthentication(OpenIdConnectDefaults.AuthenticationScheme)
   .AddMicrosoftIdentityWebApp(builder.Configuration.GetSection("AzureAd"));

  21. 파일에 다음과 같이 계정 관리를 위한 컨트롤러 및 Razor 페이지를 추가하는 줄이 포함되어 있는지 확인합니다.

     builder.Services.AddRazorPages()
   .AddMicrosoftIdentityUI();

  22. 파일을 저장하고 닫습니다.

작업 2: 단일 테넌트 시나리오에서 단일 테넌트 웹앱 테스트

  1. Visual Studio Code 창의 위쪽 메뉴 모음에서 터미널 메뉴로 이동하여 새 터미널을 선택합니다.

  2. 터미널 패널에서 현재 작업 디렉터리의 현재 경로는 F:\Allfiles\Labs\06\Starter\OIDCClient여야 합니다. 다음 명령을 실행하여 .NET 웹앱을 빌드합니다.

     dotnet build

    참고: 빌드 오류가 있는 경우 Allfiles (F):\Allfiles\Labs\06\Solution\OIDCClient 폴더의 파일을 검토합니다. 경고 메시지는 무시합니다.

  3. 다음 명령을 실행하여 자체 서명된 인증서를 생성하고 해당 인증서를 신뢰하도록 로컬 컴퓨터를 구성합니다.

     dotnet dev-certs https --trust

  4. 자동 생성된 인증서를 설치하라는 메시지가 표시되면 예를 선택합니다.

  5. 터미널 프롬프트에서 다음 명령을 실행하여 .NET 웹앱을 실행합니다.

     dotnet run

  6. InPrivate 모드에서 Microsoft Edge 브라우저를 시작한 다음, https://localhost:5001 URL로 이동합니다.

  7. 연결이 비공개가 아닙니다라는 메시지가 표시되는 경우 고급을 선택한 다음, localhost로 계속(안전하지 않음) 링크를 선택합니다.

  8. 열려 있는 브라우저 창에서 메시지가 표시되면 이 랩에서 이전에 만든 aad_lab_user1 Microsoft Entra ID 계정의 UPN과 암호로 Pa55w.rd1234를 사용하여 인증합니다.

    참고: 계정 보호 도움말 창이 표시되면 지금은 건너뛰기를 선택합니다.

    참고: 관리자 승인 필요 메시지가 표시되는 경우 상승된 권한이 있는 Microsoft Entra ID를 대신 사용하여 이 작업의 나머지 부분을 완료해야 합니다. 그렇게 하려면 관리자 계정이 있나요? 해당 계정으로 로그인하세요. 링크를 선택하고, 관리자 계정으로 로그인한 후 다음 단계를 진행합니다.

  9. 브라우저 창에서 요청한 사용 권한 웹 페이지가 자동으로 열립니다.

  10. 기본 프로필 보기 및 액세스 권한이 부여된 데이터에 대한 액세스 유지를 포함하여 요청된 사용 권한을 검토합니다.

  11. 수락을 선택합니다.

  12. 브라우저에 표시된 대상 사이트의 시작 홈페이지를 검토하고 aad_user1 Microsoft Entra ID 계정의 UPN이 브라우저 창에 나타나는지 확인합니다.

  13. 시작 페이지에서 로그아웃을 선택합니다.

  14. 로그아웃할 계정을 선택하라는 메시지가 표시되면 aad_lab_user1 Microsoft Entra ID 계정을 선택합니다. 로그아웃됨 페이지로 자동으로 리디렉션됩니다.

  15. Microsoft Edge 브라우저를 닫습니다.

검토

이 연습에서는 단일 테넌트 웹앱을 구현하고 단일 테넌트 Microsoft Entra 환경에서 테스트했습니다.