Azure Active Directory B2C를 사용하여 Google 계정으로 등록 설정 및 로그인

시작하기 전 에_ _ 정책 유형 선택 선택기를 사용하여 설정하려는 정책 유형을 선택합니다. Azure Active Directory B2C는 사용자가 애플리케이션과 상호 작용하는 방법을 정의하는 두 가지 방법, 즉 미리 정의된 사용자 흐름 또는 완전히 구성 가능한 사용자 지정 정책을 통해 제공합니다. 이 문서에서 필요한 단계는 각 방법마다 다릅니다.

중요

2021년 9월 30일부터 Google은 웹 보기 로그인 지원을 중단합니다. 앱이 포함된 웹 보기로 사용자를 인증하고 Azure AD B2B와 함께 Google 페더레이션을 사용하는 경우 Google Gmail 사용자는 인증할 수 없습니다. 자세한 정보를 알아보세요.

참고

Azure Active Directory B2C에서 사용자 지정 정책은 주로 복잡한 시나리오를 해결하기 위해 설계되었습니다. 대부분의 시나리오에서 기본 제공 사용자 흐름을 사용하는 것이 좋습니다.

사전 요구 사항

Google 애플리케이션 만들기

Azure Active Directory B2C(Azure AD B2C)에서 사용자가 Google 계정으로 로그인할 수 있도록 설정하려면 Google Developers Console에서 애플리케이션을 만들어야 합니다. 자세한 내용은 OAuth 2.0 설정을 참조하세요. Google 계정이 없는 경우 https://accounts.google.com/SignUp에서 가입할 수 있습니다.

  1. Google 계정 자격 증명을 사용하여 Google 개발자 콘솔에 로그인합니다.
  2. 페이지의 왼쪽 위 모서리에서 프로젝트 목록을 선택한 다음 새 프로젝트 를 선택합니다.
  3. 프로젝트 이름 을 입력하고 만들기 를 선택합니다.
  4. 화면 왼쪽 위에 있는 프로젝트 드롭다운을 선택하여 새 프로젝트를 사용하고 있는지 확인합니다. 이름으로 프로젝트를 선택하고 열기 를 선택합니다.
  5. 왼쪽 메뉴에서 OAuth 동의 화면 을 선택하고 외부 를 선택한 다음 만들기 를 선택합니다. 애플리케이션의 이름 을 입력합니다. 권한 있는 도메인 섹션에 b2clogin.com 을 입력하고 저장 을 선택합니다.
  6. 왼쪽 메뉴에서 자격 증명 을 선택하고 자격 증명 만들기 > Oauth 클라이언트 ID 를 선택합니다.
  7. 애플리케이션 형식 에서 웹 애플리케이션 을 선택합니다.
    1. 애플리케이션의 이름 을 입력합니다.
    2. 권한이 부여된 JavaScript 원본https://your-tenant-name.b2clogin.com을 입력합니다. 사용자 지정 도메인을 사용하는 경우 https://your-domain-name를 입력합니다.
    3. 권한이 부여된 리디렉션 URLhttps://your-tenant-name.b2clogin.com/your-tenant-name.onmicrosoft.com/oauth2/authresp를 입력합니다. 사용자 지정 도메인을 사용하는 경우 https://your-domain-name/your-tenant-name.onmicrosoft.com/oauth2/authresp를 입력합니다. your-domain-name을 사용자 지정 도메인으로, your-tenant-name를 테넌트의 이름으로 바꿉니다. Azure AD B2C에서 테넌트가 대문자로 정의되어 있더라도 테넌트 이름을 입력할 때는 소문자만 사용합니다.
  8. 만들기 를 클릭합니다.
  9. 클라이언트 ID클라이언트 비밀 값을 복사합니다. 테넌트에서 Google을 ID 공급자로 구성하려면 둘 모두가 필요합니다. 클라이언트 암호 는 중요한 보안 자격 증명입니다.

