תוכלו לאפשר למשתמשים לבצע אימות ב-Firebase באמצעות חשבונות Google שלהם. אפשר להשתמש ב-Firebase SDK כדי לבצע את תהליך הכניסה באמצעות חשבון Google, או לבצע את תהליך הכניסה באופן ידני באמצעות הספרייה Sign In With Google ולהעביר את אסימון המזהה שנוצר ל-Firebase.
לפני שמתחילים
- מוסיפים את Firebase לפרויקט JavaScript.
- הפעלת Google כשיטת כניסה במסוף Firebase:
- במסוף Firebase, פותחים את בקטע אימות.
- בכרטיסייה שיטת כניסה, מפעילים את שיטת הכניסה של Google. ולוחצים על Save.
איך מבצעים את תהליך הכניסה באמצעות Firebase SDK
אם מפתחים אפליקציית אינטרנט, הדרך הקלה ביותר לאמת את המשתמשים עם Firebase באמצעות חשבונות Google, הוא צריך לטפל בתהליך הכניסה עם Firebase JavaScript SDK. (אם רוצים לאמת משתמש ב-Node.js או סביבה אחרת שאינה דפדפן, צריך לטפל בתהליך הכניסה באופן ידני).
כדי לטפל בתהליך הכניסה באמצעות Firebase JavaScript SDK:
- יוצרים מופע של אובייקט הספק של Google:
Web
import { GoogleAuthProvider } from "firebase/auth"; const provider = new GoogleAuthProvider();
Web
var provider = new firebase.auth.GoogleAuthProvider();
- אופציונלי: מציינים היקפי הרשאות נוספים של OAuth 2.0 שרוצים לבקש מספק האימות. כדי להוסיף היקף, צריך להפעיל את הפונקציה
addScope
. לדוגמה:Web
provider.addScope('https://www.googleapis.com/auth/contacts.readonly');
Web
provider.addScope('https://www.googleapis.com/auth/contacts.readonly');
- אופציונלי: אפשר להתאים את זרימת ה-OAuth של הספק לשוק המקומי בהתאם להעדפות המשתמש
מבלי להעביר באופן מפורש את הפרמטרים המותאמים אישית הרלוונטיים של OAuth, מעדכנים את השפה
במופע האימות לפני שמתחילים בתהליך OAuth. לדוגמה:
Web
import { getAuth } from "firebase/auth"; const auth = getAuth(); auth.languageCode = 'it'; // To apply the default browser preference instead of explicitly setting it. // auth.useDeviceLanguage();
Web
firebase.auth().languageCode = 'it'; // To apply the default browser preference instead of explicitly setting it. // firebase.auth().useDeviceLanguage();
- אופציונלי: ציון פרמטרים מותאמים אישית נוספים של ספק OAuth
שרוצים לשלוח בבקשת ה-OAuth. כדי להוסיף פרמטר מותאם אישית, קוראים לפונקציה
setCustomParameters
בספק שאותחל עם אובייקט שמכיל את המפתח כפי שמצוין במסמכים של ספק ה-OAuth ובערך המתאים. לדוגמה:Web
provider.setCustomParameters({ 'login_hint': 'user@example.com' });
Web
provider.setCustomParameters({ 'login_hint': 'user@example.com' });
- מבצעים אימות עם Firebase באמצעות אובייקט הספק של Google. אפשר
ולבקש מהמשתמשים להיכנס באמצעות חשבונות Google שלהם, על ידי פתיחת
חלון קופץ או על ידי הפניה אוטומטית לדף הכניסה. השיטה להפניה אוטומטית היא המועדפת במכשירים ניידים.
- כדי להיכנס באמצעות חלון קופץ, צריך להתקשר אל
signInWithPopup
:Web
import { getAuth, signInWithPopup, GoogleAuthProvider } from "firebase/auth"; const auth = getAuth(); signInWithPopup(auth, provider) .then((result) => { // This gives you a Google Access Token. You can use it to access the Google API. const credential = GoogleAuthProvider.credentialFromResult(result); const token = credential.accessToken; // The signed-in user info. const user = result.user; // IdP data available using getAdditionalUserInfo(result) // ... }).catch((error) => { // Handle Errors here. const errorCode = error.code; const errorMessage = error.message; // The email of the user's account used. const email = error.customData.email; // The AuthCredential type that was used. const credential = GoogleAuthProvider.credentialFromError(error); // ... });
Web
firebase.auth() .signInWithPopup(provider) .then((result) => { /** @type {firebase.auth.OAuthCredential} */ var credential = result.credential; // This gives you a Google Access Token. You can use it to access the Google API. var token = credential.accessToken; // The signed-in user info. var user = result.user; // IdP data available in result.additionalUserInfo.profile. // ... }).catch((error) => { // Handle Errors here. var errorCode = error.code; var errorMessage = error.message; // The email of the user's account used. var email = error.email; // The firebase.auth.AuthCredential type that was used. var credential = error.credential; // ... });
כאן גם תוכלו לזהות שגיאות ולטפל בהן. רשימה של קודי שגיאה מופיעה במסמכי העזר לאימות.
- כדי להיכנס באמצעות הפניה אוטומטית לדף הכניסה, קוראים לפונקציה
signInWithRedirect
: יש לפעול לפי השיטות המומלצות כשמשתמשים ב-'signInWithRedirect'.Web
import { getAuth, signInWithRedirect } from "firebase/auth"; const auth = getAuth(); signInWithRedirect(auth, provider);
Web
firebase.auth().signInWithRedirect(provider);
getRedirectResult
כשהדף נטען:Web
import { getAuth, getRedirectResult, GoogleAuthProvider } from "firebase/auth"; const auth = getAuth(); getRedirectResult(auth) .then((result) => { // This gives you a Google Access Token. You can use it to access Google APIs. const credential = GoogleAuthProvider.credentialFromResult(result); const token = credential.accessToken; // The signed-in user info. const user = result.user; // IdP data available using getAdditionalUserInfo(result) // ... }).catch((error) => { // Handle Errors here. const errorCode = error.code; const errorMessage = error.message; // The email of the user's account used. const email = error.customData.email; // The AuthCredential type that was used. const credential = GoogleAuthProvider.credentialFromError(error); // ... });
Web
firebase.auth() .getRedirectResult() .then((result) => { if (result.credential) { /** @type {firebase.auth.OAuthCredential} */ var credential = result.credential; // This gives you a Google Access Token. You can use it to access the Google API. var token = credential.accessToken; // ... } // The signed-in user info. var user = result.user; // IdP data available in result.additionalUserInfo.profile. // ... }).catch((error) => { // Handle Errors here. var errorCode = error.code; var errorMessage = error.message; // The email of the user's account used. var email = error.email; // The firebase.auth.AuthCredential type that was used. var credential = error.credential; // ... });
- כדי להיכנס באמצעות חלון קופץ, צריך להתקשר אל
אימות באמצעות Firebase בתוסף ל-Chrome
אם אתם מפתחים אפליקציה לתוסף ל-Chrome, כדאי לעיין במדריך בנושא מסמכים מחוץ למסך.
השלבים הבאים
אחרי שמשתמש נכנס לחשבון בפעם הראשונה, נוצר חשבון משתמש חדש שמקושר לפרטי הכניסה – כלומר שם המשתמש והסיסמה, מספר הטלפון או פרטי ספק האימות – שבאמצעותם המשתמש נכנס לחשבון. החדש הזה מאוחסנים כחלק מפרויקט Firebase, וניתן להשתמש בהם כדי לזהות משתמש בכל האפליקציות בפרויקט, בלי קשר לאופן שבו המשתמשים נכנסים לחשבון.
-
באפליקציות, מומלץ לדעת מה סטטוס האימות של המשתמש. הגדרת הצופה באובייקט
Auth
. עכשיו אפשר לקבל את פרטי פרופיל בסיסיים מהאובייקטUser
. צפייה ניהול משתמשים. בתוך Firebase Realtime Database ו-Cloud Storage כללי אבטחה – מקבלים את מזהה המשתמש הייחודי של המשתמש המחובר מהמשתנה
auth
, ולהשתמש בהם כדי לקבוע לאילו נתונים המשתמש יוכל לגשת.
אפשר לאפשר למשתמשים להיכנס לאפליקציה באמצעות מספר סוגי אימות מספקים באמצעות קישור פרטי הכניסה של ספק האימות קיים חשבון משתמש קיים.
כדי להוציא משתמש מהחשבון, קוראים לפונקציה
signOut
:
Web
import { getAuth, signOut } from "firebase/auth"; const auth = getAuth(); signOut(auth).then(() => { // Sign-out successful. }).catch((error) => { // An error happened. });
Web
firebase.auth().signOut().then(() => { // Sign-out successful. }).catch((error) => { // An error happened. });