Join us in person and online for Firebase Summit on October 18, 2022. Learn how Firebase can help you accelerate app development, release your app with confidence, and scale with ease. Register now

Identité fédérée et connexion sociale

Restez organisé à l'aide des collections Enregistrez et classez les contenus selon vos préférences.

L'authentification sociale est un flux d'authentification en plusieurs étapes, vous permettant de connecter un utilisateur à un compte ou de le lier à un compte existant.

Les plates-formes natives et le Web prennent en charge la création d'informations d'identification qui peuvent ensuite être transmises aux méthodes signInWithCredential ou linkWithCredential . Alternativement, sur les plateformes Web, vous pouvez déclencher le processus d'authentification via une fenêtre contextuelle ou une redirection.

Google

La plupart des configurations sont déjà configurées lors de l'utilisation de Google Sign-In avec Firebase, mais vous devez vous assurer que la clé SHA1 de votre machine a été configurée pour une utilisation avec Android. Vous pouvez voir comment générer la clé sur la documentation d'authentification .

Assurez-vous que le fournisseur de connexion "Google" est activé sur la console Firebase .

Si votre utilisateur se connecte avec Google, après avoir déjà enregistré manuellement un compte, son fournisseur d'authentification passera automatiquement à Google, en raison du concept Firebase Authentications de fournisseurs de confiance. Vous pouvez en savoir plus à ce sujet ici .

iOS+ et Androïd

Sur les plates-formes natives, une bibliothèque tierce est requise pour déclencher le flux d'authentification.

Installez le plug-in officiel google_sign_in .

Une fois installé, déclenchez le flux de connexion et créez un nouvel identifiant :

import 'package:google_sign_in/google_sign_in.dart';

Future<UserCredential> signInWithGoogle() async {
  // Trigger the authentication flow
  final GoogleSignInAccount? googleUser = await GoogleSignIn().signIn();

  // Obtain the auth details from the request
  final GoogleSignInAuthentication? googleAuth = await googleUser?.authentication;

  // Create a new credential
  final credential = GoogleAuthProvider.credential(
    accessToken: googleAuth?.accessToken,
    idToken: googleAuth?.idToken,
  );

  // Once signed in, return the UserCredential
  return await FirebaseAuth.instance.signInWithCredential(credential);
}

la toile

Sur le Web, le SDK Firebase prend en charge la gestion automatique du flux d'authentification à l'aide de votre projet Firebase. Par exemple:

Créez un fournisseur d'authentification Google, en fournissant toute étendue d'autorisation supplémentaire que vous souhaitez obtenir de l'utilisateur :

GoogleAuthProvider googleProvider = GoogleAuthProvider();

googleProvider.addScope('https://www.googleapis.com/auth/contacts.readonly');
googleProvider.setCustomParameters({
  'login_hint': 'user@example.com'
});

Fournissez les informations d'identification à la méthode signInWithPopup . Cela déclenchera l'apparition d'une nouvelle fenêtre invitant l'utilisateur à se connecter à votre projet. Vous pouvez également utiliser signInWithRedirect pour conserver le processus d'authentification dans la même fenêtre.

Future<UserCredential> signInWithGoogle() async {
  // Create a new provider
  GoogleAuthProvider googleProvider = GoogleAuthProvider();

  googleProvider.addScope('https://www.googleapis.com/auth/contacts.readonly');
  googleProvider.setCustomParameters({
    'login_hint': 'user@example.com'
  });

  // Once signed in, return the UserCredential
  return await FirebaseAuth.instance.signInWithPopup(googleProvider);

  // Or use signInWithRedirect
  // return await FirebaseAuth.instance.signInWithRedirect(googleProvider);
}

Facebook

Avant de commencer, configurez votre application de développement Facebook et suivez le processus de configuration pour activer la connexion Facebook.

Assurez-vous que le fournisseur de connexion "Facebook" est activé sur la console Firebase . avec l'identifiant d'application Facebook et l'ensemble secret.

