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

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

Sowohl native Plattformen als auch das Web unterstützen die Erstellung 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

Die meisten Konfigurationen sind bereits eingerichtet, wenn Sie Google Log-in mit Firebase verwenden. Sie müssen jedoch sicherstellen, dass der SHA1-Schlüssel Ihres Computers für die Verwendung mit Android konfiguriert wurde. Informationen zum Generieren des Schlüssels finden Sie in der Dokumentation zur Authentifizierung.

Achten Sie darauf, dass der Anmeldeanbieter „Google“ in der Firebase Console aktiviert ist.

Wenn sich Ihr Nutzer mit Google anmeldet, nachdem er bereits manuell ein Konto registriert hat, wird der Authentifizierungsanbieter aufgrund des Konzepts der vertrauenswürdigen Anbieter von Firebase Authentication automatisch zu Google geändert. Weitere Informationen hier.

iOS+ und Android

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

Installieren Sie das offizielle google_sign_in-Plug-in.

Lösen Sie nach der Installation den Anmeldeablauf aus und erstellen Sie neue Anmeldedaten:

import 'package:google_sign_in/google_sign_in.dart';

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

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

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

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

Web

Im Web bietet das Firebase SDK Unterstützung für die automatische Verarbeitung des Authentifizierungsablaufs mit Ihrem 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 an die Methode signInWithPopup weiter. Dadurch 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 belassen.

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

Achten Sie darauf, dass der Anmeldeanbieter „Play Games“ in der Firebase Console aktiviert ist. Folgen Sie dieser Anleitung, um das Firebase-Projekt für Play Games einzurichten.

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

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

Richten Sie zuerst Ihre Facebook-Entwickleranwendung ein und folgen Sie der Anleitung, um Facebook Login zu aktivieren.

Achten Sie darauf, dass der Anmeldeanbieter „Facebook“ in der Firebase Console aktiviert ist und die Facebook-App-ID und das Secret festgelegt sind.

iOS+ und Android

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

Installieren Sie das flutter_facebook_auth Plug-in.

Sie müssen die Schritte in der Plug-in-Dokumentation ausführen, um sicherzustellen, dass sowohl das Android- als auch das iOS-Facebook SDK richtig initialisiert wurden. Lösen Sie nach Abschluss den Anmeldeablauf aus, erstellen Sie Facebook-Anmeldedaten und melden Sie 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 bietet das Firebase SDK Unterstützung für die automatische Verarbeitung des Authentifizierungsablaufs mit den Details der Facebook-Anwendung, die in der Firebase Console angegeben sind. Beispiel:

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

Achten Sie darauf, dass der OAuth-Weiterleitungs-URI aus der Firebase Console als gültiger OAuth-Weiterleitungs-URI in Ihrer Facebook-App hinzugefügt wird.

FacebookAuthProvider facebookProvider = FacebookAuthProvider();

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

Geben Sie die Anmeldedaten an die Methode signInWithPopup weiter. Dadurch 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+

Konfigurieren Sie zuerst die Anmeldung mit Apple und aktivieren Sie Apple als Anmeldeanbieter.

Achten Sie dann darauf, dass Ihre Runner-Apps die Funktion „Mit Apple anmelden“ haben.

Android

Konfigurieren Sie zuerst die Anmeldung mit Apple und aktivieren Sie Apple als Anmeldeanbieter.

Web

Konfigurieren Sie zuerst die Anmeldung mit Apple und aktivieren Sie Apple als Anmeldeanbieter.

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 auf der Apple-Plattform

Die Apple-Anmeldung auf iOS+-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-Authentifizierungstoken widerrufen

Bei der Apple-Anmeldung auf Apple-Plattformen wird ein Autorisierungscode zurückgegeben, mit dem das Apple-Authentifizierungstoken über die 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)

Achten Sie darauf, dass der Anmeldeanbieter „Game Center“ in der Firebase Console aktiviert ist. Folgen Sie dieser Anleitung, um das Firebase-Projekt für Game Center einzurichten.

Sie müssen sich mit Game Center anmelden, bevor Anmeldedaten für Firebase Game Center ausgestellt und über Firebase angemeldet werden können. Hier finden Sie eine Anleitung dazu.

iOS+

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

Microsoft

iOS+

Konfigurieren Sie zuerst die Microsoft-Anmeldung für iOS und fügen Sie die benutzerdefinierten URL-Schemata zu Ihrem Runner hinzu (Schritt 1).

Android

Konfigurieren Sie zuerst die Microsoft-Anmeldung für Android.

Vergessen Sie nicht, den SHA-1-Fingerabdruck Ihrer App hinzuzufügen.

Web

Konfigurieren Sie zuerst die Microsoft-Anmeldung für das 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

Achten Sie darauf, dass der Anmeldeanbieter "Twitter" in der Firebase Console aktiviert ist und ein API-Schlüssel und ein API-Secret festgelegt sind. Achten Sie darauf, dass Ihr Firebase-OAuth-Weiterleitungs-URI (z.B. my-app-12345.firebaseapp.com/__/auth/handler) auf der Seite mit den Einstellungen Ihrer App in der Konfiguration Ihrer Twitter-App als Callback-URL für die Autorisierung festgelegt ist.

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

iOS+

Sie müssen Ihr benutzerdefiniertes URL-Schema wie in Schritt 1 der iOS-Anleitung 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

Funktioniert sofort.

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

Achten Sie darauf, dass Sie in den GitHub-Entwicklereinstellungen eine OAuth-App eingerichtet haben und dass der Anmeldeanbieter „GitHub“ in der Firebase Console aktiviert ist. Die Client-ID und das Secret müssen festgelegt sein und die Callback-URL muss in der GitHub-App festgelegt 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 der iOS-Anleitung beschrieben hinzu.

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

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

Web

Im Web bietet das GitHub SDK Unterstützung für die automatische Verarbeitung des Authentifizierungsablaufs mit den Details der GitHub-Anwendung, die in der Firebase Console angegeben sind. Achten Sie darauf, dass die Callback-URL in der Firebase Console als Callback-URL in Ihrer GitHub-Anwendung in der Developer Console hinzugefügt wird.

Beispiel:

Erstellen Sie einen GitHub-Anbieter und geben Sie die Anmeldedaten an die Methode signInWithPopup weiter. Dadurch 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!

Achten Sie darauf, dass der Anmeldeanbieter „Yahoo!“ in der Firebase Console aktiviert ist und ein API-Schlüssel und ein API-Secret festgelegt sind. Achten Sie außerdem darauf, dass Ihr 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+

Konfigurieren Sie zuerst die Yahoo!-Anmeldung für iOS und fügen Sie die benutzerdefinierten URL-Schemata zu Ihrem Runner hinzu (Schritt 1).

Android

Konfigurieren Sie zuerst die Yahoo!-Anmeldung für Android.

Vergessen Sie nicht, den SHA-1-Fingerabdruck Ihrer App hinzuzufügen.

Web

Funktioniert sofort.

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

Mit einem AuthProvider können Sie das Zugriffstoken abrufen, das mit dem Anbieter verknüpft ist, indem Sie die folgende Anfrage senden.

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

Neu authentifizieren

Dasselbe Muster kann mit reauthenticateWithProvider verwendet werden, um neue 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