고객 계정 소셜 로그인

고객 계정의 기본 비밀번호 없는 로그인 환경 외에도 Google 및 Facebook 계정을 연결하여 고객이 소셜 자격 증명을 사용하여 로그인하도록 할 수 있습니다.

고객 계정에 소셜 로그인을 활성화하면 익숙한 인증 방법을 통해 고객에게 더 빠른 로그인 환경을 제공할 수 있습니다. 스토어에서 여러 소셜 로그인 방법을 활성화할 수 있습니다.

자체 ID 공급업체를 고객 계정에 연결했으며 소셜 로그인을 연결하려는 경우 외부 ID 공급업체에 문의해야 합니다.

소셜 로그인을 고객 계정에 연결할 때 고려 사항

소셜 로그인을 고객 계정에 연결하기 위한 다음 고려 사항을 검토하십시오.

  • 고객 계정에 연결하려는 제공업체의 개발자 계정이 있어야 합니다.
  • 소셜 로그인을 사용할 때 Shopify에 동기화되는 유일한 고객 데이터는 고객의 이메일 주소입니다.

Google을 고객 계정에 연결

Google을 고객 계정에 연결하려면 다음 작업을 순서대로 완료해야 합니다.

설정하는 동안 Google Cloud Console 및 Shopify 관리자의 브라우저 탭 간에 전환해야 합니다. Google을 고객 계정에 연결하려면 Google Cloud 계정이 설정되어 있어야 합니다. Google Cloud에 대해 자세히 알아보려면 Google의 도움말 문서를 참조하십시오.

1단계: Shopify 관리자에서 Google로 로그인 페이지 열기

  1. Shopify 관리자에서 설정 > 고객 계정(으)로 이동합니다.

  2. 인증 섹션에서 관리를 클릭합니다.

  3. Google 옆의 연결을 클릭하여 Google로 로그인 페이지를 엽니다.

이 페이지에는 Google 앱의 OAuth 클라이언트를 구성할 때 복사하여 붙여넣어야 하는 정보가 포함되어 있으므로 별도의 브라우저 탭에 이 페이지를 열어 두십시오.

2단계: Google Cloud Console에서 앱 생성

  1. 다른 브라우저 탭에서 Google Cloud Console에 로그인합니다.
  2. 기존 프로젝트를 선택하거나 새 프로젝트를 생성합니다. 프로젝트 대시보드로 리디렉션됩니다.
  3. 메뉴를 클릭한 다음 API 및 서비스 > 자격 증명을 클릭합니다.
  4. 동의 화면 구성 > 시작하기를 클릭합니다.
  5. 프로젝트 OAuth 구성 세부 정보를 완료합니다.
    1. 고객이 알아볼 수 있는 이름(예: 온라인 스토어 이름)을 앱에 지정합니다. 기술 지원을 위한 이메일을 제공한 후 다음을 클릭합니다.
    2. 대상 섹션에서 외부를 선택한 후 다음을 클릭합니다.
    3. 프로젝트에 대해 Google에서 보낼 수 있는 알림에 대한 연락처 이메일을 제공한 후 다음을 클릭합니다.
    4. Google의 API 서비스 사용자 데이터 정책에 동의한 후 계속을 클릭합니다.
    5. 생성을 클릭합니다.
  6. 동의 화면에서 고객에게 표시되는 앱의 정책 정보를 구성합니다.
    1. 브랜딩을 클릭합니다.
    2. 앱 도메인 섹션에 홈페이지 링크, 공개 개인정보처리방침 링크 및 서비스 약관 링크를 포함합니다. 스토어 정책 생성에 대해 자세히 알아보십시오.

3단계: Google Cloud Console에서 앱의 OAuth 클라이언트 구성

