אתם יכולים לאפשר למשתמשים שלכם לבצע אימות באמצעות Firebase באמצעות חשבונות Google שלהם. אפשר להשתמש ב-Firebase SDK כדי לבצע את תהליך הכניסה באמצעות חשבון Google, או לבצע את תהליך הכניסה באופן ידני באמצעות הספרייה Sign In With Google ולהעביר את טוקן של מזהה שמתקבל ל-Firebase.
הנחיית AI לקבלת עזרה מבוססת-AI
כדי לקבל עזרה מ-AI, מעתיקים את הפרומפט שלמטה לסוכן התכנות מבוסס ה-AI (כמו Antigravity, Claude Code, Codex ו-Cursor). אתם יכולים להתאים אישית את ההנחיה ולשפר אותה בעזרת הסוכן. מידע מפורט על ההתקנה זמין במאמר בנושא סקילים של סוכני Firebase.
Help me use Firebase in my app.
1. Make sure that **Firebase agent skills** are installed and updated. For Claude Code, Codex, or Cursor agents, help me install the Firebase plugin. For other agents, run `npx skills add firebase/agent-skills`. Always try to use **Firebase agent skills** for Firebase-related tasks.
2. Help me set up and use Firebase Authentication with Google Sign-In in my app.
לפני שמתחילים
- מוסיפים את Firebase לפרויקט ב-JavaScript.
- מפעילים את Google כספק אימות בפרויקט Firebase:
- במסוף Firebase, עוברים אל Security (אבטחה) > Authentication (אימות).
- בכרטיסייה Sign-in method (שיטת הכניסה), מפעילים את ספק הכניסה Google.
- לוחצים על שמירה.
טיפול בתהליך הכניסה באמצעות 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 ואת הערך התואם. לדוגמה:אסור להשתמש בפרמטרים שמורים של OAuth, והמערכת תתעלם מהם. פרטים נוספים מופיעים במאמר בנושא ספק אימות.Web
provider.setCustomParameters({ 'login_hint': 'user@example.com' });
Web
provider.setCustomParameters({ 'login_hint': 'user@example.com' });
- מתבצע אימות באמצעות Firebase באמצעות אובייקט ספק Google. אתם יכולים להציג למשתמשים בקשה להיכנס באמצעות חשבונות Google שלהם על ידי פתיחת חלון קופץ או על ידי הפניה לדף הכניסה. שיטת ההפניה האוטומטית מועדפת במכשירים ניידים.
- כדי להיכנס לחשבון באמצעות חלון קופץ, מתקשרים אל
signInWithPopup:שימו לב שאפשר גם לאחזר את אסימון ה-OAuth של ספק Google, שבו אפשר להשתמש כדי לאחזר נתונים נוספים באמצעות Google APIs.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`.אחרי כן, תוכלו גם לאחזר את טוקן ה-OAuth של ספק Google על ידי קריאה ל-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, ואפשר להשתמש בו כדי לזהות משתמש בכל אפליקציה בפרויקט, בלי קשר לשיטת הכניסה של המשתמש.
-
באפליקציות, הדרך המומלצת לדעת מה סטטוס האימות של המשתמש היא להגדיר אובייקט observer ב-
Auth. אחרי כן תוכלו לקבל את פרטי הפרופיל הבסיסיים של המשתמש מאובייקטUser. ניהול משתמשים ב-Firebase Realtime Database וב-Cloud Storage Security Rules, אפשר לקבל את מזהה המשתמש הייחודי של המשתמש המחובר מהמשתנה
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. });