Firebase Google Login auf iOS

Einführung

Dieser Leitfaden hilft Ihnen dabei, Google Sign-In mit Firebase Authentication auf iOS zu integrieren. Ich gehe davon aus, dass Sie die allgemeine Firebase Google Einrichtung bereits abgeschlossen haben.

Note

Ich gehe davon aus, dass Sie Ihre iOS-App noch nicht in der Firebase Console erstellt haben. Wenn Sie dies bereits getan haben, werden Ihre Schritte leicht abweichen.

Einrichtungsschritte

1. Gehen Sie zu Ihrer Projektübersicht unter console.cloud.google.com

   

2. Klicken Sie auf die Add app Schaltfläche

   

   Note

   Es ist möglich, dass Sie hier nach dieser Schaltfläche suchen müssen. Dies gilt nur, wenn Sie bereits eine andere App in der Firebase Console erstellt haben.

   

3. Wählen Sie iOS

   

4. Füllen Sie den ersten Teil des Formulars aus

   1. Füllen Sie die Apple bundle ID aus
      1. Öffnen Sie Xcode bei Ihrer App mit npx cap open ios
      2. Doppelklicken Sie auf App
      3. Stellen Sie sicher, dass Sie sich bei Targets -> App befinden
      4. Finden Sie Ihre Bundle Identifier

         Note

         Die hier gezeigte ID wird sich von der unterscheiden, die ich für den Rest des Leitfadens verwenden werde. Ich werde app.capgo.plugin.SocialLogin für den Rest des Leitfadens verwenden.

      5. Kopieren Sie die Bundle Identifier und fügen Sie sie in der Firebase Console ein
   2. Klicken Sie auf die Register app Schaltfläche

5. Überspringen Sie den Schritt Download config file

   

6. Überspringen Sie den Schritt Add firebase SDK

   

7. Überspringen Sie den Schritt Add initialization code

   

8. Klicken Sie auf die Continue to console Schaltfläche

   

9. Holen Sie sich Ihre iOS-Client-ID und Ihre YOUR_DOT_REVERSED_IOS_CLIENT_ID

   1. Gehen Sie zur Google Cloud Console unter console.cloud.google.com

   2. Finden Sie Ihr Projekt

      1. Klicken Sie auf die Projektauswahl
      2. Suchen Sie Ihr Projekt nach dem genauen Namen Ihres Firebase-Projekts und klicken Sie darauf. In meinem Fall ist es sociallogin-tutorial-app.

   3. Öffnen Sie die Suchleiste und öffnen Sie credentials

      1. Öffnen Sie die Suchleiste
      2. Suchen Sie nach credentials und klicken Sie auf die APIs and Services Option (Nummer 2 auf dem Screenshot)

   4. Klicken Sie auf iOS client for [YOUR_APP_ID] (auto created by Google Service). In meinem Fall ist es sociallogin-tutorial-app.

      

   5. Kopieren Sie die Client ID sowie das iOS URL scheme. Dies werden jeweils Ihre iOSClientId und YOUR_DOT_REVERSED_IOS_CLIENT_ID sein.

      Note

      Sie werden die iOSClientId in der initialize Methode des Plugins übergeben, während Sie die YOUR_DOT_REVERSED_IOS_CLIENT_ID in der Info.plist Datei Ihrer App verwenden werden, wie im nächsten Teil dieses Leitfadens erklärt.

      

10. Holen Sie sich Ihre Web-Client-ID

    1. Gehen Sie zurück zur Firebase Console und gehen Sie zu Build -> Authentication
    2. Klicken Sie auf die Sign-in method Schaltfläche
    3. Klicken Sie auf den Google Anbieter
    4. Klicken Sie auf die Web SDK configuration Schaltfläche
    5. Kopieren Sie die Web client ID. Dies wird Ihre webClientId in der initialize Methode des Plugins sein.

11. Ändern Sie die Info.plist Ihrer App

    1. Öffnen Sie Xcode und finden Sie die Info.plist Datei

       

    2. Rechtsklicken Sie auf diese Datei und öffnen Sie sie als Quellcode

       

    3. Am Ende Ihrer Plist Datei sehen Sie ein </dict> Tag

       

    4. Fügen Sie das folgende Fragment direkt vor dem schließenden </dict> Tag ein

       

       <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. Ändern Sie die YOUR_DOT_REVERSED_IOS_CLIENT_ID in den in Schritt 9 kopierten Wert (das iOS URL-Schema)

       

       Caution

       Stellen Sie sicher, dass dieser Wert MIT com.googleusercontent.apps BEGINNT

12. Ändern Sie die YOUR_IOS_CLIENT_ID in die iOS-Client-ID, die Sie in Schritt 9 kopiert haben

13. Speichern Sie die Datei mit Command + S

14. Ändern Sie die AppDelegate.swift

    1. Öffnen Sie das AppDelegate

       

    2. Fügen Sie import GoogleSignIn am Anfang der Datei ein

       

    3. Finden Sie die func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey: Any] = [:]) Funktion

       

    4. Ändern Sie die Funktion so, dass sie folgendermaßen aussieht

       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. Speichern Sie die Datei mit Command + S

15. Verwendung des Google-Logins in Ihrer App

    An diesem Punkt sind Sie bereit, den Google-Login in Ihrer App zu verwenden. Bitte verwenden Sie die authUtils.ts Datei der Beispiel-App zur Authentifizierung mit Google.

Der Benutzer wird bei der ersten Anmeldung automatisch in Firebase Auth erstellt

Fehlerbehebung

Wenn die Authentifizierung hängt oder fehlschlägt:

• Überprüfen Sie, dass die idToken Zielgruppe mit Ihrer Firebase Web-Client-ID übereinstimmt
• Prüfen Sie, dass Google Sign-In in der Firebase Console aktiviert ist
• Stellen Sie sicher, dass die Info.plist die korrekten URL-Schemas und GIDClientID hat
• Überprüfen Sie, dass iOSServerClientId mit Ihrer Web-Client-ID übereinstimmt
• Überprüfen Sie den Beispiel-App-Code als Referenz