이 단계를 수행하려면 Shopify 관리자 Google로 로그인 페이지의 설정 지침 섹션에서 세부 정보를 복사하여 Google Cloud Console 탭의 해당 필드에 붙여넣어야 합니다.

  1. Google Cloud Console의 프로젝트 앱에서 개요를 클릭합니다.
  2. 지표 섹션에서 OAuth 클라이언트 생성을 클릭합니다.
  3. OAuth 클라이언트 세부 정보를 구성합니다.
    1. 애플리케이션 유형 드롭다운 메뉴에서 웹 애플리케이션을 선택합니다.
    2. 이름 필드에 이름을 입력합니다.
  4. 앱의 승인된 Javascript 출처를 구성합니다.
  5. 승인된 Javascript 출처 섹션에서 + URI 추가를 클릭합니다.
  6. Shopify 관리자의 Google로 로그인 페이지에서 승인된 Javascript 출처 값을 복사합니다.
  7. Google Cloud Console의 URI 1 필드에 값을 붙여넣습니다.
  8. Shopify 관리자의 승인된 Javascript 섹션에 URI가 두 개 이상 있는 경우 추가 URI 필드에 대해 이 단계를 반복합니다.
  9. 앱의 승인된 리디렉션 URI를 구성합니다.
  10. Google Cloud Console의 승인된 리디렉션 URI 섹션에서 + URI 추가를 클릭합니다.
  11. Shopify 관리자가 있는 브라우저 탭에서 승인된 리디렉션 URI 값을 복사합니다.
  12. Google Cloud Console로 돌아가서 URI 1 필드에 값을 붙여넣습니다.
  13. Shopify 관리자의 승인된 리디렉션 URI 섹션에 URI가 두 개 이상 있는 경우 추가 URI 필드에 대해 이 단계를 반복합니다.
  14. Google Cloud Console에서 생성을 클릭하십시오.

Google Cloud Console의 정보를 Shopify 관리자에 복사해서 붙여넣어야 하므로 4단계: Shopify 관리자에서 자격 증명 설정을 진행하는 동안 표시된 OAuth 클라이언트 생성됨 대화 상자를 열어 두십시오.

4단계: Shopify 관리자에서 자격 증명 설정

  1. Google Cloud Console의 OAuth 클라이언트 생성됨 대화 상자에서 클라이언트 ID를 복사하십시오.
  2. Shopify 관리자의 Google로 로그인 페이지에 있는 자격 증명 섹션에 클라이언트 ID를 붙여넣으십시오.
  3. Google Cloud Console의 OAuth 클라이언트 생성됨 대화 상자에서 클라이언트 보안 비밀을 복사하십시오.
  4. Shopify 관리자의 Google로 로그인 페이지에 있는 자격 증명 섹션에 클라이언트 보안 비밀을 붙여넣으십시오.
  5. Shopify 관리자의 Google로 로그인 페이지에서 저장을 클릭하십시오.

5단계: Google Cloud Console에서 앱 게시

  1. Google Cloud Console의 프로젝트 앱에서 대상을 클릭하십시오.
  2. 앱 게시를 클릭하십시오.

고객 계정에 Facebook 연결

고객 계정에 Facebook을 연결하려면 다음 작업을 순서대로 완료해야 합니다.

설정하는 동안 Meta for Developers 대시보드와 Shopify 관리자의 브라우저 탭 간에 전환해야 합니다. 고객 계정에 Facebook을 연결하려면 Meta Developer 계정이 있어야 합니다. Meta Developer로 등록하는 방법을 알아보십시오.

1단계: Shopify 관리자에서 Facebook으로 로그인 페이지 열기

  1. Shopify 관리자에서 설정 > 고객 계정(으)로 이동합니다.

  2. 인증 섹션에서 관리를 클릭합니다.

  3. Facebook 옆의 연결을 클릭하여 Facebook으로 로그인 페이지를 여십시오.

2단계: Meta for Developers 대시보드에서 앱 생성

  1. 별도의 브라우저 탭에서 Meta for Developers 대시보드로 이동한 다음 로그인을 클릭하여 로그인하십시오. Meta Developer 계정을 설정하지 않은 경우 다음 단계로 계속하기 전에 로그인 페이지에서 새 계정을 생성해야 합니다.
  2. 을 클릭하십시오.
  3. 앱 생성을 클릭하십시오.
  4. 앱 이름앱 연락처 이메일 필드를 작성한 다음 다음을 클릭하십시오.
  5. 사용 사례 추가 페이지에서 Facebook 로그인으로 사용자를 인증하고 데이터 요청을 선택한 다음 다음을 클릭하십시오.
  6. 이 앱에 연결할 비즈니스 포트폴리오 선택 페이지에서 비즈니스 포트폴리오를 선택하거나 아직 비즈니스 포트폴리오를 연결하고 싶지 않습니다.를 선택한 다음 다음을 클릭하십시오.
  7. 게시 요구 사항 페이지를 검토한 다음 다음을 클릭하십시오.
  8. 개요 페이지를 검토한 다음 대시보드로 이동을 클릭하십시오.

