Firebase Google Login sur iOS

Introduction

Ce guide vous aidera à intégrer l'authentification Google avec l'authentification Firebase sur iOS. Je suppose que vous avez déjà complété la configuration Firebase Google générale.

Note

Si vous n'avez pas encore créé votre application iOS dans le Console Firebase, je suppose que vous n'avez pas encore créé votre application iOS dans le Console Firebase. Si vous l'avez déjà fait, vos étapes seront légèrement différentes.

Étapes de configuration

1. Allez dans votre vue d'ensemble du projet sur console.cloud.google.com

   

2. Cliquez sur le Add app bouton

   

   Note

   Il est possible que vous deviez chercher ici pour ce bouton. Cela s'applique uniquement si vous avez déjà créé une application différente dans la Console Firebase.

   

3. Sélectionner iOS

   

4. Remplir la première partie du formulaire

   1. Remplir le Apple bundle ID
      1. Ouvrir Xcode à votre application en utilisant npx cap open ios
      2. Double-cliquer sur App
      3. Assurez-vous d'être sur Targets -> App
      4. Trouvez votre Bundle Identifier

         Note

         L'ID affiché ici diffèrera de celui que j'utiliserai pour le reste de ce guide. J'utiliserai app.capgo.plugin.SocialLogin pour le reste de ce guide.

      5. Copiez le Bundle Identifier et collez-le dans la console Firebase
   2. Cliquez sur le Register app bouton

5. Passer à côté Download config file étape

   

6. Ignorer l' Add firebase SDK étape

   

7. Ignorer l' Add initialization code étape

   

8. Cliquez sur le Continue to console bouton

   

9. Obtenez votre ID client iOS et votre YOUR_DOT_REVERSED_IOS_CLIENT_ID

   1. Allez à la console Google Cloud à console.cloud.google.com

   2. Trouvez votre projet

      1. Cliquez sur le sélecteur de projet
      2. Recherchez votre projet en utilisant le nom exact de votre projet Firebase et cliquez dessus. Dans mon cas, il s'agit de sociallogin-tutorial-app.

   3. Ouvrez la barre de recherche et ouvrez credentials

      1. Ouvrez la barre de recherche
      2. Recherchez credentials et cliquez dessus APIs and Services un (le numéro 2 sur l'écran d'affichage)

   4. Cliquez sur le iOS client for [YOUR_APP_ID] (auto created by Google Service) un. Dans mon cas, c'est sociallogin-tutorial-app.

      

   5. Copiez le Client ID ainsi que le iOS URL schemeCela sera respectivement votre iOSClientId et YOUR_DOT_REVERSED_IOS_CLIENT_ID.

      Note

      Vous passerez iOSClientId dans la méthode du plugin, tandis que vous utiliserez le initialize dans le fichier de votre application, comme expliqué dans la partie suivante de ce guide. YOUR_DOT_REVERSED_IOS_CLIENT_ID Google Cloud Console Identifiants de l'application iOS Client ID Copier Info.plist Obtenez votre identifiant de client web

      

10. Menu d'authentification Firebase

    1. Cliquez sur le Build -> Authentication
    2. Bouton de méthode d'authentification Firebase Sign-in method Cliquez sur le
    3. Bouton Google fournisseur
    4. Cliquez sur le Web SDK configuration bouton
    5. Copiez le Web client ID. Cela sera votre webClientId dans le initialize méthode de l'extension.

11. Modifiez les informations de votre application Info.plist

    1. Ouvrez Xcode et trouvez le Info.plist fichier

       

    2. Cliquez avec le bouton droit sur ce fichier et ouvrez-le en tant que source code

       

    3. À la fin de votre Plist fichier, vous verrez un </dict> tag

       

    4. Insérez le fragment suivant juste avant la balise de fin de dictionnaire </dict> Fichier Info.plist avec les schémas de URL __CAPGO_KEEP_0__ insérés avant la balise de fin de dictionnaire

       

       <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. Changez la YOUR_DOT_REVERSED_IOS_CLIENT_ID par la valeur copiée à l'étape 9 (le schéma URL iOS)

       

       Attention

       Assurez-vous que cette valeur COMMENCE par com.googleusercontent.apps

12. Changez la YOUR_IOS_CLIENT_ID par le Client ID iOS que vous avez copié à l'étape 9

13. Enregistrez le fichier avec Command + S

14. Modifiez le AppDelegate.swift

    1. Ouvrez le AppDelegate

       

    2. Insérer import GoogleSignIn en haut du fichier

       

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

       

    4. Modifiez la fonction pour qu'elle ressemble à ceci

       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. Enregistrer le fichier avec Command + S

15. Utilisez le login Google dans votre application

    À ce stade, vous êtes prêt à utiliser le login Google dans votre application. Veuillez utiliser le fichier authUtils.ts du exemple d'application pour vous authentifier avec Google.

Le compte utilisateur sera créé automatiquement dans Firebase Auth lors du premier connexion

Résolution des problèmes

Si l'authentification est bloquée ou échoue :

• Vérifiez que idToken correspond à l'ID client Firebase web
• Vérifiez que Google Sign-In est activé dans Firebase Console
• Assurez-vous que Info.plist a les schémas URL corrects et GIDClientID
• Vérifiez iOSServerClientId correspond à votre ID client web
• Révisez l'application d'exemple __CAPGO_KEEP_0__ example app code Continuez depuis Firebase Google Login sur iOS

Section intitulée “Continuez depuis Firebase Google Login sur iOS”

Firebase Google Login sur iOS pour planifier l'authentification et les flux de compte, connectez-le avec En utilisant @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-social-login pour la capacité native dans En utilisant @capgo/capacitor-social-login, pour la capacité native dans En utilisant @capgo/capacitor-social-login @capgo/capacitor-social-login pour les détails d'implémentation dans @capgo/capacitor-social-login, @capgo/capacitor-passkey pour les détails d'implémentation dans @capgo/capacitor-passkey, @capgo/capacitor-native-biometric pour les détails d'implémentation dans @capgo/capacitor-native-biometric, et Authentification à deux facteurs pour les détails d'implémentation dans Authentification à deux facteurs.