Google I/O 2022 で発表された Firebase の最新情報をご覧ください。詳細

フェデレーション ID とソーシャルログイン

ソーシャル認証はマルチステップの認証フローで、ユーザーはアカウントにログインしたり、既存のアカウントにリンクしたりできます。

ネイティブプラットフォームとウェブのどちらでも、認証情報を作成して、signInWithCredential または linkWithCredential メソッドに渡すことができます。ウェブプラットフォームの場合は、ポップアップやリダイレクトで認証プロセスをトリガーすることもできます。

Google

Firebase で Google ログインを使用する場合、ほとんどの構成はすでに設定されていますが、マシンの SHA1 キーが Android で使用できるように構成されていることを確認する必要があります。キーの生成方法については、認証のドキュメントをご覧ください。

Firebase コンソールで「Google」ログインプロバイダが有効になっていることを確認します。

ユーザーがアカウントを手動で登録した後に Google でログインすると、信頼済みプロバイダという Firebase Authentication のコンセプトにより、認証プロバイダが自動的に Google に変更されます。詳細については、こちらをご覧ください。

iOS+ および Android

ネイティブプラットフォームの場合、認証フローをトリガーするためにサードパーティのライブラリが必要になります。

公式の google_sign_in プラグインをインストールします。

インストールが完了したら、ログインフローをトリガーして新しい認証情報を作成します。

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

ウェブ

ウェブの場合、Firebase SDK は、Firebase プロジェクトを使用して認証フローを自動的に処理できます。次に例を示します。

Google 認証プロバイダを作成し、ユーザーから取得する追加の権限スコープを指定します。

GoogleAuthProvider googleProvider = GoogleAuthProvider();

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

認証情報を signInWithPopup メソッドに渡します。これにより、ユーザーにプロジェクトへのログインを求める新しいウィンドウが表示されます。また、signInWithRedirect を使用して同じウィンドウ内で認証プロセスを行うこともできます。

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（Android のみ）

Firebase コンソールで「Play Games」ログインプロバイダが有効になっていることを確認します。Play ゲームの Firebase プロジェクトのセットアップの手順に沿って操作します。

Firebase アプリで Play Games サービスを構成する手順に沿って操作します。

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

Facebook デベロッパーアプリの設定を始める前に、設定プロセスに沿って Facebook ログインを有効にします。

Facebook アプリ ID とシークレットを設定して、Firebase コンソールで「Facebook」ログインプロバイダが有効になっていることを確認します。

iOS+ および Android

ネイティブプラットフォームの場合、Facebook SDK をインストールして認証フローをトリガーするために、サードパーティのライブラリが必要です。

flutter_facebook_auth プラグインをインストールします。

プラグインのドキュメントに記載されている手順に沿って、Android と iOS 両方の Facebook SDK が正しく初期化されていることを確認する必要があります。完了したら、ログインフローをトリガーし、Facebook 認証情報を作成して、ユーザーログインを行います。

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

ウェブ

ウェブの場合、Firebase SDK は、Firebase コンソールで提供された Facebook アプリケーションの詳細を使用して、認証フローを自動的に処理します。次に例を示します。

Facebook プロバイダを作成し、ユーザーから取得する追加の権限スコープを指定します。

Firebase コンソールの OAuth リダイレクト URI が、有効な OAuth リダイレクト URI として Facebook アプリに追加されていることを確認します。

FacebookAuthProvider facebookProvider = FacebookAuthProvider();

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

認証情報を signInWithPopup メソッドに渡します。これにより、ユーザーに 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+

「Apple でサインイン」を構成する前に、Apple をログインプロバイダとして有効にします。

次に、Runner アプリに「Apple でサインイン」機能があることを確認します。

Android

「Apple でサインイン」を構成する前に、Apple をログインプロバイダとして有効にします。

ウェブ

「Apple でサインイン」を構成する前に、Apple をログインプロバイダとして有効にします。

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

Apple プラットフォームのログインのみ

iOS+ プラットフォームで Apple ログインを行うには、次の方法もあります。

// 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 認証トークンを取り消す

Apple プラットフォームで Apple ログインを行うと、revokeTokenWithAuthorizationCode() API を使用して Apple 認証トークンを取り消すために使用できる認証コードが返されます。

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 のみ）

Firebase コンソールで「Game Center」ログインプロバイダが有効になっていることを確認します。Game Center Firebase プロジェクトのセットアップの手順に沿って操作します。

Firebase Game Center 認証情報を発行して Firebase 経由でログインするには、Game Center でログインする必要があります。ログイン方法については、次の手順に従ってください。

