Föderierte Identität & Anmeldung über soziale Netzwerke

Die Authentifizierung über soziale Netzwerke ist ein mehrstufiger Authentifizierungsvorgang, mit dem Sie einen Nutzer in einem Konto anmelden oder mit einem vorhandenen Konto verknüpfen können.

Sowohl native Plattformen als auch das Web unterstützen das Erstellen von Anmeldedaten, die dann an die Methoden signInWithCredential oder linkWithCredential übergeben werden können. Alternativ können Sie auf Webplattformen den Authentifizierungsprozess über ein Pop-up oder eine Weiterleitung auslösen.

Google

Bei der Verwendung von Google Sign-in mit Firebase ist die meisten Konfiguration bereits eingerichtet. Sie müssen jedoch dafür sorgen, dass der SHA1-Schlüssel Ihres Computers für die Verwendung mit Android konfiguriert ist. Eine Anleitung zum Generieren des Schlüssels finden Sie in der Authentifizierungsdokumentation.

Prüfen Sie, ob der Anmeldeanbieter „Google“ in der Firebase Console aktiviert ist.

Wenn sich ein Nutzer mit Google anmeldet, nachdem er bereits manuell ein Konto registriert hat, ändert sich sein Authentifizierungsanbieter aufgrund des Konzepts vertrauenswürdiger Anbieter der Firebase-Authentifizierung automatisch in Google. Weitere Informationen

iOS und Android

Auf nativen Plattformen ist eine Drittanbieterbibliothek erforderlich, um den Authentifizierungsablauf auszulösen.

Installieren Sie das offizielle google_sign_in-Plug-in.

Starten Sie nach der Installation den Anmeldevorgang und erstellen Sie einen neuen Anmeldedatensatz:

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

Im Web unterstützt das Firebase SDK die automatische Verarbeitung des Authentifizierungsablaufs über Ihr Firebase-Projekt. Beispiel:

Erstellen Sie einen Google-Authentifizierungsanbieter und geben Sie alle zusätzlichen Berechtigungsbereiche an, die Sie vom Nutzer erhalten möchten:

GoogleAuthProvider googleProvider = GoogleAuthProvider();

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

Geben Sie die Anmeldedaten für die signInWithPopup-Methode an. Daraufhin wird ein neues Fenster geöffnet, in dem der Nutzer aufgefordert wird, sich in Ihrem Projekt anzumelden. Alternativ können Sie signInWithRedirect verwenden, um den Authentifizierungsprozess im selben Fenster zu behalten.

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 Spiele (nur Android)

Prüfen Sie, ob der Anmeldeanbieter „Play Spiele“ in der Firebase Console aktiviert ist. Folgen Sie dieser Anleitung zur Einrichtung eines Firebase-Projekts für Google Play Spiele.

Folgen Sie dieser Anleitung, um Play Spiele-Dienste mit Ihrer Firebase-App zu konfigurieren.

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

Bevor Sie beginnen, richten Sie Ihre Facebook-Entwickler-App ein und folgen Sie der Einrichtungsanleitung, um die Facebook-Anmeldung zu aktivieren.

Der Anmeldeanbieter „Facebook“ muss in der Firebase Console aktiviert sein und die Facebook-App-ID und das Secret müssen festgelegt sein.

iOS und Android

Auf nativen Plattformen ist eine Drittanbieterbibliothek erforderlich, um sowohl das Facebook SDK zu installieren als auch den Authentifizierungsablauf auszulösen.

Installieren Sie das flutter_facebook_auth-Plug-in.

Folgen Sie der Anleitung in der Plugin-Dokumentation, um sicherzustellen, dass sowohl das Android- als auch das iOS-Facebook SDK richtig initialisiert wurden. Wenn du fertig bist, löse den Anmeldevorgang aus, erstelle Facebook-Anmeldedaten und melde den Nutzer an:

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

Im Web unterstützt das Firebase SDK die automatische Verarbeitung des Authentifizierungsablaufs mithilfe der Facebook-Anwendungsdetails in der Firebase-Konsole. Beispiel:

Erstellen Sie einen Facebook-Anbieter und geben Sie alle zusätzlichen Berechtigungsbereiche an, die Sie vom Nutzer erhalten möchten.

Der OAuth-Weiterleitungs-URI aus der Firebase Console muss in Ihrer Facebook-App als gültiger OAuth-Weiterleitungs-URI hinzugefügt werden.

FacebookAuthProvider facebookProvider = FacebookAuthProvider();

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

Geben Sie die Anmeldedaten für die signInWithPopup-Methode an. Daraufhin wird ein neues Fenster geöffnet, in dem der Nutzer aufgefordert wird, sich in Ihrer Facebook-Anwendung anzumelden:

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+

Bevor Sie beginnen, konfigurieren Sie die Anmeldung über Apple und aktivieren Sie Apple als Anbieter für Anmeldungen.

Prüfen Sie als Nächstes, ob Ihre Runner Apps die Funktion „Über Apple anmelden“ unterstützen.

Android

Bevor Sie beginnen, konfigurieren Sie die Anmeldung über Apple und aktivieren Sie Apple als Anbieter für Anmeldungen.

Web

Bevor Sie beginnen, konfigurieren Sie die Anmeldung über Apple und aktivieren Sie Apple als Anbieter für Anmeldungen.

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

Nur Anmeldung über die Apple-Plattform