iOS+ et Androïd

Sur les plates-formes natives, une bibliothèque tierce est requise pour installer le SDK Facebook et déclencher le flux d'authentification.

Installez le plugin flutter_facebook_auth .

Vous devrez suivre les étapes de la documentation du plug-in pour vous assurer que les SDK Facebook Android et iOS ont été initialisés correctement. Une fois terminé, déclenchez le flux de connexion, créez un identifiant Facebook et connectez l'utilisateur :

import 'package:flutter_facebook_auth/flutter_facebook_auth.dart';

Future<UserCredential> signInWithFacebook() async {
  // Trigger the sign-in flow
  final LoginResult loginResult = await FacebookAuth.instance.login();

  // Create a credential from the access token
  final OAuthCredential facebookAuthCredential = FacebookAuthProvider.credential(loginResult.accessToken.token);

  // Once signed in, return the UserCredential
  return FirebaseAuth.instance.signInWithCredential(facebookAuthCredential);
}

la toile

Sur le Web, le SDK Firebase prend en charge la gestion automatique du flux d'authentification à l'aide des détails de l'application Facebook fournis sur la console Firebase. Par exemple:

Créez un fournisseur Facebook, en fournissant toute étendue d'autorisation supplémentaire que vous souhaitez obtenir de l'utilisateur.

Assurez-vous que l'URI de redirection OAuth de la console Firebase est ajouté en tant qu'URI de redirection OAuth valide dans votre application Facebook.

FacebookAuthProvider facebookProvider = FacebookAuthProvider();

facebookProvider.addScope('email');
facebookProvider.setCustomParameters({
  'display': 'popup',
});

Fournissez les informations d'identification à la méthode signInWithPopup . Cela déclenchera l'apparition d'une nouvelle fenêtre invitant l'utilisateur à se connecter à votre application Facebook :

Future<UserCredential> signInWithFacebook() async {
  // Create a new provider
  FacebookAuthProvider facebookProvider = FacebookAuthProvider();

  facebookProvider.addScope('email');
  facebookProvider.setCustomParameters({
    'display': 'popup',
  });

  // Once signed in, return the UserCredential
  return await FirebaseAuth.instance.signInWithPopup(facebookProvider);

  // Or use signInWithRedirect
  // return await FirebaseAuth.instance.signInWithRedirect(facebookProvider);
}

Pomme

iOS+

Avant de commencer, configurez Se connecter avec Apple et activez Apple en tant que fournisseur de connexion .

Ensuite, assurez-vous que vos applications Runner disposent de la fonctionnalité "Connexion avec Apple".

Android

Avant de commencer, configurez Se connecter avec Apple et activez Apple en tant que fournisseur de connexion .

la toile

Avant de commencer, configurez Se connecter avec Apple et activez Apple en tant que fournisseur de connexion .

import 'package:firebase_auth/firebase_auth.dart';

Future<UserCredential> signInWithApple() async {
  final appleProvider = AppleAuthProvider();
  if (kIsWeb) {
    await _auth.signInWithPopup(appleProvider);
  } else {
    await _auth.signInWithAuthProvider(appleProvider);
  }
}

Microsoft

iOS+

Avant de commencer , configurez Microsoft Login pour iOS et ajoutez les schémas d'URL personnalisés à votre Runner (étape 1) .

Android

Avant de commencer , configurez Microsoft Login pour Android .

N'oubliez pas d'ajouter l'empreinte SHA-1 de votre application.

la toile

Avant de commencer , configurez Microsoft Login for Web .

import 'package:firebase_auth/firebase_auth.dart';

Future<UserCredential> signInWithMicrosoft() async {
  final microsoftProvider = MicrosoftAuthProvider();
  if (kIsWeb) {
    await _auth.signInWithPopup(microsoftProvider);
  } else {
    await _auth.signInWithAuthProvider(microsoftProvider);
  }
}

Twitter