3단계: Meta 앱 설정 구성

  1. 앱을 생성한 후 Meta for Developers 대시보드에서 사용 사례를 클릭하십시오.
  2. Facebook 로그인으로 사용자를 인증하고 데이터 요청 사용 사례에서 사용자 지정을 클릭하십시오.
  3. 로그인 시 고객 정보를 캡처하려면 권한 및 기능 섹션의 이메일 옆에 있는 추가를 클릭하십시오.
  4. 설정을 클릭한 다음 클라이언트 OAuth 설정으로 이동하십시오.
  5. Shopify 관리자의 Facebook으로 로그인 페이지에 있는 리디렉션 URL 섹션에서 리디렉션 URL을 복사하십시오.
  6. Meta for Developers 대시보드의 설정 페이지에 있는 유효한 OAuth 리디렉션 URI 필드에 리디렉션 URL을 붙여넣으십시오.
  7. Shopify 관리자의 리디렉션 URL 섹션에 리디렉션 URL이 두 개 이상 있는 경우 추가 리디렉션 URL에 대해 이 단계를 반복하십시오.
  8. Shopify 관리자의 Facebook으로 로그인 페이지에 있는 권한 취소 URL 섹션에서 URL을 복사하십시오.
  9. Meta for Developers 대시보드의 설정 페이지에 있는 권한 취소 콜백 URL 필드에 URL을 붙여넣으십시오.
  10. Meta for Developers 대시보드의 설정 페이지에서 변경 사항 저장을 클릭하십시오.

4단계: Shopify 관리자에서 자격 증명 설정

  1. 아이콘을 클릭하여 Meta for Developers 대시보드로 돌아간 다음 앱 설정 > 기본을 클릭하십시오.
  2. Meta for Developers 대시보드에서 앱 ID를 복사하십시오.
  3. Shopify 관리자의 Facebook으로 로그인 페이지에 있는 자격 증명 섹션의 앱 ID 필드에 앱 ID를 붙여넣으십시오.
  4. Meta for Developers 대시보드에서 앱 시크릿 코드 옆의 표시를 클릭한 다음 앱 시크릿 코드를 복사하십시오.
  5. Shopify 관리자의 Facebook으로 로그인 페이지에 있는 앱 시크릿 코드 필드에 앱 시크릿 코드를 붙여넣고 저장을 클릭하십시오.
  6. Shopify 관리자에서 변경 사항 저장을 클릭하십시오.

5단계: Facebook으로 로그인 테스트 및 활성화

  1. Shopify 관리자의 Facebook으로 로그인 페이지에서 추가 작업 > 미리 보기를 클릭한 다음 스토어에 로그인하는 고객인 것처럼 Facebook 인증 흐름을 테스트하십시오.
  2. 켜기를 클릭하십시오.

Facebook으로 로그인을 켠 후 온라인 스토어로 이동하고 Facebook을 사용하여 고객 계정에 로그인하여 고객 경험을 테스트할 수 있습니다.

Shop으로 로그인

Shop Pay를 활성화한 경우 고객은 Shop 자격 증명 및 저장된 패스키로 로그인할 수 있습니다. 또한 스토어에서 Shop Pay를 사용하여 결제하면 Shop을 통해 자동으로 로그인됩니다.

고객 계정에 대해 Shop으로 로그인이 자동으로 활성화되며, Shop Pay를 비활성화해야만 스토어에서 제거할 수 있습니다.

스토어에 Shop으로 로그인 버튼을 추가하는 방법을 알아보세요.

소셜 로그인 옵션 관리

연결한 소셜 로그인 방법을 편집, 비활성화하거나 제거할 수 있습니다.

소셜 로그인 방법을 비활성화하거나 제거한 후에도 이용에 불편함이 없도록 고객의 로그인 상태가 유지됩니다. 소셜 로그인 세션은 자연스럽게 또는 고객이 로그아웃할 때 만료됩니다.

