Login Google di Android

Introduction

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 Petunjuk Pengaturan Umum.

Panduan pengaturan umum

Ini bagian ini, Anda akan belajar cara mengatur login Google di Android.

Pertimbangan

Sertifikat SHA1 Android sangat menyakitkan dan saya tidak ingin orang lain mengalami hal ini. Langkah-langkah berikutnya mengasumsikan skenario yang paling sederhana dari aplikasi yang belum dipublikasikan ke Google Play Store dan hanya digunakan oleh simulator lokal atau perangkat pengembangan.

Jika Anda telah mengirimkan aplikasi ke Google Play Store, Anda WAJIB menambahkan ID klien Android tambahan yang berisi SHA1 dari Google Play console untuk rilis produksi. Anda dapat menemukan hash SHA1 yang digunakan Google Play untuk menandatangani bundle rilis Anda di bawah Test and release > Setup > App Signing.

Terakhir, penting untuk disebutkan bahwa jika Anda salah, kesalahan tidak akan jelas. Mungkin sangat sulit untuk memperbaiki kesalahan. Jika Anda kesulitan dengan pengaturan, silakan lihat Github masalah.

Selain itu, Anda mungkin melihat bagian troubleshooting dari Pengaturan Login Google untuk Android untuk informasi lebih lanjut.

Catatan

Kamu dapat membuat beberapa ID klien Android. Ini diperlukan jika kamu memiliki beberapa sertifikat SHA1.

1. Buat ID klien Android.

   1. Klik di bar pencarian

      

   2. Cari credentials and click on the APIs and Services salah satu (nomor 2 pada screenshot)

      

   3. Klik pada create credentials

      

   4. Pilih OAuth client ID

      

   5. Pilih jenis Android Pilih jenis aplikasi

      

   6. Buka Android Studio

   7. Pada bagian bawah navigator, cari bagian Skrip Gradle Gradle Scripts

      

   8. untuk file build.gradle untuk modul tersebut app

      

   9. context android.defaultConfig.applicationId. Ini akan menjadi package name di konsol Google

      

   10. Buka terminal sekarang. Pastikan Anda berada di android Terminal menampilkan perintah gradlew signInReport ./gradlew signInReport

   
   11. Scroll ke atas perintah ini. Anda harus melihat hal berikut. Salin SHA1.
   
   12. Sekarang, kembali ke Konsole Google. Masukkan applicationId sebagai Package Name Formasi klien Android dengan nama paket dan SHA1 diisi create
   

2. Membuat klien web (ini diperlukan untuk Android)

   1. Pergi ke halaman Create credentials di Google Console

   2. Setel jenis aplikasi ke Web

      

   3. Klik Create

      

   4. Salin ID klien, Anda akan menggunakan ini sebagai webClientId in your JS/TS code

      

3. Ubahlah MainActivity

   1. Buka aplikasi Anda di Android Studio. Anda dapat menjalankan cap open android

   2. Cari MainActivity.java

      1. Buka folder app Folder

         

      2. Cari java

         

      3. Temukan Akun Anda MainActivity.java Klik pada tombol tersebut

         

   3. Modify MainActivity.javaTolong tambahkan berikut: 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. Simpan file

4. Pakai Login Google di aplikasi Anda

   1. Pertama, import SocialLogin

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

   2. Memanggil inisialisasi. Ini harus dipanggil hanya sekali.

      // 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. Panggil SocialLogin.login. Create a button and run the following code on click.

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

      Caution

      Jika Anda menginisialisasi Google dengan mode: 'offline', SocialLogin.login() mengembalikan serverAuthCode untuk aliran tukar balik backend Anda. Jangan panggil SocialLogin.refresh({ provider: 'google' }) dalam aplikasi dalam mode tersebut. Tukar serverAuthCode di backend Anda, simpan token tukar balik Google di sana, dan tukar di backend.

5. Konfigurasi emulator untuk tes

   1. Pergi ke Device manager dan klik tombol plus

      

   2. Buat perangkat virtual

      

   3. Pilih perangkat apa pun dengan Play Store ikon

      

      Seperti yang Anda lihat, pixel 8 mendukung Play Store layanan

   4. Klik next

      

   5. Pastikan bahwa gambar OS memiliki jenis Google Play. IT IT HARUS Google Play

      

   6. Klik berikutnya

      

   7. Konfirmasi perangkat Anda. Anda dapat menamai emulator Anda sesuai keinginan Anda

      

   8. Masuk ke Device Manager dan boot simulator Anda

      

   9. Setelah simulator booting, masuk ke pengaturan perangkatnya

      

   10. Masuk ke Google Play

   
   11. Klik Update dan tunggu sekitar 60 detik
   

6. Tes aplikasi Anda

   Jika Anda telah melakukan semuanya dengan benar, Anda seharusnya melihat alur login Google berjalan dengan baik:

   

Troubleshooting

Jika Anda mengalami masalah, pertama-tama bandingkan konfigurasi aplikasi Anda dengan nilai Google Cloud Console. Gagal login Google Sign-In pada Android biasanya disebabkan oleh nama paket, SHA-1, atau ID klien yang tidak sesuai.

Pengelola Kredensial, SHA-1, dan Firebase

