Identidad federada e inicio de sesión social

La autenticación social es un flujo de autenticación de varios pasos que le permite iniciar sesión con un usuario en una cuenta o vincularlo con una existente.

Tanto las plataformas nativas como la web admiten la creación de una credencial que luego se puede pasar a los métodos signInWithCredential o linkWithCredential . Alternativamente, en las plataformas web, puede activar el proceso de autenticación a través de una ventana emergente o una redirección.

Google

La mayor parte de la configuración ya está configurada cuando usa el inicio de sesión de Google con Firebase, sin embargo, debe asegurarse de que la clave SHA1 de su máquina se haya configurado para usar con Android. Puede ver cómo generar la clave en la documentación de instalación .

Asegúrese de que el proveedor de inicio de sesión de "Google" esté habilitado en Firebase Console .

Si su usuario inicia sesión con Google, después de haber registrado manualmente una cuenta, su proveedor de autenticación cambiará automáticamente a Google, debido al concepto de Firebase Authentications de proveedores confiables. Puede obtener más información sobre esto aquí .

iOS+ y Android

En plataformas nativas, se requiere una biblioteca de terceros para activar el flujo de autenticación.

Instale el complemento oficial de google_sign_in .

Una vez instalado, active el flujo de inicio de sesión y cree una nueva credencial:

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

En la web, el SDK de Firebase brinda soporte para manejar automáticamente el flujo de autenticación usando su proyecto de Firebase. Por ejemplo:

Cree un proveedor de autenticación de Google, proporcionando cualquier ámbito de permiso adicional que desee obtener del usuario:

GoogleAuthProvider googleProvider = GoogleAuthProvider();

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

Proporcione la credencial al método signInWithPopup . Esto hará que aparezca una nueva ventana que le pedirá al usuario que inicie sesión en su proyecto. Alternativamente, puede usar signInWithRedirect para mantener el proceso de autenticación en la misma ventana.

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

Antes de comenzar, configure su aplicación de desarrollador de Facebook y siga el proceso de configuración para habilitar el inicio de sesión de Facebook.

Asegúrese de que el proveedor de inicio de sesión de "Facebook" esté habilitado en Firebase Console . con el conjunto de ID y secreto de la aplicación de Facebook.

iOS+ y Android

En las plataformas nativas, se requiere una biblioteca de terceros para instalar el SDK de Facebook y activar el flujo de autenticación.

Instale el complemento flutter_facebook_auth .

Deberá seguir los pasos en la documentación del complemento para asegurarse de que los SDK de Facebook de Android e iOS se hayan inicializado correctamente. Una vez completado, active el flujo de inicio de sesión, cree una credencial de Facebook e inicie sesión con el usuario:

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

En la web, el SDK de Firebase brinda soporte para manejar automáticamente el flujo de autenticación usando los detalles de la aplicación de Facebook proporcionados en la consola de Firebase. Por ejemplo:

Cree un proveedor de Facebook, proporcionando cualquier ámbito de permiso adicional que desee obtener del usuario.

Asegúrese de que el URI de redireccionamiento de OAuth de Firebase console se agregue como un URI de redireccionamiento de OAuth válido en su aplicación de Facebook.

FacebookAuthProvider facebookProvider = FacebookAuthProvider();

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

Proporcione la credencial al método signInWithPopup . Esto hará que aparezca una nueva ventana que le pedirá al usuario que inicie sesión en su aplicación de 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);
}

Manzana

iOS+ y Android

Antes de comenzar, configure Iniciar sesión con Apple y habilite Apple como proveedor de inicio de sesión .

A continuación, asegúrese de que sus aplicaciones Runner tengan la función "Iniciar sesión con Apple".

Instale el complemento sign_in_with_apple , así como el paquete crypto :

dependencies:
  sign_in_with_apple: ^3.0.0
  crypto: ^3.0.1
import 'dart:convert';
import 'dart:math';

import 'package:crypto/crypto.dart';
import 'package:firebase_auth/firebase_auth.dart';
import 'package:sign_in_with_apple/sign_in_with_apple.dart';

/// Generates a cryptographically secure random nonce, to be included in a
/// credential request.
String generateNonce([int length = 32]) {
  const charset =
      '0123456789ABCDEFGHIJKLMNOPQRSTUVXYZabcdefghijklmnopqrstuvwxyz-._';
  final random = Random.secure();
  return List.generate(length, (_) => charset[random.nextInt(charset.length)])
      .join();
}

/// Returns the sha256 hash of [input] in hex notation.
String sha256ofString(String input) {
  final bytes = utf8.encode(input);
  final digest = sha256.convert(bytes);
  return digest.toString();
}