단계:

  1. Shopify 관리자에서 설정 > 고객 계정(으)로 이동합니다.

  2. 인증 섹션에서 관리를 클릭합니다.

  3. 변경하려는 로그인 방법 옆에 있는 메뉴를 클릭하십시오.

  4. 다음 중 하나를 수행하십시오.

    • 로그인 옵션을 편집하려면 관리를 클릭한 다음 편집할 자격 증명을 업데이트하십시오.
    • 로그인 옵션을 제거하지 않고 끄려면 끄기를 클릭하십시오.
    • 로그인 옵션을 제거하려면 제거를 클릭한 다음 대화 상자에서 제거를 클릭하십시오.

고객 계정 도메인 변경 시 소셜 로그인 업데이트

고객 계정 도메인을 다른 URL로 변경하려는 경우 Shopify에서 변경하기 전에 소셜 로그인 설정을 업데이트해야 합니다. 이렇게 하면 고객이 중단 없이 계속 로그인할 수 있습니다.

Shopify에서 고객 계정 URL을 shopify.com/1234567890/account와 같은 레거시 형식에서 새로운 하위 도메인 형식인 account.your-store.com으로 업데이트하거나, 기존 하위 도메인을 account.your-store.com에서 customers.your-store.com과 같이 다른 하위 도메인으로 변경할 때 다음 단계가 필요합니다.

소셜 제공업체에 새 고객 계정 하위 도메인 추가

소셜 제공업체 설정에 현재 도메인과 함께 새 도메인을 추가해야 합니다. Shopify에서 고객 계정 도메인을 변경하고 고객 계정의 로그인 및 로그아웃 프로세스가 정상적으로 작동하는지 확인한 후 이전 도메인 항목을 제거할 수 있습니다.

활성화한 각 소셜 로그인 옵션에 대해 이 단계를 반복해야 합니다.

단계:

Google
  1. Google Cloud Console로 이동하여 API 및 서비스 > 자격 증명을 여십시오.
  2. Shopify용으로 생성한 OAuth 2.0 클라이언트를 선택하십시오.
  3. 승인된 JavaScript 원본에 새 항목을 추가하십시오. 예: https://account.your-store.com
  4. 승인된 리디렉션 URI에 새 항목을 추가하십시오. 예: https://account.your-store.com/authentication/social/google/callback
  5. 인증 취소 콜백 URL에 새 항목을 추가하십시오. 예: https://account.your-store.com/authentication/social/google/revoke
  6. 변경 사항을 저장하십시오. 당분간은 이전 URL과 새 URL을 모두 유지하십시오.
  7. Shopify 관리자로 돌아가 단계에 따라 Shopify에서 계정 도메인을 새로운 사용자 지정 하위 도메인 URL로 변경하십시오.
  8. 스토어프론트에서 각 소셜 옵션으로 로그인 및 로그아웃을 모두 테스트하여 정상적으로 작동하는지 확인하십시오.
  9. 선택 사항: 로그인 프로세스가 정상적으로 작동하는지 확인한 후 Google로 돌아가 이전 도메인 항목을 제거할 수 있습니다.
Facebook
  1. Meta for Developers로 이동하여 앱을 여십시오.
  2. Facebook 로그인 > 설정으로 이동하십시오.
  3. 유효한 OAuth 리디렉션 URI에 새 항목을 추가하십시오. 예: https://account.your-store.com/authentication/social/facebook/callback
  4. 인증 취소 콜백 URL에 새 항목을 추가하십시오. 예: https://account.your-store.com/authentication/social/facebook/revoke
  5. 설정 > 기본 설정으로 이동하십시오.
  6. 앱 도메인에 새 항목을 추가하십시오. 예: account.your-store.com
  7. 변경 사항을 저장하십시오. 당분간은 이전 URL과 새 URL을 모두 유지하십시오.
  8. Shopify 관리자로 돌아가 단계에 따라 Shopify에서 계정 도메인을 새로운 사용자 지정 하위 도메인 URL로 변경하십시오.
  9. 스토어프론트에서 각 소셜 옵션으로 로그인 및 로그아웃을 모두 테스트하여 정상적으로 작동하는지 확인하십시오.
  10. 선택 사항: 로그인 프로세스가 정상적으로 작동하는지 확인한 후 Facebook으로 돌아가 이전 도메인 항목을 제거할 수 있습니다.