구글 로그인 설정하기

중요: 같은 이름(닉네임)으로 중복 가입 방지 옵션을 해제해 주세요. 소셜 로그인 가입자는 대부분 가입된 플랫폼의 이름(닉네임)을 그대로 사용하는 경향이 있으며, 소셜 로그인 플랫폼에서는 동일 이름(닉네임) 사용이 허용하기에, 해당 옵션을 해제해 주셔야 원활한 가입이 진행됩니다. 같은 이름(닉네임)으로 중복 가입 방지 또는 해제하기

이 도움말에서는 방문자가 Google 계정으로 간편하게 내 사이트에 가입하고 로그인 할 수 있도록 설정하는 과정을 설명합니다.

시작에 앞서

이 도움말을 진행하려면 Google 계정이 필요합니다. 아직 Google 계정이 없다면 아래 링크를 통해, 계정 만들기를 클릭하여 새로운 계정을 생성해 주세요.

Google 계정 만들기

설정방법

구글 소셜 로그인을 적용하려면 아래의 단계별 방법에 따라 설정합니다.

중요: 구글 로그인을 사용하기 위해서는 구글의 정책에 따라 도메인에 SSL 보안서버 인증서가 설치되어 있어야 합니다. SSL이 설치되지 않은 사이트는 앱을 게시(8단계 과정)할 수 없으며, 테스트 용도로만 사용 가능합니다.

1단계: Google API 콘솔 로그인 및 동의하기

  1. Google API 콘솔에 접속합니다.
  2. Google 계정으로 로그인합니다.
  3. (동의 하지 않은 경우) 서비스 약관에 동의 후 동의 및 계속하기를 클릭합니다.

2단계: 새 프로젝트 만들기

이 단계는 선택 사항입니다. 기존 프로젝트가 있는 경우 이 과정은 건너뛰고 다음 3단계를 진행해 주세요. 새 프로젝트를 만들어야 하는 경우, 이 도움말 하단의 새 프로젝트 만들기 도움말을 참고해 주세요.

3단계: 라이브러리 추가하기

  1. 왼쪽 메뉴에서 라이브러리를 클릭합니다.

  2. 마우스 휠 스크롤을 내려 소셜 항목의 Google+ API를 선택합니다.

  3. Google+ API 페이지에서 사용을 클릭합니다.

4단계: OAuth 동의 화면 구성하기

  1. 왼쪽 메뉴에서 사용자 인증 정보를 클릭합니다. (만약 왼쪽에 메뉴가 없는 경우, 왼쪽 상단의 ≡ 아이콘을 클릭 후 [API 및 서비스 > Oauth 동의 화면]을 클릭해 이동한 다음, 아래 2번 과정은 건너뛰고 3번 과정부터 진행하세요.)
  2. 동의 화면 구성 버튼을 클릭합니다.

  3. User Type을 외부로 선택하고, 만들기 버튼을 클릭합니다.

  4. 앱 정보 항목에 앱 이름(주로 사이트 이름)을 입력하고, 이용할 사용자 지원 이메일을 선택합니다.
    주의: 구글 로그인 설정 초기에는  앱 로고를 추가하지 않는 걸 추천합니다. 앱 로고 추가 시 Google의 승인이 필요하며  4~6주의 심사 기간이 소요되기 때문입니다. 나중에 다시 추가할 수 있습니다.

  5. 앱 도메인 항목에서 애플리케이션 홈페이지애플리케이션 개인정보처리방침 링크애플리케이션 서비스 약관 링크를 작성합니다.
    참고: 개인정보처리방침 및 이용약관 링크는 약관 URL 확인하기 도움말에서 알아볼 수 있습니다.

    • 애플리케이션 홈페이지: 사이트 대표 도메인을 입력합니다. (2차 도메인 사용자의 경우, 2차 도메인 전체를 입력합니다.)
    • 애플리케이션 개인정보처리방침 링크: 내도메인/?mode=privacy
    • 애플리케이션 서비스 약관 링크: 내도메인/?mode=policy
  6. 승인된 도메인 항목에서 + 도메인 추가 버튼을 클릭합니다.
  7. 대표 도메인을 입력합니다. (도메인 앞에 http 또는 https 는 입력하지 마세요.)
    참고: 2차 도메인을 사용하는 경우, 1차 도메인을 입력합니다. 예를 들어, abc.campaignus.me 대신 campaignus.me 을 입력하세요.

  8. (선택 사항) 추가할 도메인이 더 있다면 + 도메인 추가 버튼을 클릭해 모두 추가합니다. 예를 들어, 캠페이너스 서브 도메인(abc.campaignus.me)으로 접속해도 로그인되게 하려면 campaignus.me 를 추가해 주세요.

  9. 개발자 연락처 정보 항목에서 이메일 주소를 입력합니다. (Google에서 프로젝트 변경사항에 대해 알림을 보내기 위한 용도로 여러 개 추가 가능합니다.)
  10. 저장 후 계속 버튼을 클릭합니다.

