Azure AD B2C를 사용하여 샘플 웹앱에서 인증 구성

이 문서에서는 샘플 ASP.NET 웹 애플리케이션을 사용하여 웹 애플리케이션에 Azure AD B2C(Azure Active Directory B2C) 인증을 추가하는 방법을 설명합니다.

Important

이 문서에서 참조하는 샘플 ASP.NET 웹앱은 액세스 토큰이 아닌 ID 토큰을 반환하므로 REST API를 호출하는 데 사용할 수 없습니다. REST API를 호출할 수 있는 웹앱의 경우 Azure AD B2C를 사용하여 ASP.NET Core로 빌드된 Web API 보호를 참조하세요.

개요

OIDC(OpenID Connect)는 OAuth 2.0을 기반으로 하는 인증 프로토콜입니다. OIDC를 사용하여 애플리케이션에 사용자를 안전하게 로그인할 수 있습니다. 이 웹앱 샘플에서는 Microsoft Identity Web을 사용합니다. Microsoft Identity Web은 웹앱에 인증 및 권한 부여 지원을 추가하는 작업을 간소화하는 ASP.NET Core 라이브러리 집합입니다.

로그인 흐름에 포함되는 단계는 다음과 같습니다.

  1. 사용자는 웹앱으로 이동하여 로그인을 선택합니다.
  2. 앱은 인증 요청을 시작하고 사용자를 Azure AD B2C로 리디렉션합니다.
  3. 사용자가 등록하거나 로그인 하고 암호를 다시 설정합니다. 또는 소셜 계정으로 로그인할 수 있습니다.
  4. 사용자가 성공적으로 로그인하면 Azure AD B2C가 앱에 ID 토큰을 반환합니다.
  5. 앱은 ID 토큰의 유효성을 검사하고, 클레임을 읽고, 사용자에게 보안 페이지를 반환합니다.

ID 토큰이 만료되거나 앱 세션이 무효화되면 앱은 새 인증 요청을 시작하고 사용자를 Azure AD B2C로 리디렉션합니다. Azure AD B2C SSO 세션이 활성화된 경우 Azure AD B2C에서 사용자에게 다시 로그인하라는 메시지를 표시하지 않고 액세스 토큰을 발급합니다. Azure AD B2C 세션이 만료되거나 유효하지 않은 경우 사용자에게 다시 로그인하라는 메시지가 표시됩니다.

로그아웃

로그아웃 흐름에는 다음 단계가 포함됩니다.

  1. 앱에서 사용자가 로그아웃합니다.
  2. 앱은 세션 개체를 지우고 인증 라이브러리는 해당 토큰 캐시를 지웁니다.
  3. 앱은 사용자를 Azure AD B2C 로그아웃 엔드포인트로 이동하여 Azure AD B2C 세션을 종료합니다.
  4. 사용자는 앱으로 다시 리디렉션됩니다.

필수 조건

다음 중 하나를 실행하는 컴퓨터:

1단계: 사용자 흐름 구성

사용자가 앱에 로그인하려고 하면 앱은 사용자 흐름을 통해 권한 부여 엔드포인트에 대한 인증 요청을 시작합니다. 사용자 흐름은 사용자 환경을 정의하고 제어합니다. 사용자가 사용자 흐름을 완료한 후 Azure AD B2C는 토큰을 생성한 다음 사용자를 애플리케이션으로 다시 리디렉션합니다.

아직 없는 경우 사용자 흐름 또는 사용자 지정 정책을 만듭니다. 다음과 같이 3개의 개별 사용자 흐름을 만드는 단계를 반복합니다.

  • 결합된 로그인 및 등록 사용자 흐름(예: susi). 이 사용자 흐름은 암호를 잊으셨나요? 환경도 지원합니다.
  • 프로필 편집 사용자 흐름(예: edit_profile).
  • 암호 재설정 사용자 흐름(예: reset_password).

Azure AD B2C는 사용자 흐름 이름 앞에 B2C_1_를 추가합니다. 예를 들어 susiB2C_1_susi이 됩니다.

2단계: 웹 애플리케이션 등록

애플리케이션이 Azure AD B2C로 로그인할 수 있도록 하려면 Azure AD B2C 디렉터리에 앱을 등록합니다. 앱을 등록하면 앱과 Azure AD B2C 간에 트러스트 관계가 설정됩니다.

앱을 등록하는 동안 리디렉션 URI를 지정합니다. 리디렉션 URI는 사용자가 Azure AD B2C로 인증하면 Azure AD B2C에 의해 리디렉션되는 엔드포인트입니다. 앱 등록 프로세스는 앱을 고유하게 식별하는 애플리케이션 ID(클라이언트 ID라고도 함)를 생성합니다. 앱이 등록되면 Azure AD B2C는 애플리케이션 ID와 리디렉션 URI를 모두 사용하여 인증 요청을 만듭니다.