iOS+

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

Microsoft

iOS+

開始する前に、iOS 用の Microsoft ログインを構成し、カスタム URL スキームをランナーに追加（ステップ 1）します。

Android

開始する前に、Android 用の Microsoft ログインを構成します。

アプリの SHA-1 フィンガープリントを必ず追加してください。

ウェブ

開始する前に、ウェブ用の Microsoft ログインを構成します。

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

Firebase コンソールで、API キーと API Secret を設定して「Twitter」ログインプロバイダが有効になっていることを確認します。Twitter アプリの構成にあるアプリ設定ページで、Firebase OAuth リダイレクト URI（my-app-12345.firebaseapp.com/__/auth/handler など）を認証コールバック URL として設定します。

アプリに応じた API アクセスの昇格のリクエストが必要になる場合もあります。

iOS+

iOS のガイドのステップ 1 に沿って、カスタム URL スキームを構成する必要があります。

Android

アプリの SHA-1 フィンガープリントを指定していない場合は、Firebase コンソールの [プロジェクトの設定] ページで指定します。アプリの SHA-1 フィンガープリントを取得する方法の詳細については、クライアントの認証をご覧ください。

ウェブ

次の方法ですぐに使用できます。

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

GitHub デベロッパー設定で OAuth アプリが設定されていることを確認します。Firebase コンソールで、「GitHub」ログインプロバイダが有効になっており、クライアント ID とシークレットが設定され、GitHub アプリで設定されたコールバック URL が指定されていることを確認します。

iOS+ および Android

ネイティブプラットフォームの場合は、google-services.json と GoogleService-Info.plist を追加する必要があります。

iOS の場合は、iOS のガイドのステップ 1 に沿ってカスタム URL スキームを追加します。

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

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

ウェブ

ウェブの場合、GitHub SDK は、Firebase コンソールで提供された GitHub アプリケーションの詳細を使用して、認証フローを自動的に処理します。デベロッパーコンソールの GitHub アプリケーションで、Firebase コンソールのコールバック URL がコールバック URL として追加されていることを確認します。

次に例を示します。

GitHub プロバイダを作成し、認証情報を signInWithPopup メソッドに渡します。これにより、ユーザーに 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

Firebase コンソールで、API キーと API Secret を設定して「Yahoo」ログインプロバイダが有効になっていることを確認します。また、Firebase OAuth リダイレクト URI（my-app-12345.firebaseapp.com/__/auth/handler など）が、アプリの Yahoo Developer Network 構成のリダイレクト URI として設定されていることも確認します。

iOS+

開始する前に、iOS 用の Yahoo ログインを構成し、カスタム URL スキームをランナーに追加（ステップ 1）します。

Android

開始する前に、Android 用の Yahoo ログインを構成します。

アプリの SHA-1 フィンガープリントを必ず追加してください。

ウェブ

次の方法ですぐに使用できます。

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 アクセストークンの使用

AuthProvider を使用すると、次のリクエストを送信することで、プロバイダに関連付けられたアクセストークンを取得できます。

final appleProvider = AppleAuthProvider();

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

// You can send requests with the `accessToken`

認証プロバイダのリンク

プロバイダを現在のユーザーにリンクするには、次のメソッドを使用します。 ```dart await FirebaseAuth.instance.signInAnonymously();

final appleProvider = AppleAuthProvider();

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

// linkWithRedirect も使用可 } else { await FirebaseAuth.instance.currentUser?.linkWithProvider(appleProvider); }

// 匿名ユーザーがアップグレードされ、「Apple でサインイン」を使用して接続できるようになりました ```

プロバイダで再認証する

同じパターンを reauthenticateWithProvider でも使用できます。これは、ログインしてから短時間のうちに行うべき機密性の高いオペレーションのために、最新の認証情報を取得するのに使われます。

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

フェデレーション ID とソーシャル ログイン

Google

iOS+ および Android

ウェブ

Google Play Games（Android のみ）

Android

Facebook

iOS+ および Android

ウェブ

Apple

iOS+

Android

ウェブ

Apple プラットフォームのログインのみ

Apple 認証トークンを取り消す

Apple Game Center（Apple のみ）

iOS+

Microsoft

iOS+

Android

ウェブ

Twitter

iOS+

Android

ウェブ

GitHub

iOS+ および Android

ウェブ

Yahoo

iOS+

Android

ウェブ

OAuth アクセス トークンの使用

認証プロバイダのリンク

プロバイダで再認証する

フェデレーション ID とソーシャルログイン

OAuth アクセストークンの使用