Future<UserCredential> signInWithApple() async {
  // To prevent replay attacks with the credential returned from Apple, we
  // include a nonce in the credential request. When signing in with
  // Firebase, the nonce in the id token returned by Apple, is expected to
  // match the sha256 hash of `rawNonce`.
  final rawNonce = generateNonce();
  final nonce = sha256ofString(rawNonce);

  // Request credential for the currently signed in Apple account.
  final appleCredential = await SignInWithApple.getAppleIDCredential(
    scopes: [
      AppleIDAuthorizationScopes.email,
      AppleIDAuthorizationScopes.fullName,
    ],
    nonce: nonce,
  );

  // Create an `OAuthCredential` from the credential returned by Apple.
  final oauthCredential = OAuthProvider("apple.com").credential(
    idToken: appleCredential.identityToken,
    rawNonce: rawNonce,
  );

  // Sign in the user with Firebase. If the nonce we generated earlier does
  // not match the nonce in `appleCredential.identityToken`, sign in will fail.
  return await FirebaseAuth.instance.signInWithCredential(oauthCredential);
}

Web

Antes de comenzar, configure Iniciar sesión con Apple y habilite Apple como proveedor de inicio de sesión .

import 'package:firebase_auth/firebase_auth.dart';

Future<UserCredential> signInWithApple() async {
  // Create and configure an OAuthProvider for Sign In with Apple.
  final provider = OAuthProvider("apple.com")
    ..addScope('email')
    ..addScope('name');

  // Sign in the user with Firebase.
  return await FirebaseAuth.instance.signInWithPopup(provider);
}

Una alternativa es usar signInWithRedirect . En ese caso, el navegador se alejará de su aplicación y deberá usar getRedirectResult para verificar los resultados de la autenticación durante el inicio de la aplicación.

Gorjeo

Asegúrese de que el proveedor de inicio de sesión de "Twitter" esté habilitado en Firebase Console con una clave de API y un secreto de API establecidos.

iOS+ y Android

En las plataformas nativas, se requiere una biblioteca de terceros para instalar el SDK de Twitter y activar el flujo de autenticación.

Instale el complemento twitter_login :

dependencies:
  twitter_login: ^4.0.1

Asegúrese de seguir cuidadosamente los pasos de configuración de twitter_login y registrar una URL de devolución de llamada en el Portal para desarrolladores de Twitter con un esquema de URL coincidente.

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

Web

En la web, el SDK de Twitter brinda soporte para manejar automáticamente el flujo de autenticación utilizando los detalles de la aplicación de Twitter proporcionados en la consola de Firebase. Asegúrese de que la URL de devolución de llamada en la consola de Firebase se agregue como una URL de devolución de llamada en su aplicación de Twitter en su consola de desarrollador.

Por ejemplo:

Cree un proveedor de Twitter y proporcione la credencial al método signInWithPopup . Esto hará que aparezca una nueva ventana que le pedirá al usuario que inicie sesión en su aplicación de 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

Asegúrese de haber configurado una aplicación OAuth desde su configuración de desarrollador de GitHub y que el proveedor de inicio de sesión "GitHub" esté habilitado en Firebase Console con el ID de cliente y el secreto configurados, con la URL de devolución de llamada configurada en la aplicación GitHub.

iOS+ y Android

En las plataformas nativas, se requiere una biblioteca de terceros para instalar el SDK de GitHub y activar el flujo de autenticación.

Instale el complemento github_sign_in :

dependencies:
  github_sign_in: ^0.0.5-dev.4

Deberá completar la instancia de GitHubSignIn con su ID de cliente de GitHub, el secreto de cliente de GitHub y también una URL de redirección (URL de devolución de llamada de Firebase). Una vez que se haya completado, active el flujo de inicio de sesión, cree una credencial de GitHub e inicie sesión con el usuario:

import 'package:github_sign_in/github_sign_in.dart';

Future<UserCredential> signInWithGitHub() async {
  // Create a GitHubSignIn instance
      final GitHubSignIn gitHubSignIn = GitHubSignIn(
          clientId: clientId,
          clientSecret: clientSecret,
          redirectUrl: 'https://my-project.firebaseapp.com/__/auth/handler');

  // Trigger the sign-in flow
  final result = await gitHubSignIn.signIn(context);

  // Create a credential from the access token
  final githubAuthCredential = GithubAuthProvider.credential(result.token);

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

Web

En la web, el SDK de GitHub brinda soporte para manejar automáticamente el flujo de autenticación mediante los detalles de la aplicación de GitHub proporcionados en la consola de Firebase. Asegúrese de que la URL de devolución de llamada en la consola de Firebase se agregue como una URL de devolución de llamada en su aplicación de GitHub en la consola del desarrollador.

Por ejemplo:

Cree un proveedor de GitHub y proporcione la credencial al método signInWithPopup . Esto hará que aparezca una nueva ventana que le pedirá al usuario que inicie sesión en su aplicación de 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);
}