Firebase Google Login di iOS

Pengantar

Panduan ini akan membantu Anda mengintegrasikan Google Sign-In dengan Firebase Authentication di iOS. Saya berasumsi Anda telah menyelesaikan pengaturan Firebase Google umum.

Note

Saya akan berasumsi bahwa Anda belum membuat aplikasi iOS di Firebase Console. Jika sudah, langkah-langkah Anda akan sedikit berbeda.

Langkah Pengaturan

1. Buka project overview Anda di console.cloud.google.com

   

2. Klik tombol Add app

   

   Note

   Ada kemungkinan Anda harus mencari tombol ini di sini. Ini hanya berlaku jika Anda telah membuat aplikasi berbeda di Firebase Console.

   

3. Pilih iOS

   

4. Isi bagian pertama formulir

   1. Isi Apple bundle ID
      1. Buka Xcode di aplikasi Anda menggunakan npx cap open ios
      2. Klik dua kali pada App
      3. Pastikan Anda berada di Targets -> App
      4. Temukan Bundle Identifier Anda

         Note

         ID yang ditampilkan di sini akan berbeda dari yang akan saya gunakan untuk sisa panduan. Saya akan menggunakan app.capgo.plugin.SocialLogin untuk sisa panduan.

      5. Salin Bundle Identifier dan tempelkan di Firebase console
   2. Klik tombol Register app

5. Lewati langkah Download config file

   

6. Lewati langkah Add firebase SDK

   

7. Lewati langkah Add initialization code

   

8. Klik tombol Continue to console

   

9. Dapatkan iOS client ID dan YOUR_DOT_REVERSED_IOS_CLIENT_ID Anda

   1. Buka Google Cloud Console di console.cloud.google.com

   2. Temukan proyek Anda

      1. Klik pada pemilih proyek
      2. Cari proyek Anda dengan nama persis dari proyek Firebase Anda dan klik di atasnya. Dalam kasus saya, ini adalah sociallogin-tutorial-app.

   3. Buka search bar dan buka credentials

      1. Buka search bar
      2. Cari credentials dan klik yang APIs and Services (nomor 2 pada screenshot)

   4. Klik pada iOS client for [YOUR_APP_ID] (auto created by Google Service). Dalam kasus saya, ini adalah sociallogin-tutorial-app.

      

   5. Salin Client ID serta iOS URL scheme. Ini akan masing-masing menjadi iOSClientId dan YOUR_DOT_REVERSED_IOS_CLIENT_ID Anda.

      Note

      Anda akan melewatkan iOSClientId dalam metode initialize plugin, sementara Anda akan menggunakan YOUR_DOT_REVERSED_IOS_CLIENT_ID dalam file Info.plist aplikasi Anda, seperti dijelaskan di bagian selanjutnya dari panduan ini.

      

10. Dapatkan web client ID Anda

    1. Kembali ke Firebase console dan buka Build -> Authentication
    2. Klik tombol Sign-in method
    3. Klik provider Google
    4. Klik tombol Web SDK configuration
    5. Salin Web client ID. Ini akan menjadi webClientId Anda dalam metode initialize plugin.

11. Modifikasi Info.plist aplikasi Anda

    1. Buka Xcode dan temukan file Info.plist

       

    2. Klik kanan file ini dan buka sebagai source code

       

    3. Di bagian bawah file Plist Anda, Anda akan melihat tag </dict>

       

    4. Masukkan fragmen berikut tepat sebelum tag </dict> penutup

       

       <key>CFBundleURLTypes</key>
       <array>
       <dict>
         <key>CFBundleURLSchemes</key>
         <array>
           <string>YOUR_DOT_REVERSED_IOS_CLIENT_ID</string>
         </array>
       </dict>
       </array>
       <key>GIDClientID</key>
       <string>YOUR_IOS_CLIENT_ID.apps.googleusercontent.com</string>

    5. Ubah YOUR_DOT_REVERSED_IOS_CLIENT_ID ke nilai yang disalin di langkah 9 (iOS URL scheme)

       

       Caution

       Pastikan bahwa nilai ini DIMULAI dengan com.googleusercontent.apps

12. Ubah YOUR_IOS_CLIENT_ID ke iOS Client ID yang Anda salin di langkah 9

13. Simpan file dengan Command + S

14. Modifikasi AppDelegate.swift

    1. Buka AppDelegate

       

    2. Masukkan import GoogleSignIn di bagian atas file

       

    3. Temukan fungsi func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey: Any] = [:])

       

    4. Modifikasi fungsi agar terlihat seperti ini

       func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey: Any] = [:]) -> Bool {
           // Called when the app was launched with a url. Feel free to add additional processing here,
           // but if you want the App API to support tracking app url opens, make sure to keep this call
       
           var handled: Bool
       
           handled = GIDSignIn.sharedInstance.handle(url)
           if handled {
             return true
           }
       
           return ApplicationDelegateProxy.shared.application(app, open: url, options: options)
       }

       

    5. Simpan file dengan Command + S

15. Menggunakan login Google di aplikasi Anda

    Pada langkah ini, Anda siap menggunakan login Google di aplikasi Anda. Silakan gunakan file authUtils.ts dari aplikasi contoh untuk mengautentikasi dengan Google.

Pengguna akan secara otomatis dibuat di Firebase Auth pada sign-in pertama

Pemecahan Masalah

Jika autentikasi macet atau gagal:

• Verifikasi audience idToken cocok dengan Firebase web client ID Anda
• Periksa bahwa Google Sign-In diaktifkan di Firebase Console
• Pastikan Info.plist memiliki URL scheme dan GIDClientID yang benar
• Verifikasi iOSServerClientId cocok dengan web client ID Anda
• Tinjau kode aplikasi contoh sebagai referensi