Pada Android, plugin ini menggunakan Pengelola Kredensial Google (androidx.credentials dan Masuk dengan Google), bukan versi legacy GoogleSignInClient API. Eror Logcat seperti GetCredentialCustomException: [28444] Developer console is not set up correctly Logcat kesalahan seperti

Filter Logcat dengan GoogleProvider atau CapgoSocialLogin setelah gagal login. Plugin ini merekam nama paket Anda, tanda tangan SHA-1, dan alamat IP yang disembunyikan webClientId sehingga Anda dapat membandingkannya dengan Google Cloud Console.

Diperlukan Pengaturan Google Cloud

Anda memerlukan dua jenis ID OAuth 2.0 dalam proyek Google Cloud yang sama:

Jenis Klien	Digunakan untuk	Dimana itu pergi
Aplikasi Web	Pelayanan / ID Token Audience	webClientId di SocialLogin.initialize()
Android, satu per kunci tanda tangan	Mengakui bahwa APK Anda diperbolehkan untuk mengakses Google	Google Cloud Console hanya. Jangan melewati ID ini ke webClientId

Salah satu kesalahan umum adalah menggunakan ID klien Android sebagai webClientId. Pengelola Kredensial memerlukan ID klien Web di sana. Klien Android hanya memerlukan nama paket yang benar dan SHA-1 yang terdaftar di console.

Buatlah satu klien OAuth Android untuk setiap sertifikat yang menandatangani bangun yang Anda uji:

• Dari ./gradlew signingReport untuk varian debug.
• Rilis: dari APK atau AAB yang Anda instal sebenarnya.
• Play App Signing: from Play Console > App integrity > App signing key certificate. This is required for Play Store builds even if your upload key SHA-1 is already registered.

The applicationId di android/app/build.gradle harus tepat sama dengan nama paket Android OAuth, termasuk apapun .debug sufiks.

Jika layar persetujuan OAuth berada dalam mode Pengujian, tambahkan setiap akun Google yang Anda uji di bawah Pengguna > Pengujian. Pengumuman aplikasi ke Produksi tidak diperlukan untuk email dan profile skop. Sumber Daya Digital (assetlinks.json) tidak diperlukan untuk Sign in dengan Google melalui Manajer Kredensial.

Pengubahan Cloud Google dapat memakan waktu hingga beberapa jam untuk menyebar.

Error 28444: Pengaturan konsol pengembang tidak benar

Ini hampir selalu berarti Google menolak kombinasi sertifikat penandatanganan APK yang terpasang, nama paket, dan webClientId. Lakukan checklist ini:

1. Konfirmasi webClientId adalah ID klien aplikasi Web dan diakhiri dengan .apps.googleusercontent.com.
2. Jalankan aplikasi, reproduksi kegagalan, dan baca Logcat untuk GoogleProvider, signingSha1=, dan package=.
3. Dalam Google Cloud Console > Kredensial, buka klien OAuth Android Anda dan pastikan nama paket dan SHA-1 yang tepat.
4. Jika Anda menguji rilis, daftarkan SHA-1 dari rilis tersebut, bukan hanya keystore debug.
5. Jika aplikasi Anda didistribusikan melalui Play Store, daftarkan juga SHA-1 Play App Signing.
6. Pastikan klien Web dan Android berada di proyek Google Cloud yang sama.
7. Jika layar persetujuan berada di Testing, konfirmasi bahwa akun Google adalah pengguna uji.
8. Tunggu dan ulangi setelah perubahan di konsol.

USER_CANCELLED Setelah memilih akun pada build debug yang tidak terkonfigurasi, masih bisa terjadi kesalahan SHA-1 atau ID klien. Perbaiki terlebih dahulu pengaturan konsol di atas.

Ekstrak SHA-1 dari build yang Anda instal.

Build debug atau lokal:

cd android && ./gradlew signingReport

APK rilis yang ditandatangani:

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

Tambahkan SHA-1 tersebut ke klien OAuth Android dengan nama paket yang sesuai, instal kembali APK yang sama yang ditandatangani, dan lakukan tes lagi:

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

Melihat hasil login

Token terletak di bawah result:

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

Untuk Firebase Auth, buat kredensial dengan itu idToken Untuk Firebase Auth, buat kredensial dengan itu webClientId in initialize.

Jika Anda tidak dapat mendapatkan sertifikat SHA-1 pengembangan, coba keystore khusus. Komentar Masalah Mengapa menambahkan keystore ke proyek Anda.

menjelaskan cara menambahkan keystore ke proyek Anda.

Jika Anda menggunakan Google Login pada Android untuk merencanakan autentikasi dan alur akun, hubungkannya dengan Menggunakan @capgo/capacitor-social-login untuk kemampuan asli dalam Menggunakan @capgo/capacitor-social-login Menggunakan @capgo/capacitor-social-login untuk detail implementasi dalam @capgo/capacitor-social-login Menggunakan @capgo/capacitor-passkey untuk detail implementasi dalam @capgo/capacitor-passkey Menggunakan @capgo/capacitor-native-biometric untuk detail implementasi dalam @capgo/capacitor-native-biometric, dan Autentikasi dua faktor Untuk detail implementasi di Autentikasi Dua Faktor.