Identité fédérée et connexion aux réseaux sociaux

L'authentification par réseau social est un processus d'authentification en plusieurs étapes qui vous permet de connecter un utilisateur à un compte ou de l'associer à un compte existant.

Les plates-formes natives et le Web permettent de créer des identifiants qui peuvent ensuite être transmis aux méthodes signInWithCredential ou linkWithCredential. Sur les plates-formes Web, vous pouvez également déclencher le processus d'authentification via un pop-up ou une redirection.

Google

La plupart des configurations sont déjà configurées lorsque vous utilisez la connexion Google avec Firebase. Toutefois, vous devez vous assurer que la clé SHA1 de votre machine a été configurée pour être utilisée avec Android. Pour savoir comment générer la clé, consultez la documentation sur l'authentification.

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

Si votre utilisateur se connecte avec Google après avoir déjà enregistré manuellement un compte, son fournisseur d'authentification sera automatiquement remplacé par Google, en raison du concept de fournisseurs approuvés de Firebase Authentication. Pour en savoir plus, cliquez ici.

iOS et Android

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 l'extension installée, déclenchez le flux de connexion et créez des identifiants:

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);
}

Web

Sur le Web, le SDK Firebase permet de gérer automatiquement le flux d'authentification à l'aide de votre projet Firebase. Exemple :

Créez un fournisseur d'authentification Google, en fournissant tout champ d'application 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 identifiants à la méthode signInWithPopup. Une nouvelle fenêtre s'affiche alors, 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);
}

Google Play Jeux (Android uniquement)

Assurez-vous que le fournisseur de connexion "Play Jeux" est activé dans la console Firebase. Suivez ces instructions pour configurer un projet Firebase Play Jeux.

Suivez ces instructions pour configurer les services de jeux Play avec votre application Firebase.

Android

Future<void> _signInWithPlayGames() async {
  // Get server auth code from 3rd party provider
  // See PR description for details on how you might get the server auth code:
  // https://github.com/firebase/flutterfire/pull/12201#issue-2100392487
  final serverAuthCode = '...';
  final playGamesCredential = PlayGamesAuthProvider.credential(
                                          serverAuthCode: serverAuthCode);

  await FirebaseAuth.instance
    .signInWithCredential(playGamesCredential);
}

Facebook

Avant de commencer, configurez votre application de développeur Facebook et suivez la procédure de configuration pour activer la connexion Facebook.

Assurez-vous que le fournisseur de connexion "Facebook" est activé dans la console Firebase, avec l'ID et le secret d'application Facebook définis.

iOS et Android

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

Installez le plug-in flutter_facebook_auth.

Vous devrez suivre les étapes décrites dans la documentation du plug-in pour vous assurer que les SDK Facebook Android et iOS ont été correctement initialisés. Une fois cette opération terminée, déclenchez le flux de connexion, créez des identifiants 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);
}

Web

Sur le Web, le SDK Firebase permet de gérer automatiquement le flux d'authentification à l'aide des informations sur l'application Facebook fournies dans la console Firebase. Exemple :

Créez un fournisseur Facebook, en fournissant tout champ d'application 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 identifiants à la méthode signInWithPopup. Une nouvelle fenêtre s'affiche alors pour inviter 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);
}

Apple

iOS+

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

Assurez-vous ensuite que vos applications Runner disposent de la fonctionnalité "Se connecter avec Apple".

Android

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

Web

Avant de commencer, configurez la connexion 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 FirebaseAuth.instance.signInWithPopup(appleProvider);
  } else {
    await FirebaseAuth.instance.signInWithProvider(appleProvider);
  }
}

Connexion à la plate-forme Apple uniquement

Vous pouvez également utiliser la méthode suivante pour vous connecter à Apple sur les plates-formes iOS et versions ultérieures:

// Implement a function that generates a nonce. See iOS documentation for how to create a nonce:
// https://firebase.google.com/docs/auth/ios/apple#sign_in_with_apple_and_authenticate_with_firebase
String rawNonce = createNonce();
// Create a SHA-256 hash of the nonce. Consider using the `crypto` package from the pub.dev registry.
String hashSHA256String = createHashSHA256String(rawNonce);
// Use the hash of the nonce to get the idToken. Consider using the `sign_in_with_apple` plugin from the pub.dev registry.
String idToken = await getIdToken();

final fullName = AppleFullPersonName(
  familyName: 'Name',
  givenName: 'Your',
);
// Use the `rawNonce` and `idToken` to get the credential
final credential = AppleAuthProvider.credentialWithIDToken(
  idToken,
  rawNonce,
  fullName,
);

await FirebaseAuth.instance.signInWithCredential(credential);

Révoquer les jetons d'authentification Apple

La connexion Apple sur les plates-formes Apple renvoie un code d'autorisation qui peut être utilisé pour révoquer le jeton d'autorisation Apple à l'aide de l'API revokeTokenWithAuthorizationCode().

import 'package:firebase_auth/firebase_auth.dart';

Future<UserCredential> signInWithApple() async {
  final appleProvider = AppleAuthProvider();

  UserCredential userCredential = await FirebaseAuth.instance.signInWithPopup(appleProvider);
  // Keep the authorization code returned from Apple platforms
  String? authCode = userCredential.additionalUserInfo?.authorizationCode;
  // Revoke Apple auth token
  await FirebaseAuth.instance.revokeTokenWithAuthorizationCode(authCode!);
}

