社交驗證是一種多步驟驗證流程,可讓您將使用者登入帳戶或連結至現有帳戶。
原生平台和網路支援都會建立憑證,然後將憑證傳遞至 signInWithCredential
或 linkWithCredential
方法。此外,您也可以在網頁平台上透過彈出式視窗或重新導向,觸發驗證程序。
以搭配 Firebase 使用 Google 登入功能時,大部分的設定已經設定完成,但需要確認機器的 SHA1 金鑰已設為與 Android 搭配使用。請參閱驗證說明文件,瞭解如何產生金鑰。
確認 Firebase 控制台已啟用「Google」登入供應商。
如果使用者透過 Google 登入,在手動註冊帳戶之後,他們的驗證提供者就會自動變更為 Google,因為受信任供應商的 Firebase 驗證概念。詳情請參閱這個頁面。
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 遊戲
您可以使用 Play 遊戲登入功能,在 Android 遊戲中驗證使用者。
Android
依照 Android 上的 Google 設定說明,然後使用您的 Firebase 應用程式資訊設定 Play 遊戲服務。
以下操作會觸發登入流程、建立新憑證並登入使用者:
final googleUser = await GoogleSignIn(
signInOption: SignInOption.games,
).signIn();
final googleAuth = await googleUser?.authentication;
if (googleAuth != null) {
// Create a new credential
final credential = GoogleAuthProvider.credential(
accessToken: googleAuth.accessToken,
idToken: googleAuth.idToken,
);
// Once signed in, return the UserCredential
await _auth.signInWithCredential(credential);
}
在開始設定您的 Facebook 開發人員應用程式之前,請按照設定程序啟用 Facebook 登入。
確保 Firebase 主控台已啟用「Facebook」登入供應商,並使用 Facebook 應用程式 ID 和密鑰集。
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 已在您的 Facebook 應用程式中新增為有效的 OAuth 重新導向 URI。
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 驗證權杖
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!);
}
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);
}
}
確認 Firebase 主控台已啟用「Twitter」登入供應商,並已設定 API 金鑰和 API 密鑰。前往 Twitter 應用程式設定的應用程式設定頁面,確認 Firebase OAuth 重新導向 URI (例如 my-app-12345.firebaseapp.com/__/auth/handler) 已設為授權回呼網址。
此外,您可能也需要根據應用程式要求進階 API 存取權。
iOS+
您必須按照 iOS 指南步驟 1 中的說明來設定自訂網址配置。
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 應用程式的回呼網址。
iOS+ 和 Android
如果是原生平台,您需要新增 google-services.json
和 GoogleService-Info.plist
。
如果是 iOS 裝置,請按照 iOS 指南步驟 1 中的說明新增自訂網址通訊協定。
Future<UserCredential> signInWithGitHub() async {
// Create a new provider
GithubAuthProvider githubProvider = GithubAuthProvider();
return await FirebaseAuth.instance.signInWithProvider(githubProvider);
}
網站
在網頁上,GitHub SDK 支援使用 Firebase 控制台提供的 GitHub 應用程式詳細資料,自動處理驗證流程。確認 Firebase 控制台中的回呼網址已新增為開發人員主控台的 GitHub 應用程式回呼網址。
例如:
建立 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 主控台已啟用「Yahoo」登入提供者,並已設定 API 金鑰和 API 密鑰。此外,請務必在應用程式的 Yahoo 開發人員聯播網設定中,將 Firebase OAuth 重新導向 URI (例如 my-app-12345.firebaseapp.com/__/auth/handler) 設為重新導向 URI。
iOS+
開始之前,請先為 iOS 設定 Yahoo 登入,並在執行器中新增自訂網址配置 (步驟 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