Android에서 Google 로그인

소개

In this guide, you will learn how to setup Google Login with Capgo Social Login for Android. I assume that you have already read the 일반 설정 가이드를 이미 읽었다고 가정합니다..

Android에서 Google 로그인 사용

이 부분에서 Android에서 Google 로그인을 설정하는 방법을 배울 것입니다.

주의

안드로이드 SHA1 인증서는 매우 번거롭고, 누구에게도 이 설정을 하게 하고 싶지 않습니다. 다음 단계는 앱이 Google Play Store에 게시되지 않은 가장 단순한 시나리오를 가정하고, 로컬 시뮬레이터나 개발 장치만 사용하는 경우에만 적용됩니다.

Google Play Store에 앱을 배포한 경우, 반드시 추가적인 안드로이드 클라이언트 ID를 생성해야 합니다. 이 클라이언트 ID에는 Google Play 콘솔에서 얻은 SHA1을 포함해야 합니다. 프로덕션 릴리스에 사용되는 SHA1 해시를 찾으려면, Test and release > Setup > App Signing.

마지막으로, 설정을 잘못하면 오류가 명확하지 않을 수 있습니다. 오류를 디버깅하는 것은 매우 어려울 수 있습니다. 설정이 어려우면, Github 이슈를 참조하세요..

추가적으로, Google 로그인 설정을 위한 안드로이드의 Troubleshooting

Note

Android 클라이언트 ID를 여러 개 만들 수 있습니다. 여러 개의 SHA1 인증서가 있는 경우 필수입니다.

1. Android 클라이언트 ID 만들기

   1. 검색 바 클릭

      

   2. 검색어 입력 credentials 그리고 APIs and Services 스크린샷의 2번에 해당하는

      

   3. 자격 증명 옵션 클릭 create credentials

      

   4. 선택 OAuth client ID

      

   5. Select the Android 애플리케이션 유형

      

   6. Android Studio를 열어보세요

   7. 프로젝트 탐색기에서 Gradle Scripts 섹션을 찾으세요 Gradle Scripts

      

   8. 모듈 build.gradle build.gradle (Module: app) 파일을 찾으세요 app

      

   9. . 이 값은 이후에 사용됩니다. android.defaultConfig.applicationId이 값은 이후에 사용됩니다. package name __CAPGO_KEEP_0__

      

   10. __CAPGO_KEEP_2__ android __CAPGO_KEEP_3__ ./gradlew signInReport

   
   11. __CAPGO_KEEP_5__ SHA1.
   
   12. __CAPGO_KEEP_7__ applicationId __CAPGO_KEEP_8__ Package Name __CAPGO_KEEP_9__ create
   

2. __CAPGO_KEEP_11__

   1. Go to the Create credentials Google Console 페이지로 이동하세요.

   2. Set application type to Web

      

   3. Click Create

      

   4. Copy the client ID, you’ll use this as the webClientId code에 사용할 웹 클라이언트 ID를 복사하세요.

      

3. 앱을 MainActivity

   1. 앱을 Android Studio에서 열어주세요. 앱을 실행할 수 있습니다. cap open android

   2. Find MainActivity.java

      1. 폴더를 열기 app 폴더

         

      2. 찾기 java

         

      3. 찾아보세요 MainActivity.java 그리고 클릭하여

         

   3. 수정 MainActivity.java다음 code을 추가하세요

      import ee.forgr.capacitor.social.login.GoogleProvider;
      import ee.forgr.capacitor.social.login.SocialLoginPlugin;
      import ee.forgr.capacitor.social.login.ModifiedMainActivityForSocialLoginPlugin;
      import com.getcapacitor.PluginHandle;
      import com.getcapacitor.Plugin;
      import android.content.Intent;
      import android.util.Log;
      import com.getcapacitor.BridgeActivity;
      
      // ModifiedMainActivityForSocialLoginPlugin is VERY VERY important !!!!!!
      public class MainActivity extends BridgeActivity implements ModifiedMainActivityForSocialLoginPlugin {
      
            @Override
            public void onActivityResult(int requestCode, int resultCode, Intent data) {
              super.onActivityResult(requestCode, resultCode, data);
      
              if (requestCode >= GoogleProvider.REQUEST_AUTHORIZE_GOOGLE_MIN && requestCode < GoogleProvider.REQUEST_AUTHORIZE_GOOGLE_MAX) {
                PluginHandle pluginHandle = getBridge().getPlugin("SocialLogin");
                if (pluginHandle == null) {
                  Log.i("Google Activity Result", "SocialLogin login handle is null");
                  return;
                }
                Plugin plugin = pluginHandle.getInstance();
                if (!(plugin instanceof SocialLoginPlugin)) {
                  Log.i("Google Activity Result", "SocialLogin plugin instance is not SocialLoginPlugin");
                  return;
                }
                ((SocialLoginPlugin) plugin).handleGoogleLoginIntent(requestCode, data);
              }
            }
      
            // This function will never be called, leave it empty
            @Override
            public void IHaveModifiedTheMainActivityForTheUseWithSocialLoginPlugin() {}
      }

   4. 파일을 저장