Google을 ID 공급자로 구성

  1. Azure AD B2C 테넌트의 전역 관리자로 Azure Portal에 로그인합니다.
  2. Azure AD B2C 테넌트를 포함하는 디렉터리를 사용하려면 위쪽 메뉴에서 디렉터리 + 구독 필터를 선택하고, 테넌트가 포함된 디렉터리를 선택합니다.
  3. Azure Portal의 왼쪽 상단 모서리에서 모든 서비스 를 선택하고 Azure AD B2C 를 검색하여 선택합니다.
  4. ID 공급자 를 선택한 다음, Google 을 선택합니다.
  5. 이름 을 입력합니다. 예: Google+
  6. 클라이언트 ID 에 대해 이전에 만든 Google 애플리케이션의 클라이언트 ID를 입력합니다.
  7. 클라이언트 암호 에는 기록한 클라이언트 암호를 입력합니다.
  8. 저장 을 선택합니다.

사용자 흐름에 Google ID 공급자 추가

이 시점에서 Google ID 공급자가 설정되었지만 아직 로그인 페이지에서 사용할 수는 없습니다. 사용자 흐름에 Google ID 공급자를 추가하려면 다음을 수행합니다.

  1. Azure AD B2C 테넌트에서 사용자 흐름 을 선택합니다.
  2. Google ID 공급자에 추가하려는 사용자 흐름을 클릭합니다.
  3. 소셜 ID 공급자 에서 Google 을 선택합니다.
  4. 저장 을 선택합니다.
  5. 정책을 테스트하려면 사용자 흐름 실행 을 선택합니다.
  6. 애플리케이션 의 경우 이전에 등록한 testapp1 이라는 웹 애플리케이션을 선택합니다. 회신 URL 에는 https://jwt.ms가 표시되어야 합니다.
  7. 사용자 흐름 실행 단추를 선택합니다.
  8. 등록 또는 로그인 페이지에서 Google 을 선택하여 Google 계정으로 로그인합니다.

로그인 프로세스가 성공하면 브라우저가 Azure AD B2C에서 반환된 토큰의 내용을 표시하는 https://jwt.ms로 리디렉션됩니다.

정책 키 만들기

이전에 Azure AD B2C 테넌트에서 기록했던 클라이언트 비밀을 저장해야 합니다.

  1. Azure Portal에 로그인합니다.
  2. Azure AD B2C 테넌트가 포함된 디렉터리를 사용하고 있는지 확인합니다. 최상위 메뉴에서 디렉터리 + 구독 필터를 선택하고 테넌트가 포함된 디렉터리를 선택합니다.
  3. Azure Portal의 왼쪽 상단 모서리에서 모든 서비스 를 선택하고 Azure AD B2C 를 검색하여 선택합니다.
  4. 개요 페이지에서 ID 경험 프레임워크 를 선택합니다.
  5. 정책 키, 추가 를 차례로 선택합니다.
  6. 옵션 으로는 Manual을 선택합니다.
  7. 정책 키의 이름 을 입력합니다. GoogleSecret)을 입력합니다. B2C_1A_ 접두사가 키의 이름에 자동으로 추가됩니다.
  8. 이전에 기록해 두었던 클라이언트 비밀을 비밀 에 입력합니다.
  9. 키 사용 에서 Signature를 선택합니다.
  10. 만들기 를 클릭합니다.

Google을 ID 공급자로 구성

사용자가 Google 계정을 사용하여 로그인하도록 설정하려면 Azure AD B2C가 엔드포인트를 통해 통신할 수 있는 클레임 공급자로 계정을 정의해야 합니다. 엔드포인트는 Azure AD B2C에서 사용하는 일련의 클레임을 제공하여 특정 사용자가 인증했는지 확인합니다.

