การตรวจสอบสิทธิ์ทางโซเชียลเป็นขั้นตอนการตรวจสอบสิทธิ์หลายขั้นตอน ซึ่งช่วยให้คุณลงชื่อเข้าใช้บัญชีหรือลิงก์บัญชีผู้ใช้กับบัญชีที่มีอยู่ได้
ทั้งแพลตฟอร์มเนทีฟและเว็บรองรับการสร้างข้อมูลเข้าสู่ระบบซึ่งส่งไปยังเมธอด signInWithCredential
หรือ linkWithCredential
ได้ หรือคุณอาจทริกเกอร์ขั้นตอนการตรวจสอบสิทธิ์ผ่านป๊อปอัปหรือการเปลี่ยนเส้นทางในแพลตฟอร์มบนเว็บก็ได้
มีการกำหนดค่าส่วนใหญ่ไว้แล้วเมื่อใช้ Google Sign-In ด้วย Firebase แต่คุณต้องตรวจสอบว่าได้กำหนดค่าคีย์ SHA1 ของเครื่องเพื่อใช้กับ Android แล้ว ดูวิธีสร้างคีย์ได้ในเอกสารการตรวจสอบสิทธิ์
ตรวจสอบว่าเปิดใช้ผู้ให้บริการการลงชื่อเข้าใช้ "Google" ในคอนโซล Firebase แล้ว
หากผู้ใช้ลงชื่อเข้าใช้ด้วย 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 Games
คุณตรวจสอบสิทธิ์ผู้ใช้ในเกม Android ได้โดยใช้การลงชื่อเข้าใช้ Play Games
Android
ทำตามวิธีการสำหรับการตั้งค่า Google ใน Android แล้วกำหนดค่า บริการเกมของ Play ด้วยข้อมูลแอป Firebase
รายการต่อไปนี้จะเรียกใช้ขั้นตอนการลงชื่อเข้าใช้ สร้างข้อมูลเข้าสู่ระบบใหม่ และลงชื่อเข้าใช้ผู้ใช้:
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 Developer แล้วทำตามขั้นตอนการตั้งค่าเพื่อเปิดใช้การเข้าสู่ระบบ Facebook
ตรวจสอบว่าเปิดใช้ผู้ให้บริการการลงชื่อเข้าใช้ "Facebook" บนคอนโซล Firebase ด้วยชุดรหัสแอปและข้อมูลลับของ Facebook
iOS+ และ Android
ในแพลตฟอร์มดั้งเดิม จะต้องมีไลบรารีของบุคคลที่สามเพื่อติดตั้ง Facebook SDK และทริกเกอร์ขั้นตอนการตรวจสอบสิทธิ์
ติดตั้งปลั๊กอิน flutter_facebook_auth
คุณจะต้องทำตามขั้นตอนในเอกสารประกอบของปลั๊กอินเพื่อให้แน่ใจว่าได้เริ่มต้น SDK ของ Facebook ทั้ง Android และ iOS อย่างถูกต้องแล้ว เมื่อเสร็จแล้ว ให้เรียกใช้ขั้นตอนการลงชื่อเข้าใช้ สร้างข้อมูลเข้าสู่ระบบ 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 จะรองรับการจัดการขั้นตอนการตรวจสอบสิทธิ์โดยอัตโนมัติโดยใช้รายละเอียดแอปพลิเคชัน Facebook ที่ระบุไว้ในคอนโซล Firebase ตัวอย่างเช่น
สร้างผู้ให้บริการ Facebook โดยให้ขอบเขตสิทธิ์เพิ่มเติมที่คุณต้องการได้รับจากผู้ใช้
ตรวจสอบว่าได้เพิ่ม URI การเปลี่ยนเส้นทาง OAuth จากคอนโซล Firebase เป็น URI การเปลี่ยนเส้นทาง OAuth ที่ถูกต้องในแอป 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
การลงชื่อเข้าใช้ Apple บนแพลตฟอร์มของ Apple จะแสดงรหัสการให้สิทธิ์ที่ใช้เพื่อเพิกถอนโทเค็นการตรวจสอบสิทธิ์ของ Apple โดยใช้ revokeTokenWithAuthorizationCode()
API
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
iOS ขึ้นไป
ก่อนเริ่มกำหนดค่าการเข้าสู่ระบบ Microsoft สำหรับ iOS และเพิ่มรูปแบบ URL ที่กำหนดเองลงใน Runner ของคุณ (ขั้นตอนที่ 1)
Android
ก่อนที่จะเริ่มกำหนดค่าการเข้าสู่ระบบ Microsoft สำหรับ Android
อย่าลืมเพิ่มลายนิ้วมือ SHA-1 ของแอป
เว็บไซต์
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 ตรวจสอบว่า URI การเปลี่ยนเส้นทาง OAuth ของ Firebase (เช่น my-app-12345.firebaseapp.com/__/auth/handler) มีการตั้งค่าเป็น URL เรียกกลับเรื่องการให้สิทธิ์ในหน้าการตั้งค่าของแอปในการกำหนดค่าของแอป Twitter
นอกจากนี้คุณอาจต้องขอการเข้าถึง API เพิ่มเติมโดยขึ้นอยู่กับแอปของคุณ
iOS ขึ้นไป
คุณต้องกำหนดค่า Scheme ของ URL ที่กำหนดเองตามที่อธิบายไว้ในคำแนะนำของ 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
ตรวจสอบว่าคุณได้ตั้งค่าแอป OAuth จากการตั้งค่าสำหรับนักพัฒนาซอฟต์แวร์ GitHub และเปิดใช้ผู้ให้บริการการลงชื่อเข้าใช้ "GitHub" ในคอนโซล Firebase ด้วยการตั้งค่ารหัสไคลเอ็นต์และรหัสลับแล้ว โดยตั้งค่า URL เรียกกลับในแอป GitHub
iOS+ และ Android
สำหรับแพลตฟอร์มเนทีฟ คุณต้องเพิ่ม google-services.json
และ GoogleService-Info.plist
สำหรับ iOS ให้เพิ่มรูปแบบ URL ที่กำหนดเองตามที่อธิบายไว้ในคู่มือ iOS ขั้นตอนที่ 1
Future<UserCredential> signInWithGitHub() async {
// Create a new provider
GithubAuthProvider githubProvider = GithubAuthProvider();
return await FirebaseAuth.instance.signInWithProvider(githubProvider);
}
เว็บไซต์
GitHub SDK สำหรับบนเว็บรองรับการจัดการขั้นตอนการตรวจสอบสิทธิ์โดยอัตโนมัติโดยใช้รายละเอียดแอปพลิเคชัน GitHub ที่ระบุไว้ในคอนโซล Firebase ตรวจสอบว่าได้เพิ่ม URL เรียกกลับในคอนโซล Firebase เป็น URL เรียกกลับในแอปพลิเคชัน GitHub บน Developer Console
ตัวอย่างเช่น
สร้างผู้ให้บริการ 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
ตรวจสอบว่าได้เปิดใช้ผู้ให้บริการการลงชื่อเข้าใช้ "Yahoo" ในคอนโซล Firebase ด้วยคีย์ API และชุดข้อมูลลับ API และตรวจสอบด้วยว่า URI การเปลี่ยนเส้นทาง Firebase OAuth (เช่น my-app-12345.firebaseapp.com/__/auth/handler) ได้รับการตั้งค่าเป็น URI การเปลี่ยนเส้นทางในการกำหนดค่าเครือข่ายนักพัฒนาซอฟต์แวร์ของ Yahoo
iOS ขึ้นไป
ก่อนเริ่มต้น ให้กำหนดค่าการเข้าสู่ระบบ Yahoo สำหรับ iOS และเพิ่มรูปแบบ URL ที่กำหนดเองลงใน Runner (ขั้นตอนที่ 1)
Android
ก่อนที่จะเริ่มต้น ให้กำหนดค่าการเข้าสู่ระบบ Yahoo สำหรับ Android
อย่าลืมเพิ่มลายนิ้วมือ 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();
สุดท้าย appleProvider = AppleAuthProvider();
if (kIsWeb) { รอ 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