4. Use Google Login in your application

   1. 먼저 import SocialLogin

      import { SocialLogin } from '@capgo/capacitor-social-login';

   2. initialize를 호출하세요. 이 함수는 한 번만 호출해야 합니다.

      // onMounted is Vue specific
      // webClientId is the client ID you got in the web client creation step not the android client ID.
      onMounted(() => {
        SocialLogin.initialize({
          google: {
            webClientId: '673324426943-avl4v9ubdas7a0u7igf7in03pdj1dkmg.apps.googleusercontent.com',
          }
        })
      })

   3. 호출 SocialLogin.login버튼을 만들고 클릭 시 다음 code을 실행하세요.

      const res = await SocialLogin.login({
        provider: 'google',
        options: {}
      })
      // handle the response
      console.log(JSON.stringify(res))

      주의

      Google을 초기화할 때 mode: 'offline', SocialLogin.login() __CAPGO_KEEP_0__ serverAuthCode 백엔드와 앱 간 데이터 교환 흐름을 위해 사용하세요. 호출하지 마세요. SocialLogin.refresh({ provider: 'google' }) 앱에서 호출하지 마세요. serverAuthCode 앱에서 호출하지 마세요.

5. 백엔드에서 Google 리프레시 토큰을 저장하고, 백엔드에서 리프레시하세요.

   1. 테스트를 위해 에뮬레이터를 구성하세요. Device manager 에뮬레이터로 이동하세요.

      

   2. Android Studio의 디바이스 매니저에서 플러스 버튼이 강조된 상태로

      

   3. 가상 디바이스 구성에서 가상 디바이스 생성 버튼을 클릭하세요. Play Store 플레이 스토어를 지원하는 디바이스 중에任意의 디바이스를 선택하세요.

      

      As you can see, the pixel 8 supports the Play Store services

   4. Click next

      

   5. OS 이미지가 다음 형식이어야 합니다. Google Play. IT MUST OS 이미지가 다음 형식이어야 합니다. Google Play

      

   6. 다음 단계를 클릭하여

      

   7. Confirm your device. You can name your emulator as you prefer

      

   8. 시뮬레이터로 Device Manager 가서 기기를 부팅하세요.

      

   9. 시뮬레이터가 부팅되면 설정으로 가세요.

      

   10. 설정으로 Google Play

   
   11. 클릭 Update 약 60초 기다리세요.
   

6. 애플리케이션을 테스트하세요.

   정확하게 모든 것을 수행했다면 Google 로그인 흐름이 올바르게 작동되어야 합니다:

   

문제 해결

문제가 발생하면 Google Cloud Console의 앱 구성과 값을 비교하세요. Android Google Sign-In 오류는 일반적으로 패키지 이름, SHA-1, 또는 클라이언트 ID 일치 오류로 인해 발생합니다.

인증 관리자, SHA-1 및 Firebase

Android에서 이 플러그인은 Google Credential Manager (androidx.credentials 그리고 Google에 로그인하세요) GoogleSignInClient API. GetCredentialCustomException: [28444] Developer console is not set up correctly Logcat 오류, 예를 들어

Logcat을 필터링하세요. GoogleProvider or CapgoSocialLogin after a failed login. The plugin logs your package name, signing SHA-1, and a masked webClientId so you can compare them against Google Cloud Console.

Google Cloud 설정이 필요합니다.

Google Cloud 프로젝트에 두 가지 종류의 OAuth 2.0 클라이언트 ID가 필요합니다.

클라이언트 유형	사용 목적	설치 위치
웹 애플리케이션	서버 / ID 토큰 대상	webClientId in SocialLogin.initialize()
Android, 각 인증 키당 하나씩	Google Cloud Console에서만 사용하세요. 이 ID를	A common mistake는 Android client ID를 사용하는 것입니다. webClientId