정책의 확장 파일에서 ClaimsProviders 요소에 Google 계정을 추가하여 해당 계정을 클레임 공급자로 정의할 수 있습니다.

  1. TrustFrameworkExtensions.xml 을 엽니다.

  2. ClaimsProviders 요소를 찾습니다. 해당 요소가 없으면 루트 요소 아래에 추가합니다.

  3. 다음과 같이 새 ClaimsProvider 를 추가합니다.

    <ClaimsProvider>
      <Domain>google.com</Domain>
      <DisplayName>Google</DisplayName>
      <TechnicalProfiles>
        <TechnicalProfile Id="Google-OAuth2">
          <DisplayName>Google</DisplayName>
          <Protocol Name="OAuth2" />
          <Metadata>
            <Item Key="ProviderName">google</Item>
            <Item Key="authorization_endpoint">https://accounts.google.com/o/oauth2/auth</Item>
            <Item Key="AccessTokenEndpoint">https://accounts.google.com/o/oauth2/token</Item>
            <Item Key="ClaimsEndpoint">https://www.googleapis.com/oauth2/v1/userinfo</Item>
            <Item Key="scope">email profile</Item>
            <Item Key="HttpBinding">POST</Item>
            <Item Key="UsePolicyInRedirectUri">false</Item>
            <Item Key="client_id">Your Google application ID</Item>
          </Metadata>
          <CryptographicKeys>
            <Key Id="client_secret" StorageReferenceId="B2C_1A_GoogleSecret" />
          </CryptographicKeys>
          <OutputClaims>
            <OutputClaim ClaimTypeReferenceId="issuerUserId" PartnerClaimType="id" />
            <OutputClaim ClaimTypeReferenceId="email" PartnerClaimType="email" />
            <OutputClaim ClaimTypeReferenceId="givenName" PartnerClaimType="given_name" />
            <OutputClaim ClaimTypeReferenceId="surname" PartnerClaimType="family_name" />
            <OutputClaim ClaimTypeReferenceId="displayName" PartnerClaimType="name" />
            <OutputClaim ClaimTypeReferenceId="identityProvider" DefaultValue="google.com" />
            <OutputClaim ClaimTypeReferenceId="authenticationSource" DefaultValue="socialIdpAuthentication" />
          </OutputClaims>
          <OutputClaimsTransformations>
            <OutputClaimsTransformation ReferenceId="CreateRandomUPNUserName" />
            <OutputClaimsTransformation ReferenceId="CreateUserPrincipalName" />
            <OutputClaimsTransformation ReferenceId="CreateAlternativeSecurityId" />
            <OutputClaimsTransformation ReferenceId="CreateSubjectClaimFromAlternativeSecurityId" />
          </OutputClaimsTransformations>
          <UseTechnicalProfileForSessionManagement ReferenceId="SM-SocialLogin" />
        </TechnicalProfile>
      </TechnicalProfiles>
    </ClaimsProvider>
    
  4. client_id 를 애플리케이션 등록의 애플리케이션 ID로 설정합니다.

  5. 파일을 저장합니다.

사용자 경험 추가

이 시점에서 ID 공급자가 설정되었지만 로그인 페이지에서 아직 사용할 수는 없습니다. 자체 사용자 지정 사용자 경험이 없는 경우 기존 템플릿 사용자 경험의 복제본을 만듭니다. 그렇지 않으면 다음 단계를 계속 진행합니다.

  1. 시작 팩에서 TrustFrameworkBase.xml 파일을 엽니다.
  2. Id="SignUpOrSignIn"이 포함된 UserJourney 요소를 찾아서 전체 콘텐츠를 복사합니다.
  3. TrustFrameworkExtensions.xml 을 열어 UserJourneys 요소를 찾습니다. 요소가 존재하지 않는 경우 추가합니다.
  4. 이전 단계에서 복사한 UserJourney 요소의 전체 콘텐츠를 UserJourneys 요소의 자식으로 붙여넣습니다.
  5. 사용자 경험의 ID 이름을 바꿉니다. 예들 들어 Id="CustomSignUpSignIn"입니다.

사용자 경험에 ID 공급자 추가