Assurez-vous que le fournisseur de connexion "Twitter" est activé sur la console Firebase avec un jeu de clé API et de secret API.

iOS+ et Androïd

Sur les plates-formes natives, une bibliothèque tierce est requise pour installer le SDK Twitter et déclencher le flux d'authentification.

Installez le plug-in twitter_login :

dependencies:
  twitter_login: ^4.0.1

Assurez-vous de suivre attentivement les étapes de configuration de twitter_login et d'enregistrer une URL de rappel sur le portail des développeurs Twitter avec un schéma d'URL correspondant.

import 'package:twitter_login/twitter_login.dart';

Future<UserCredential> signInWithTwitter() async {
  // Create a TwitterLogin instance
  final twitterLogin = new TwitterLogin(
    apiKey: '<your consumer key>',
    apiSecretKey:' <your consumer secret>',
    redirectURI: '<your_scheme>://'
  );

  // Trigger the sign-in flow
  final authResult = await twitterLogin.login();

  // Create a credential from the access token
  final twitterAuthCredential = TwitterAuthProvider.credential(
    accessToken: authResult.authToken!,
    secret: authResult.authTokenSecret!,
  );

  // Once signed in, return the UserCredential
  return await FirebaseAuth.instance.signInWithCredential(twitterAuthCredential);
}

la toile

Sur le Web, le SDK Twitter prend en charge la gestion automatique du flux d'authentification à l'aide des détails de l'application Twitter fournis sur la console Firebase. Assurez-vous que l'URL de rappel dans la console Firebase est ajoutée en tant qu'URL de rappel dans votre application Twitter sur leur console développeur.

Par exemple:

Créez un fournisseur Twitter et fournissez les informations d'identification à la méthode signInWithPopup . Cela déclenchera l'apparition d'une nouvelle fenêtre invitant l'utilisateur à se connecter à votre application Twitter :

Future<UserCredential> signInWithTwitter() async {
  // Create a new provider
  TwitterAuthProvider twitterProvider = TwitterAuthProvider();

  // Once signed in, return the UserCredential
  return await FirebaseAuth.instance.signInWithPopup(twitterProvider);

  // Or use signInWithRedirect
  // return await FirebaseAuth.instance.signInWithRedirect(twitterProvider);
}

GitHub

Assurez-vous que vous avez configuré une application OAuth à partir de vos paramètres de développeur GitHub et que le fournisseur de connexion "GitHub" est activé sur la console Firebase avec l'ID client et le secret définis, avec l'URL de rappel définie dans l'application GitHub.

iOS+ et Androïd

Pour les plates-formes natives, vous devez ajouter google-services.json et GoogleService-Info.plist .

Pour iOS, ajoutez le schéma d'URL personnalisé comme décrit à l'étape 1 du guide iOS .

Future<UserCredential> signInWithGitHub() async {
  // Create a new provider
  GithubAuthProvider githubProvider = GithubAuthProvider();

  return await _auth.signInWithAuthProvider(githubProvider);
}

la toile

Sur le Web, le SDK GitHub prend en charge la gestion automatique du flux d'authentification à l'aide des détails de l'application GitHub fournis sur la console Firebase. Assurez-vous que l'URL de rappel dans la console Firebase est ajoutée en tant qu'URL de rappel dans votre application GitHub sur la console développeur.

Par exemple:

Créez un fournisseur GitHub et fournissez les informations d'identification à la méthode signInWithPopup . Cela déclenchera l'apparition d'une nouvelle fenêtre invitant l'utilisateur à se connecter à votre application GitHub :

Future<UserCredential> signInWithGitHub() async {
  // Create a new provider
  GithubAuthProvider githubProvider = GithubAuthProvider();

  // Once signed in, return the UserCredential
  return await FirebaseAuth.instance.signInWithPopup(githubProvider);

  // Or use signInWithRedirect
  // return await FirebaseAuth.instance.signInWithRedirect(githubProvider);
}