Die Anmeldung über Apple auf iOS- und anderen Plattformen kann auch mit der folgenden Methode erfolgen:

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

Apple-Auth-Tokens widerrufen

Die Apple-Anmeldung auf Apple-Plattformen gibt einen Autorisierungscode zurück, mit dem das Apple-Authentifizierungstoken mithilfe der revokeTokenWithAuthorizationCode() API widerrufen werden kann.

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 (nur Apple)

Prüfen Sie, ob der Anmeldeanbieter „Game Center“ in der Firebase Console aktiviert ist. Folgen Sie dieser Anleitung, um ein Game Center-Firebase-Projekt einzurichten.

Sie müssen sich mit dem Game Center anmelden, damit Firebase Game Center-Anmeldedaten ausgestellt und eine Anmeldung über Firebase erfolgen kann. Hier finden Sie eine Anleitung.

iOS+

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

Microsoft

iOS+

Bevor du beginnst, konfiguriere Microsoft Login für iOS und füge deinem Runner die benutzerdefinierten URL-Schemas hinzu (Schritt 1).

Android

Bevor Sie beginnen, konfigurieren Sie Microsoft Login für Android.

Denken Sie daran, den SHA-1-Fingerabdruck Ihrer App hinzuzufügen.

Web

Bevor Sie beginnen, konfigurieren Sie Microsoft Login for 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

Der Anmeldeanbieter „Twitter“ muss in der Firebase Console aktiviert sein und es müssen ein API-Schlüssel und ein API-Secret festgelegt sein. Der Firebase-OAuth-Weiterleitungs-URI (z.B. my-app-12345.firebaseapp.com/__/auth/handler) muss in der Konfiguration der Twitter-App auf der Seite „Einstellungen“ der App als Autorisierungs-Callback-URL festgelegt sein.

Je nach App müssen Sie möglicherweise auch einen erweiterten API-Zugriff beantragen.

iOS+

Sie müssen Ihr benutzerdefiniertes URL-Schema wie in Schritt 1 des iOS-Leitfadens beschrieben konfigurieren.

Android

Wenn Sie den SHA-1-Fingerabdruck Ihrer App noch nicht angegeben haben, tun Sie dies auf der Seite „Einstellungen“ der Firebase Console. Weitere Informationen zum Abrufen des SHA-1-Fingerabdrucks Ihrer App finden Sie unter Client authentifizieren.

Web

Sofort einsatzbereit.

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

Sie müssen in Ihren GitHub-Entwicklereinstellungen eine OAuth-App eingerichtet haben und der Anmeldeanbieter „GitHub“ muss in der Firebase Console aktiviert sein. Außerdem müssen die Client-ID und das Secret festgelegt und die Callback-URL in der GitHub-App eingerichtet sein.

iOS und Android

Für native Plattformen müssen Sie google-services.json und GoogleService-Info.plist hinzufügen.

Fügen Sie für iOS das benutzerdefinierte URL-Schema wie in Schritt 1 des iOS-Leitfadens beschrieben hinzu.

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

  return await FirebaseAuth.instance.signInWithProvider(githubProvider);
}

Web

Im Web unterstützt das GitHub SDK die automatische Verarbeitung des Authentifizierungsablaufs mithilfe der GitHub-Anwendungsdetails in der Firebase Console. Achten Sie darauf, dass die Callback-URL in der Firebase Console als Callback-URL in Ihrer GitHub-Anwendung in der Entwicklerkonsole hinzugefügt wird.

Beispiel:

Erstellen Sie einen GitHub-Anbieter und geben Sie die Anmeldedaten für die signInWithPopup-Methode an. Daraufhin wird ein neues Fenster geöffnet, in dem der Nutzer aufgefordert wird, sich in Ihrer GitHub-Anwendung anzumelden:

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

Der Anmeldeanbieter „Yahoo“ muss in der Firebase Console aktiviert sein und es müssen ein API-Schlüssel und ein API-Secret festgelegt sein. Achten Sie außerdem darauf, dass der Firebase-OAuth-Weiterleitungs-URI (z.B. my-app-12345.firebaseapp.com/__/auth/handler) in der Yahoo Developer Network-Konfiguration Ihrer App als Weiterleitungs-URI festgelegt ist.

iOS+

Bevor du beginnst, konfiguriere Yahoo Login für iOS und füge deinem Runner die benutzerdefinierten URL-Schemas hinzu (Schritt 1).

Android

Konfigurieren Sie zuerst Yahoo Login für Android.

Denken Sie daran, den SHA-1-Fingerabdruck Ihrer App hinzuzufügen.

Web

Sofort einsatzbereit.

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

OAuth-Zugriffstoken verwenden

Wenn du einen AuthProvider verwendest, kannst du das mit dem Anbieter verknüpfte Zugriffstoken mit der folgenden Anfrage abrufen.

final appleProvider = AppleAuthProvider();

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

// You can send requests with the `accessToken`

Authentifizierungsanbieter verknüpfen

Wenn Sie einen Anbieter mit einem aktuellen Nutzer verknüpfen möchten, können Sie die folgende Methode verwenden:

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

Beim Anbieter noch einmal authentifizieren

Dasselbe Muster kann mit reauthenticateWithProvider verwendet werden, um aktuelle Anmeldedaten für vertrauliche Vorgänge abzurufen, für die eine aktuelle Anmeldung erforderlich ist.

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