5단계: 범위 추가하기

  1. 범위 추가 또는 삭제 버튼을 클릭합니다.

  2. 기본 Google 계정의 이메일 주소 확인와 개인정보(공개로 설정한 개인정보 포함) 보기 2가지 항목을 선택하고, 업데이트 버튼을 클릭합니다.

  3. 페이지 하단의 저장 후 계속 버튼을 클릭합니다.

6단계: 테스트 사용자 추가하기

  1. + ADD USERS 버튼을 클릭합니다.

  2. 이메일 주소를 입력해 테스트 사용자를 추가합니다. (테스트 사용자는 100명까지 추가 가능합니다.)
  3. 저장 후 계속 버튼을 테스트 사용자 추가를 완료합니다.

7단계: OAuth 클라이언트 ID 만들기

  1. 왼쪽 메뉴에서 사용자 인증 정보를 클릭합니다.
  2. 상단의 + CREATE CREDENTIALS를 클릭하면 나타나는 메뉴 중 OAuth 클라이언트 ID를 클릭합니다.

  3. 아래의 그림과 설명을 참고해 애플리케이션 유형을 선택하고, 이름승인된 리디렉션 URI를 입력합니다.

    1. 애플리케이션 유형웹 애플리케이션을 선택합니다.
    2. 이름: 사이트 이름을 입력합니다.
    3. 승인된 자바스크립트 원본: 이 항목은 무시하고 건너뜁니다.
    4. 승인된 리디렉션 URl: https://내도메인/oauth 형식으로 입력합니다.
      중요: 도메인은 SSL 보안서버 인증서가 적용되어 https 로 시작해야 합니다. SSL을 설치하지 않은 경우, 구글 로그인 앱을 게시할 수 없으며, 테스트 용도로만 사용 가능합니다.
  4. 아래의 만들기 버튼을 클릭합니다.
  5. 클라이언트 ID와 클라이언트 보안 비밀번호 가 생성되면 오른쪽의 복사 아이콘을 클릭해 복사하고, 메모장에 메모해 둡니다.

  6. 확인을 클릭해 클라이언트 ID와 비밀번호가 표시된 창을 종료합니다.

8단계: 앱 게시하기

  1. 왼쪽 메뉴에서 OAuth 동의 화면을 클릭합니다.
  2. 앱 게시 버튼을 클릭합니다.

  3. 확인을 클릭합니다.

9단계: 내 사이트에 Google 로그인 사용 설정하기

  1. 캠페이너스 사이트 관리자 페이지로 이동합니다. 
  2. 왼쪽 메뉴에서 [환경설정 > 소셜 로그인 / API 설정]을 클릭합니다.
  3. Google 로그인 항목으로 이동합니다.
  4. Google 로그인 사용을 선택합니다.
  5. 클라이언트 ID와 클라이언트 보안 비밀에 위 7단계에서 복사한 ID와 비밀번호를 붙여넣습니다. (단축키: CTRL + V)

  6. 저장 버튼을 클릭합니다.
  7. 이제 Google 로그인 기능을 사용할 수 있게 됩니다.

프로젝트 생성 및 삭제방법

앱 로고 추가로 인한 심사, 원인 불명의 설정 오류 등으로 구글 로그인 설정에 문제가 있는 경우, 기존 프로젝트를 삭제하고, 새 프로젝트를 만들어 구글 로그인을 재설치할 수 있습니다.

새 프로젝트를 만든 다음에는 위 설정방법을 참고해, 구글 로그인를 재설정하세요.

새 프로젝트 만들기

  1. 왼쪽 상단에 위치한 프로젝트명을 클릭합니다.

  2. 프로젝트 선택 창이 나오면 새 프로젝트를 클릭합니다.

  3. (선택 사항) 프로젝트 이름을 수정하고, 위치를 선택합니다.

  4. 모두 설정했으면 만들기 버튼을 클릭합니다.
  5. 새 프로젝트가 생성됩니다. 생성이 완료되기 까지 약간의 시간이 소요될 수 있습니다.
  6. 다시 프로젝트명을 클릭합니다. 새 프로젝트 생성이 완료되면, 생성된 프로젝트를 클릭합니다.

  7. 이제 위 설정방법 도움말의 3단계로 돌아가 새롭게 구글 로그인 설정을 진행합니다.

기존 프로젝트 삭제하기

  1. 계정 프로필 이미지 왼쪽의 더보기 아이콘을 클릭하고, 프로젝트 설정을 클릭합니다.

  2. 종료를 클릭합니다.

  3. 프로젝트 ID를 입력하고, 종료를 클릭합니다.
    참고: 프로젝트 ID는, 입력칸 상단에 표시된 ID를 참고해 입력하세요.

  4. 삭제 확인 창이 나오면 확인을 클릭합니다.
  5. 프로젝트가 삭제됩니다. (프로젝트 삭제를 알리는 이메일이 발송되며, 프로젝트는 30일 이내 삭제를 중지할 수 있습니다.)
  6. (선택 사항) 기존 프로젝트 삭제 후, 새롭게 프로젝트를 만들려면 왼쪽 상단의 프로젝트 만들기를 클릭해 생성하세요.