Apple Game Center (Apple uniquement)

Assurez-vous que le fournisseur de connexion "Game Center" est activé dans la console Firebase. Suivez ces instructions pour configurer un projet Firebase Game Center.

Vous devez vous connecter avec Game Center avant qu'un identifiant Firebase Game Center puisse être émis et que vous puissiez vous connecter via Firebase. Voici quelques instructions pour y parvenir.

iOS+

Future<void> _signInWithGameCenter() async {
  final credential = GameCenterAuthProvider.credential();
  await FirebaseAuth.instance
      .signInWithCredential(credential);
}

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 la connexion Microsoft pour Android.

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

Web

Avant de commencer, configurez la connexion Microsoft pour le Web.

import 'package:firebase_auth/firebase_auth.dart';

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

Twitter

Assurez-vous que le fournisseur de connexion "Twitter" est activé dans la console Firebase avec une clé API et un secret API définis. Assurez-vous que votre URI de redirection OAuth Firebase (par exemple, my-app-12345.firebaseapp.com/__/auth/handler) est défini comme URL de rappel d'autorisation sur la page des paramètres de votre application dans la configuration de votre application Twitter.

Vous devrez peut-être également demander un accès administrateur à l'API selon votre application.

iOS+

Vous devez configurer votre schéma d'URL personnalisé comme décrit à l'étape 1 du guide iOS.

Android

Si vous n'avez pas encore spécifié l'empreinte SHA-1 de votre application, faites-le sur la page des paramètres de la console Firebase. Pour savoir comment obtenir l'empreinte SHA-1 de votre application, consultez Authentifier votre client.

Web

Prêt à l'emploi.

import 'package:firebase_auth/firebase_auth.dart';

Future<void> _signInWithTwitter() async {
  TwitterAuthProvider twitterProvider = TwitterAuthProvider();

  if (kIsWeb) {
    await FirebaseAuth.instance.signInWithPopup(twitterProvider);
  } else {
    await FirebaseAuth.instance.signInWithProvider(twitterProvider);
  }
}

GitHub

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

iOS et Android

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 FirebaseAuth.instance.signInWithProvider(githubProvider);
}

Web

Sur le Web, le SDK GitHub permet de gérer automatiquement le flux d'authentification à l'aide des informations sur l'application GitHub fournies dans 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 dans la console du développeur.

Exemple :

Créez un fournisseur GitHub et fournissez les identifiants à la méthode signInWithPopup. Une nouvelle fenêtre s'affiche alors pour inviter 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);
}

Yahoo

Assurez-vous que le fournisseur de connexion "Yahoo" est activé dans la console Firebase avec une clé API et un secret API définis. Assurez-vous également que votre URI de redirection OAuth Firebase (par exemple, my-app-12345.firebaseapp.com/__/auth/handler) est défini en tant qu'URI de redirection dans la configuration du réseau de développeurs Yahoo de votre application.

iOS+

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

Android

Avant de commencer, configurez Yahoo Login pour Android.

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

Web

Prêt à l'emploi.

import 'package:firebase_auth/firebase_auth.dart';

Future<UserCredential> signInWithYahoo() async {
  final yahooProvider = YahooAuthProvider();
  if (kIsWeb) {
    await _auth.signInWithPopup(yahooProvider);
  } else {
    await _auth.signInWithProvider(yahooProvider);
  }
}

Utiliser le jeton d'accès OAuth

En utilisant un AuthProvider, vous pouvez récupérer le jeton d'accès associé au fournisseur en effectuant la requête suivante.

final appleProvider = AppleAuthProvider();

final user = await FirebaseAuth.instance.signInWithProvider(appleProvider);
final accessToken = user.credential?.accessToken;

// You can send requests with the `accessToken`

Associer un fournisseur d'authentification

Si vous souhaitez associer un fournisseur à un utilisateur actuel, vous pouvez utiliser la méthode suivante:

await FirebaseAuth.instance.signInAnonymously();

final appleProvider = AppleAuthProvider();

if (kIsWeb) {
  await FirebaseAuth.instance.currentUser?.linkWithPopup(appleProvider);

  // You can also use `linkWithRedirect`
} else {
  await FirebaseAuth.instance.currentUser?.linkWithProvider(appleProvider);
}

// You're anonymous user is now upgraded to be able to connect with Sign In With Apple

Réauthentifier l'utilisateur auprès du fournisseur

Le même schéma peut être utilisé avec reauthenticateWithProvider, qui peut être utilisé pour récupérer des identifiants à jour pour les opérations sensibles qui nécessitent une connexion récente.

final appleProvider = AppleAuthProvider();

if (kIsWeb) {
  await FirebaseAuth.instance.currentUser?.reauthenticateWithPopup(appleProvider);

  // Or you can reauthenticate with a redirection
  // await FirebaseAuth.instance.currentUser?.reauthenticateWithRedirect(appleProvider);
} else {
  await FirebaseAuth.instance.currentUser?.reauthenticateWithProvider(appleProvider);
}

// You can now perform sensitive operations