이제 사용자 경험이 있으므로 사용자 경험에 새 ID 공급자를 추가합니다. 먼저 로그인 단추를 추가한 다음, 단추를 작업에 연결합니다. 이 작업은 이전에 만든 기술 프로필입니다.

  1. 사용자 경험의 Type="CombinedSignInAndSignUp" 또는 Type="ClaimsProviderSelection"을 포함하는 오케스트레이션 단계 요소를 찾습니다. 일반적으로 첫 번째 오케스트레이션 단계입니다. ClaimsProviderSelections 요소에는 사용자가 로그인 할 수 있는 ID 공급자의 목록이 포함되어 있습니다. 요소의 순서는 사용자에게 표시되는 로그인 단추의 순서를 제어합니다. ClaimsProviderSelection XML 요소를 추가합니다. TargetClaimsExchangeId 의 값을 친숙한 이름으로 설정합니다.

  2. 다음 오케스트레이션 단계에서 ClaimsExchange 요소를 추가합니다. ID 를 대상 클레임 교환 ID의 값으로 설정합니다. TechnicalProfileReferenceId 의 값을 이전에 만든 기술 프로필의 ID로 업데이트합니다.

다음 XML은 ID 공급자를 사용하여 사용자 경험의 처음 두 오케스트레이션 단계를 보여줍니다.

<OrchestrationStep Order="1" Type="CombinedSignInAndSignUp" ContentDefinitionReferenceId="api.signuporsignin">
  <ClaimsProviderSelections>
    ...
    <ClaimsProviderSelection TargetClaimsExchangeId="GoogleExchange" />
  </ClaimsProviderSelections>
  ...
</OrchestrationStep>

<OrchestrationStep Order="2" Type="ClaimsExchange">
  ...
  <ClaimsExchanges>
    <ClaimsExchange Id="GoogleExchange" TechnicalProfileReferenceId="Google-OAuth2" />
  </ClaimsExchanges>
</OrchestrationStep>

신뢰 당사자 정책 구성

신뢰 당사자 정책(예: SignUpSignIn.xml)은 Azure AD B2C에서 실행할 사용자 경험을 지정합니다. 신뢰 당사자 내에서 DefaultUserJourney 요소를 찾습니다. ID 공급자를 추가한 사용자 경험 ID와 일치하도록 ReferenceId 를 업데이트합니다.

다음 예제에서는 CustomSignUpOrSignIn 사용자 경험에 대해 ReferenceIdCustomSignUpOrSignIn으로 설정됩니다.

<RelyingParty>
  <DefaultUserJourney ReferenceId="CustomSignUpSignIn" />
  ...
</RelyingParty>

사용자 지정 정책 업로드

  1. Azure Portal에 로그인합니다.
  2. 포털 도구 모음에서 디렉터리 + 구독 아이콘을 선택한 다음, Azure AD B2C 테넌트가 포함된 디렉터리를 선택합니다.
  3. Azure Portal에서 Azure AD B2C 를 검색하고 선택합니다.
  4. 정책 에서 Identity Experience Framework 를 선택합니다.
  5. 사용자 지정 정책 업로드 를 선택한 다음, 변경한 두 정책 파일을 확장 정책(예: TrustFrameworkExtensions.xml), 신뢰 당사자 정책(예: SignUpSignIn.xml) 순으로 업로드합니다.

사용자 지정 정책 테스트

  1. 신뢰 당사자 정책(예: B2C_1A_signup_signin)을 선택합니다.
  2. 애플리케이션 에서 이전에 등록된 웹 애플리케이션을 선택합니다. 회신 URL 에는 https://jwt.ms가 표시되어야 합니다.
  3. 지금 실행 단추를 선택합니다.
  4. 등록 또는 로그인 페이지에서 Google 을 선택하여 Google 계정으로 로그인합니다.

로그인 프로세스가 성공하면 브라우저가 Azure AD B2C에서 반환된 토큰의 내용을 표시하는 https://jwt.ms로 리디렉션됩니다.

다음 단계

애플리케이션에 Google 토큰을 전달하는 방법에 대해 알아봅니다.