웹앱 등록을 만들려면 다음 단계를 따릅니다.

  1. Azure Portal에 로그인합니다.

  2. 여러 테넌트에 액세스할 수 있는 경우 맨 위 메뉴에서 설정 아이콘을 선택하여 디렉터리 + 구독 메뉴에서 Azure AD B2C 테넌트로 전환합니다.

  3. Azure Portal에서 Azure AD B2C를 검색하고 선택합니다.

  4. 앱 등록을 선택한 다음, 새 등록을 선택합니다.

  5. 이름 아래에 애플리케이션의 이름(예: webapp1)을 입력합니다.

  6. 지원되는 계정 유형 아래에서 모든 ID 공급자 또는 조직 디렉터리의 계정(사용자 흐름에서 사용자를 인증하는 용도) 을 선택합니다.

  7. 리디렉션 URI에서 을 선택한 다음 URL 상자에 https://localhost:44316/signin-oidc를 입력합니다.

  8. 인증에서 암시적 권한 부여 및 하이브리드 흐름으로 이동하여 ID 토큰(암시적 및 하이브리드 흐름에 사용됨) 검사box를 선택합니다.

  9. 사용 권한에서 openid 및 오프라인 액세스 권한 검사 상자에 대한 관리자 동의 부여를 선택합니다.

  10. 등록을 선택합니다.

  11. 개요를 선택합니다.

  12. 웹 애플리케이션을 구성할 때 나중에 사용할 애플리케이션(클라이언트) ID 를 기록합니다.

    Screenshot of the web app Overview page for recording your web application ID.

3단계: 웹앱 샘플 가져오기

zip 파일을 다운로드하거나 GitHub에서 샘플 웹 애플리케이션을 복제합니다.

git clone https://github.com/Azure-Samples/active-directory-aspnetcore-webapp-openidconnect-v2

경로의 총 문자 길이가 260자 이하인 폴더에 샘플 파일을 추출합니다.

4단계: 샘플 웹앱 구성

샘플 폴더의 1-WebApp-OIDC/1-5-B2C/ 폴더에서 Visual Studio 또는 Visual Studio Code로 WebApp-OpenIDConnect-DotNet.csproj 프로젝트를 엽니다.

프로젝트 루트 폴더에서 appsettings.json 파일을 엽니다. 이 파일에는 Azure AD B2C ID 공급자에 대한 정보가 포함되어 있습니다. 다음 앱 설정 속성을 업데이트합니다.

섹션
AzureAdB2C 인스턴스 Azure AD B2C 테넌트 이름의 첫 번째 부분입니다.(예를 들어 https://contoso.b2clogin.com)
AzureAdB2C 도메인 Azure AD B2C 테넌트 전체 테넌트 이름입니다(예: contoso.onmicrosoft.com).
AzureAdB2C ClientId 2단계의 웹앱 애플리케이션(클라이언트) ID입니다.
AzureAdB2C SignUpSignInPolicyId 1단계에서 만든 사용자 흐름 또는 사용자 지정 정책입니다.

최종 구성 파일은 다음 JSON과 같아야 합니다.

"AzureAdB2C": {
  "Instance": "https://contoso.b2clogin.com",
  "Domain": "contoso.onmicrosoft.com",
  "ClientId": "<web-app-application-id>",
  "SignedOutCallbackPath": "/signout/<your-sign-up-in-policy>",
  "SignUpSignInPolicyId": "<your-sign-up-in-policy>"
}

5단계: 샘플 웹앱 실행

  1. 프로젝트를 빌드하고 실행합니다.

  2. https://localhost:44316(으)로 이동합니다.

  3. 등록/로그인을 선택합니다.

    Screenshot of the sign in and sign up button on the project Welcome page.

  4. 등록 또는 로그인 프로세스를 완료합니다.

인증에 성공하면 탐색 모음에 표시 이름이 표시됩니다. Azure AD B2C 토큰이 앱에 반환하는 클레임을 보려면 클레임을 선택합니다.

Screenshot of the web app token claims.

응용 프로그램 배포

프로덕션 애플리케이션에서 앱 등록 리디렉션 URI는 일반적으로 앱이 실행되는 공개적으로 액세스할 수 있는 엔드포인트입니다(예: https://contoso.com/signin-oidc.).

언제든지 등록된 애플리케이션에서 리디렉션 URI를 추가하고 수정할 수 있습니다. 리디렉션 URI에는 다음 제한 사항이 적용됩니다.

  • 회신 URL은 스키마 https로 시작해야 합니다.
  • 회신 URL은 대/소문자를 구분합니다. 해당 사례는 실행 중인 애플리케이션의 URL 경로에 대한 대/소문자와 일치해야 합니다.

다음 단계

  • 코드 샘플에 대해 자세히 알아보기
  • Azure AD B2C사용하여 사용자 고유의 웹앱에서 인증을 사용하도록 설정하는 방법을 알아봅니다.