Credential Manager는 Web client ID를 필요로 합니다. Android client ID는 단지 패키지 이름과 SHA-1만 등록하면 됩니다. webClientId테스트하는 빌드에 사용하는 인증서당 Android OAuth 클라이언트를 하나씩 생성하세요:

Debug:

• debug 버전의 경우. ./gradlew signingReport Release: 실제로 설치하는 APK 또는 AAB에서.
• Play App Signing: Play Console > App integrity > App signing key certificate에서 찾습니다. Play Store 빌드에 필요합니다. 업로드 키 SHA-1이 이미 등록되어도.
• The

in applicationId in android/app/build.gradle Android OAuth client 패키지 이름이 정확히 일치해야 합니다. 포함된任何 접미사도. .debug 테스트 모드인 OAuth 동의 화면이 있는 경우, Audience > 테스트 사용자 아래에 테스트하는 모든 Google 계정을 추가하세요. 앱을 Production으로 게시하는 것은

와 email 권한에 필요하지 않습니다. Digital Asset Links ( profile )은 Credential Manager를 통해 Google과 로그인하는 경우에만 필요합니다.assetlinks.jsonGoogle Cloud의 변경 사항은 몇 시간 동안 전파될 수 있습니다.

오류 28444: 개발자 콘솔이 올바르게 설정되지 않았습니다.

제목이 '오류 28444: 개발자 콘솔이 올바르게 설정되지 않았습니다.'인 섹션

를 combination으로 거부했을 때 발생합니다. 이 체크리스트를 통해 작업하세요: webClientId확인

1. 이것은 거의 항상 Google이 설치된 APK 서명 인증서, 패키지 이름, 및 webClientId __CAPGO_KEEP_0__은 웹 애플리케이션 클라이언트 ID로 끝나며 .apps.googleusercontent.com.
2. 애플리케이션을 실행하고, 실패를 재현하고, Logcat을 읽어보세요. GoogleProvider, signingSha1=Android 및 package=.
3. Google Cloud Console > Credentials에서 , Android OAuth 클라이언트를 열고 정확한 패키지 이름 및 SHA-1을 확인하세요.릴리스 빌드를 테스트하는 경우, 디버그 키 스토어만으로 SHA-1을 등록하지 마세요.
4. Play 스토어를 통해 앱을 배포하는 경우, 또한 Play 앱 서명 SHA-1을 등록하세요.
5. 웹 및 Android 클라이언트가 동일한 Google Cloud 프로젝트에 존재해야 합니다.
6. consent 화면이 테스트 모드일 경우, Google 계정이 테스트 사용자인지 확인하세요.
7. 콘솔 변경 후 기다리며 다시 시도하세요.
8. 디버그 빌드의 계정 선택이 잘못된 경우에도 SHA-1 또는 클라이언트 ID 불일치가 발생할 수 있습니다. 콘솔 설정을 위에서부터 수정하세요.

USER_CANCELLED __CAPGO_KEEP_0__

SHA-1을 설치한 빌드에서 추출하세요

debug 또는 로컬 빌드:

cd android && ./gradlew signingReport

인증된 릴리스 APK:

keytool -printcert -jarfile android/app/release/app-release.apk

해당 패키지 이름이 일치하는 Android OAuth 클라이언트에 SHA-1을 추가하고 동일한 인증된 APK를 다시 설치한 후 다시 테스트하세요:

adb install android/app/release/app-release.apk

로그인 결과를 읽는 중입니다

__CAPGO_KEEP_0__는 result:

const login = await SocialLogin.login({ provider: 'google' });
const idToken = login.result?.idToken;

Firebase Auth의 경우 idToken 를 사용하여 webClientId 에서 initialize.

개발용 SHA-1 인증서를 얻을 수 없다면 이 이슈 댓글 는 프로젝트에 키스토어를 추가하는 방법을 설명합니다.

Google Login on Android에서 계속하기

__CAPGO_KEEP_1__를 사용하고 있습니다. Google Android 로그인 인증 및 계정 흐름을 계획하고 연결하려면 @capgo/capacitor-social-login을 사용하여 @capgo/capacitor-social-login의 원시 기능을 사용하여 @capgo/capacitor-social-login @capgo/capacitor-social-login의 구현 세부 정보를 위해 @capgo/capacitor-passkey @capgo/capacitor-passkey의 구현 세부 정보를 위해 @capgo/capacitor-native-biometric @capgo/capacitor-native-biometric의 구현 세부 정보를 위해 두 단계 인증 두 단계 인증의 구현 세부 정보를 위해