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 die Webunterstützung unterstützen das Erstellen von Anmeldedaten, die dann an den signInWithCredential übergeben werden können. oder linkWithCredential verwenden. Alternativ können Sie auf Webplattformen den Authentifizierungsprozess über ein Pop-up oder eine Weiterleitung auslösen.

Google

Ein Großteil der Konfiguration ist bereits eingerichtet, wenn Sie Google Log-in mit Firebase verwenden. Sie müssen jedoch sicherstellen, dass Der SHA1-Schlüssel wurde für die Verwendung mit Android konfiguriert. Wie Sie den Schlüssel generieren, sehen Sie in der Dokumentation zur Authentifizierung

Stellen Sie sicher, dass die Der Anmeldeanbieter ist in der Firebase Console aktiviert.

Wenn sich ein Nutzer über Google anmeldet, nachdem er bereits manuell ein Konto registriert hat, wird der Authentifizierungsanbieter automatisch aufgrund des Firebase Authentications-Konzepts vertrauenswürdiger Anbieter zu Google wechseln. Weitere Informationen finden Sie hier.

iOS und Android

Auf nativen Plattformen ist eine Bibliothek eines Drittanbieters erforderlich, um den Authentifizierungsvorgang auszulösen.

Installieren Sie das offizielle google_sign_in-Plug-in.

Starten Sie nach der Installation den Anmeldevorgang 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().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 bietet das Firebase SDK Unterstützung für die automatische Abwicklung des Authentifizierungsvorgangs mit Ihrem Firebase-Projekt. Beispiel:

Erstellen Sie einen Google-Authentifizierungsanbieter unter Angabe eines zusätzlichen Berechtigungsbereichs. 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. Dadurch wird eine neue wird der Nutzer aufgefordert, sich in Ihrem Projekt anzumelden. Alternativ können Sie signInWithRedirect verwenden, um das Authentifizierungsprozess im selben Fenster.

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)

Stellen Sie sicher, dass die Seite Der Anmeldeanbieter ist in der Firebase Console aktiviert. Folgen Sie dieser Anleitung zum Einrichten eines Firebase-Projekts für 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 Ihre Facebook Developer App einrichten, folgen Sie dem Einrichtungsprozess, um die Facebook-Anmeldung zu aktivieren.

Achten Sie darauf, dass „Facebook“ Der Anmeldeanbieter ist in der Firebase Console aktiviert. mit der Facebook-App-ID und dem Facebook-Secret.

iOS und Android

Auf nativen Plattformen ist eine Bibliothek eines Drittanbieters erforderlich, um das Facebook SDK zu installieren und den Authentifizierungsvorgang auszulösen.

Installieren Sie das Plug-in flutter_facebook_auth.

Befolgen Sie die Schritte in der Plug-in-Dokumentation, um sicherzustellen, dass sowohl die Android- als auch Facebook SDKs für iOS wurden initialisiert korrekt sind. Sobald der Vorgang abgeschlossen ist, starten Sie den Anmeldevorgang, erstellen Sie Facebook-Anmeldedaten und melden Sie sich 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.

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

FacebookAuthProvider facebookProvider = FacebookAuthProvider();

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

Geben Sie die Anmeldedaten für die Methode signInWithPopup 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 du beginnst, konfiguriere die Funktion „Über Apple anmelden“. und aktiviere Apple als Anmeldeanbieter.

Prüfen Sie als Nächstes, ob Ihre Runner-Apps die Berechtigung „Über Apple anmelden“ haben

Android

Bevor du beginnst, konfiguriere die Funktion „Über Apple anmelden“. und aktiviere Apple als Anmeldeanbieter.

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 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

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)

Das „Game Center“ muss Der Anmeldeanbieter ist in der Firebase Console aktiviert. Folgen Sie dieser Anleitung zum Einrichten von Firebase-Projekten für Game Center.

Sie müssen sich im Game Center anmelden, damit Firebase Game Center-Anmeldedaten ausgestellt und über Firebase angemeldet werden können. Hier finden Sie eine Anleitung, wie Sie das tun können.

iOS+

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

Microsoft

iOS+

Bevor Sie beginnen, Microsoft Login für iOS zu konfigurieren und benutzerdefinierte URL-Schemas hinzufügen zu Ihrem Runner (Schritt 1).

Android

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

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

Web

Bevor Sie beginnen, Microsoft Login for Web zu konfigurieren

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

Stellen Sie sicher, dass die Der Anmeldeanbieter ist in der Firebase Console aktiviert. mit einem API-Schlüssel und einem API-Secret. Achte darauf, dass der Firebase-OAuth-Weiterleitungs-URI (z. B. my-app-12345.firebaseapp.com/__/auth/handler) in der Konfiguration deiner Twitter-App auf der Seite „Einstellungen“ deiner App als Autorisierungs-Callback-URL festgelegt ist.

Möglicherweise müssen Sie abhängig von Ihrer Anwendung erweiterten API-Zugriff anfordern.

iOS+

Sie müssen Ihr Schema für benutzerdefinierte URLs 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

Prüfen Sie, ob Sie eine OAuth-App in den GitHub-Entwicklereinstellungen eingerichtet haben und dass das „GitHub“ Der Anmeldeanbieter ist in der Firebase Console aktiviert. mit der Client-ID und dem Secret sowie der Callback-URL in der GitHub-App festgelegt.

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 Schema für benutzerdefinierte URLs hinzu, wie in Schritt 1 beschrieben.

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 Abwicklung des Authentifizierungsvorgangs mithilfe der Methode GitHub-Anwendungsdetails werden in der Firebase Console bereitgestellt. Achten Sie darauf, dass die Callback-URL in der Firebase Console hinzugefügt wird als Callback-URL in Ihrer GitHub-Anwendung in der Developer Console.

Beispiel:

Erstellen Sie einen GitHub-Anbieter und stellen Sie die Anmeldedaten für die Methode signInWithPopup bereit. 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 Ihr Firebase-OAuth-Weiterleitungs-URI (z.B. my-app-12345.firebaseapp.com/__/auth/handler) ist in der Yahoo Developer Network-Konfiguration Ihrer App als Weiterleitungs-URI festgelegt.

iOS+

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

Android

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

Vergessen Sie nicht, 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

Mit einem AuthProvider können Sie das Zugriffstoken abrufen, das dem Anbieter zugeordnet ist indem Sie die folgende Anfrage stellen.

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: ```dart await FirebaseAuth.instance.signInAnonym()

final appleProvider = AppleAuthProvider()

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

// Sie können auch linkWithRedirect verwenden } else { await FirebaseAuth.instance.currentUser?.linkWithProvider(appleProvider); }

// Das Upgrade für Ihren anonymen Nutzer wurde durchgeführt, damit Sie sich mit „Über Apple anmelden“ verbinden können

Noch einmal beim Anbieter authentifizieren

Dasselbe Muster kann mit reauthenticateWithProvider verwendet werden, mit dem sich aktuelle Anmeldedaten für vertrauliche Vorgänge, die eine kürzlich erfolgte Anmeldung erfordern.

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