אתה יכול לאפשר למשתמשים שלך לבצע אימות עם Firebase באמצעות חשבונות הטוויטר שלהם על ידי שילוב אימות טוויטר באפליקציה שלך. אתה יכול לשלב את האימות של Twitter על ידי שימוש ב-SDK של Firebase כדי לבצע את זרימת הכניסה, או על ידי ביצוע זרימת OAuth של Twitter באופן ידני והעברת אסימון הגישה והסוד שנוצר ל-Firebase.
לפני שאתה מתחיל
- הוסף את Firebase לפרויקט JavaScript שלך .
- במסוף Firebase , פתח את הקטע Auth .
- בכרטיסייה שיטת כניסה , הפעל את ספק טוויטר .
- הוסף את מפתח ה-API ואת סוד ה-API ממסוף המפתחים של אותו ספק לתצורת הספק:
- רשום את האפליקציה שלך כיישום מפתח בטוויטר וקבל את מפתח ה-OAuth API ואת סוד ה-API של האפליקציה שלך.
- ודא URI להפניה מחדש של Firebase OAuth שלך (למשל
my-app-12345.firebaseapp.com/__/auth/handler
) מוגדר ככתובת ה-URL שלך להתקשרות חוזרת של הרשאה בדף ההגדרות של האפליקציה שלך בתצורה של אפליקציית Twitter שלך.
- לחץ על שמור .
טפל בזרימת הכניסה עם Firebase SDK
אם אתה בונה אפליקציית אינטרנט, הדרך הקלה ביותר לאמת את המשתמשים שלך עם Firebase באמצעות חשבונות הטוויטר שלהם היא לטפל בזרימת הכניסה עם Firebase JavaScript SDK. (אם ברצונך לאמת משתמש ב-Node.js או בסביבה אחרת שאינה דפדפן, עליך לטפל בזרימת הכניסה באופן ידני.)
כדי לטפל בזרימת הכניסה עם Firebase JavaScript SDK, בצע את השלבים הבאים:
- צור מופע של אובייקט ספק Twitter:
Web modular API
import { TwitterAuthProvider } from "firebase/auth"; const provider = new TwitterAuthProvider();
Web namespaced API
var provider = new firebase.auth.TwitterAuthProvider();
- אופציונלי : כדי להתאים את זרימת ה-OAuth של הספק לשפה המועדפת על המשתמש מבלי להעביר במפורש את פרמטרי ה-OAuth המותאמים אישית הרלוונטיים, עדכן את קוד השפה במופע ה-Auth לפני התחלת זרימת ה-OAuth. לדוגמה:
Web modular API
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 namespaced API
firebase.auth().languageCode = 'it'; // To apply the default browser preference instead of explicitly setting it. // firebase.auth().useDeviceLanguage();
- אופציונלי : ציין פרמטרים נוספים של ספק OAuth מותאמים אישית שברצונך לשלוח עם בקשת ה-OAuth. כדי להוסיף פרמטר מותאם אישית, התקשר
setCustomParameters
על הספק המאותחל עם אובייקט המכיל את המפתח כפי שצוין בתיעוד של ספק OAuth והערך המתאים. לדוגמה:פרמטרי OAuth נדרשים שמורים אינם מותרים ויתעלמו מהם. עיין בהפניה של ספק האימות לפרטים נוספים.Web modular API
provider.setCustomParameters({ 'lang': 'es' });
Web namespaced API
provider.setCustomParameters({ 'lang': 'es' });
- בצע אימות עם Firebase באמצעות אובייקט ספק Twitter. אתה יכול לבקש מהמשתמשים שלך להיכנס עם חשבונות הטוויטר שלהם על ידי פתיחת חלון מוקפץ או על ידי הפנייה מחדש לדף הכניסה. שיטת ההפניה מועדפת במכשירים ניידים.
- כדי להיכנס באמצעות חלון מוקפץ, התקשר ל-
signInWithPopup
:כמו כן, שים לב שאתה יכול לאחזר את אסימון ה-OAuth של ספק טוויטר שניתן להשתמש בו כדי להביא נתונים נוספים באמצעות ממשקי ה-API של Twitter.Web modular API
import { getAuth, signInWithPopup, TwitterAuthProvider } from "firebase/auth"; const auth = getAuth(); signInWithPopup(auth, provider) .then((result) => { // This gives you a the Twitter OAuth 1.0 Access Token and Secret. // You can use these server side with your app's credentials to access the Twitter API. const credential = TwitterAuthProvider.credentialFromResult(result); const token = credential.accessToken; const secret = credential.secret; // 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 = TwitterAuthProvider.credentialFromError(error); // ... });
Web namespaced API
firebase .auth() .signInWithPopup(provider) .then((result) => { /** @type {firebase.auth.OAuthCredential} */ var credential = result.credential; // This gives you a the Twitter OAuth 1.0 Access Token and Secret. // You can use these server side with your app's credentials to access the Twitter API. var token = credential.accessToken; var secret = credential.secret; // 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; // ... });
זה גם המקום שבו אתה יכול לתפוס ולטפל בשגיאות. לקבלת רשימה של קודי שגיאה, עיין ב- Auth Reference Docs .
- כדי להיכנס על ידי הפנייה מחדש לדף הכניסה, התקשר ל-
signInWithRedirect
: פעל לפי השיטות המומלצות בעת השימוש ב-'signInWithRedirect'.לאחר מכן, תוכל גם לאחזר את אסימון ה-OAuth של ספק טוויטר על ידי קריאהWeb modular API
import { getAuth, signInWithRedirect } from "firebase/auth"; const auth = getAuth(); signInWithRedirect(auth, provider);
Web namespaced API
firebase.auth().signInWithRedirect(provider);
getRedirectResult
כאשר הדף שלך נטען:זה גם המקום שבו אתה יכול לתפוס ולטפל בשגיאות. לקבלת רשימה של קודי שגיאה, עיין ב- Auth Reference Docs .Web modular API
import { getAuth, getRedirectResult, TwitterAuthProvider } from "firebase/auth"; const auth = getAuth(); getRedirectResult(auth) .then((result) => { // This gives you a the Twitter OAuth 1.0 Access Token and Secret. // You can use these server side with your app's credentials to access the Twitter API. const credential = TwitterAuthProvider.credentialFromResult(result); const token = credential.accessToken; const secret = credential.secret; // ... // 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 = TwitterAuthProvider.credentialFromError(error); // ... });
Web namespaced API
firebase.auth() .getRedirectResult() .then((result) => { if (result.credential) { /** @type {firebase.auth.OAuthCredential} */ var credential = result.credential; // This gives you a the Twitter OAuth 1.0 Access Token and Secret. // You can use these server side with your app's credentials to access the Twitter API. var token = credential.accessToken; var secret = credential.secret; // ... } // 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 באמצעות חשבון Twitter על ידי טיפול בזרימת הכניסה על ידי קריאה לנקודות הקצה של Twitter OAuth:
- שלב אימות טוויטר באפליקציה שלך על ידי מעקב אחר התיעוד של המפתח . בסוף זרימת הכניסה ל-Twitter, תקבל אסימון גישה של OAuth וסוד OAuth.
- אם אתה צריך להיכנס ליישום Node.js, שלח את אסימון הגישה של OAuth ואת סוד ה-OAuth ליישום Node.js.
- לאחר שמשתמש נכנס בהצלחה עם Twitter, החלף את אסימון הגישה של OAuth ואת סוד ה-OAuth עבור אישור Firebase:
var credential = firebase.auth.TwitterAuthProvider.credential(token, secret);
- בצע אימות באמצעות Firebase באמצעות האישורים של Firebase:
Web modular API
import { getAuth, signInWithCredential, FacebookAuthProvider } from "firebase/auth"; // Sign in with the credential from the Facebook user. const auth = getAuth(); signInWithCredential(auth, credential) .then((result) => { // Signed in const credential = FacebookAuthProvider.credentialFromResult(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 = FacebookAuthProvider.credentialFromError(error); // ... });
Web namespaced API
// Sign in with the credential from the Facebook user. firebase.auth().signInWithCredential(credential) .then((result) => { // Signed in var credential = result.credential; // ... }) .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 ואחסון בענן , תוכל לקבל את מזהה המשתמש הייחודי של המשתמש המחובר ממשתנה
auth
, ולהשתמש בו כדי לשלוט לאילו נתונים המשתמש יכול לגשת.
אתה יכול לאפשר למשתמשים להיכנס לאפליקציה שלך באמצעות מספר ספקי אימות על ידי קישור אישורי ספק אימות לחשבון משתמש קיים.
כדי לצאת ממשתמש, התקשר ל- signOut
:
Web modular API
import { getAuth, signOut } from "firebase/auth"; const auth = getAuth(); signOut(auth).then(() => { // Sign-out successful. }).catch((error) => { // An error happened. });
Web namespaced API
firebase.auth().signOut().then(() => { // Sign-out successful. }).catch((error) => { // An error happened. });
אתה יכול לאפשר למשתמשים שלך לבצע אימות עם Firebase באמצעות חשבונות הטוויטר שלהם על ידי שילוב אימות טוויטר באפליקציה שלך. אתה יכול לשלב את האימות של Twitter על ידי שימוש ב-SDK של Firebase כדי לבצע את זרימת הכניסה, או על ידי ביצוע זרימת OAuth של Twitter באופן ידני והעברת אסימון הגישה והסוד שנוצר ל-Firebase.
לפני שאתה מתחיל
- הוסף את Firebase לפרויקט JavaScript שלך .
- במסוף Firebase , פתח את הקטע Auth .
- בכרטיסייה שיטת כניסה , הפעל את ספק טוויטר .
- הוסף את מפתח ה-API ואת סוד ה-API ממסוף המפתחים של אותו ספק לתצורת הספק:
- רשום את האפליקציה שלך כיישום מפתח בטוויטר וקבל את מפתח ה-OAuth API ואת סוד ה-API של האפליקציה שלך.
- ודא URI להפניה מחדש של Firebase OAuth שלך (למשל
my-app-12345.firebaseapp.com/__/auth/handler
) מוגדר ככתובת ה-URL שלך להתקשרות חוזרת של הרשאה בדף ההגדרות של האפליקציה שלך בתצורה של אפליקציית Twitter שלך.
- לחץ על שמור .
טפל בזרימת הכניסה עם Firebase SDK
אם אתה בונה אפליקציית אינטרנט, הדרך הקלה ביותר לאמת את המשתמשים שלך עם Firebase באמצעות חשבונות הטוויטר שלהם היא לטפל בזרימת הכניסה עם Firebase JavaScript SDK. (אם ברצונך לאמת משתמש ב-Node.js או בסביבה אחרת שאינה דפדפן, עליך לטפל בזרימת הכניסה באופן ידני.)
כדי לטפל בזרימת הכניסה עם Firebase JavaScript SDK, בצע את השלבים הבאים:
- צור מופע של אובייקט ספק Twitter:
Web modular API
import { TwitterAuthProvider } from "firebase/auth"; const provider = new TwitterAuthProvider();
Web namespaced API
var provider = new firebase.auth.TwitterAuthProvider();
- אופציונלי : כדי להתאים את זרימת ה-OAuth של הספק לשפה המועדפת על המשתמש מבלי להעביר במפורש את פרמטרי ה-OAuth המותאמים אישית הרלוונטיים, עדכן את קוד השפה במופע ה-Auth לפני התחלת זרימת ה-OAuth. לדוגמה:
Web modular API
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 namespaced API
firebase.auth().languageCode = 'it'; // To apply the default browser preference instead of explicitly setting it. // firebase.auth().useDeviceLanguage();
- אופציונלי : ציין פרמטרים נוספים של ספק OAuth מותאמים אישית שברצונך לשלוח עם בקשת ה-OAuth. כדי להוסיף פרמטר מותאם אישית, התקשר
setCustomParameters
על הספק המאותחל עם אובייקט המכיל את המפתח כפי שצוין בתיעוד של ספק OAuth והערך המתאים. לדוגמה:פרמטרי OAuth נדרשים שמורים אינם מותרים ויתעלמו מהם. עיין בהפניה של ספק האימות לפרטים נוספים.Web modular API
provider.setCustomParameters({ 'lang': 'es' });
Web namespaced API
provider.setCustomParameters({ 'lang': 'es' });
- בצע אימות עם Firebase באמצעות אובייקט ספק Twitter. אתה יכול לבקש מהמשתמשים שלך להיכנס עם חשבונות הטוויטר שלהם על ידי פתיחת חלון מוקפץ או על ידי הפנייה מחדש לדף הכניסה. שיטת ההפניה מועדפת במכשירים ניידים.
- כדי להיכנס באמצעות חלון מוקפץ, התקשר ל-
signInWithPopup
:כמו כן, שים לב שאתה יכול לאחזר את אסימון ה-OAuth של ספק טוויטר שניתן להשתמש בו כדי להביא נתונים נוספים באמצעות ממשקי ה-API של Twitter.Web modular API
import { getAuth, signInWithPopup, TwitterAuthProvider } from "firebase/auth"; const auth = getAuth(); signInWithPopup(auth, provider) .then((result) => { // This gives you a the Twitter OAuth 1.0 Access Token and Secret. // You can use these server side with your app's credentials to access the Twitter API. const credential = TwitterAuthProvider.credentialFromResult(result); const token = credential.accessToken; const secret = credential.secret; // 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 = TwitterAuthProvider.credentialFromError(error); // ... });
Web namespaced API
firebase .auth() .signInWithPopup(provider) .then((result) => { /** @type {firebase.auth.OAuthCredential} */ var credential = result.credential; // This gives you a the Twitter OAuth 1.0 Access Token and Secret. // You can use these server side with your app's credentials to access the Twitter API. var token = credential.accessToken; var secret = credential.secret; // 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; // ... });
זה גם המקום שבו אתה יכול לתפוס ולטפל בשגיאות. לקבלת רשימה של קודי שגיאה, עיין ב- Auth Reference Docs .
- כדי להיכנס על ידי הפנייה מחדש לדף הכניסה, התקשר ל-
signInWithRedirect
: פעל לפי השיטות המומלצות בעת השימוש ב-'signInWithRedirect'.לאחר מכן, תוכל גם לאחזר את אסימון ה-OAuth של ספק טוויטר על ידי קריאהWeb modular API
import { getAuth, signInWithRedirect } from "firebase/auth"; const auth = getAuth(); signInWithRedirect(auth, provider);
Web namespaced API
firebase.auth().signInWithRedirect(provider);
getRedirectResult
כאשר הדף שלך נטען:זה גם המקום שבו אתה יכול לתפוס ולטפל בשגיאות. לקבלת רשימה של קודי שגיאה, עיין ב- Auth Reference Docs .Web modular API
import { getAuth, getRedirectResult, TwitterAuthProvider } from "firebase/auth"; const auth = getAuth(); getRedirectResult(auth) .then((result) => { // This gives you a the Twitter OAuth 1.0 Access Token and Secret. // You can use these server side with your app's credentials to access the Twitter API. const credential = TwitterAuthProvider.credentialFromResult(result); const token = credential.accessToken; const secret = credential.secret; // ... // 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 = TwitterAuthProvider.credentialFromError(error); // ... });
Web namespaced API
firebase.auth() .getRedirectResult() .then((result) => { if (result.credential) { /** @type {firebase.auth.OAuthCredential} */ var credential = result.credential; // This gives you a the Twitter OAuth 1.0 Access Token and Secret. // You can use these server side with your app's credentials to access the Twitter API. var token = credential.accessToken; var secret = credential.secret; // ... } // 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 באמצעות חשבון Twitter על ידי טיפול בזרימת הכניסה על ידי קריאה לנקודות הקצה של Twitter OAuth:
- שלב אימות טוויטר באפליקציה שלך על ידי מעקב אחר התיעוד של המפתח . בסוף זרימת הכניסה ל-Twitter, תקבל אסימון גישה של OAuth וסוד OAuth.
- אם אתה צריך להיכנס ליישום Node.js, שלח את אסימון הגישה של OAuth ואת סוד ה-OAuth ליישום Node.js.
- לאחר שמשתמש נכנס בהצלחה עם Twitter, החלף את אסימון הגישה של OAuth ואת סוד ה-OAuth עבור אישור Firebase:
var credential = firebase.auth.TwitterAuthProvider.credential(token, secret);
- בצע אימות באמצעות Firebase באמצעות האישורים של Firebase:
Web modular API
import { getAuth, signInWithCredential, FacebookAuthProvider } from "firebase/auth"; // Sign in with the credential from the Facebook user. const auth = getAuth(); signInWithCredential(auth, credential) .then((result) => { // Signed in const credential = FacebookAuthProvider.credentialFromResult(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 = FacebookAuthProvider.credentialFromError(error); // ... });
Web namespaced API
// Sign in with the credential from the Facebook user. firebase.auth().signInWithCredential(credential) .then((result) => { // Signed in var credential = result.credential; // ... }) .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 ואחסון בענן , תוכל לקבל את מזהה המשתמש הייחודי של המשתמש המחובר ממשתנה
auth
, ולהשתמש בו כדי לשלוט לאילו נתונים המשתמש יכול לגשת.
אתה יכול לאפשר למשתמשים להיכנס לאפליקציה שלך באמצעות מספר ספקי אימות על ידי קישור אישורי ספק אימות לחשבון משתמש קיים.
כדי לצאת ממשתמש, התקשר ל- signOut
:
Web modular API
import { getAuth, signOut } from "firebase/auth"; const auth = getAuth(); signOut(auth).then(() => { // Sign-out successful. }).catch((error) => { // An error happened. });
Web namespaced API
firebase.auth().signOut().then(() => { // Sign-out successful. }).catch((error) => { // An error happened. });
אתה יכול לאפשר למשתמשים שלך לבצע אימות עם Firebase באמצעות חשבונות הטוויטר שלהם על ידי שילוב אימות טוויטר באפליקציה שלך. אתה יכול לשלב את האימות של Twitter על ידי שימוש ב-SDK של Firebase כדי לבצע את זרימת הכניסה, או על ידי ביצוע זרימת OAuth של Twitter באופן ידני והעברת אסימון הגישה והסוד שנוצר ל-Firebase.
לפני שאתה מתחיל
- הוסף את Firebase לפרויקט JavaScript שלך .
- במסוף Firebase , פתח את הקטע Auth .
- בכרטיסייה שיטת כניסה , הפעל את ספק טוויטר .
- הוסף את מפתח ה-API ואת סוד ה-API ממסוף המפתחים של אותו ספק לתצורת הספק:
- רשום את האפליקציה שלך כיישום מפתח בטוויטר וקבל את מפתח ה-OAuth API ואת סוד ה-API של האפליקציה שלך.
- ודא URI להפניה מחדש של Firebase OAuth שלך (למשל
my-app-12345.firebaseapp.com/__/auth/handler
) מוגדר ככתובת ה-URL שלך להתקשרות חוזרת של הרשאה בדף ההגדרות של האפליקציה שלך בתצורה של אפליקציית Twitter שלך.
- לחץ על שמור .
טפל בזרימת הכניסה עם Firebase SDK
אם אתה בונה אפליקציית אינטרנט, הדרך הקלה ביותר לאמת את המשתמשים שלך עם Firebase באמצעות חשבונות הטוויטר שלהם היא לטפל בזרימת הכניסה עם Firebase JavaScript SDK. (אם ברצונך לאמת משתמש ב-Node.js או בסביבה אחרת שאינה דפדפן, עליך לטפל בזרימת הכניסה באופן ידני.)
כדי לטפל בזרימת הכניסה עם Firebase JavaScript SDK, בצע את השלבים הבאים:
- צור מופע של אובייקט ספק Twitter:
Web modular API
import { TwitterAuthProvider } from "firebase/auth"; const provider = new TwitterAuthProvider();
Web namespaced API
var provider = new firebase.auth.TwitterAuthProvider();
- אופציונלי : כדי להתאים את זרימת ה-OAuth של הספק לשפה המועדפת על המשתמש מבלי להעביר במפורש את פרמטרי OAuth המותאמים אישית הרלוונטיים, עדכן את קוד השפה במופע ה-Auth לפני התחלת זרימת ה-OAuth. לדוגמה:
Web modular API
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 namespaced API
firebase.auth().languageCode = 'it'; // To apply the default browser preference instead of explicitly setting it. // firebase.auth().useDeviceLanguage();
- אופציונלי : ציין פרמטרים נוספים של ספק OAuth מותאמים אישית שברצונך לשלוח עם בקשת ה-OAuth. כדי להוסיף פרמטר מותאם אישית, התקשר
setCustomParameters
על הספק המאותחל עם אובייקט המכיל את המפתח כפי שצוין בתיעוד של ספק OAuth והערך המתאים. לדוגמה:פרמטרי OAuth נדרשים שמורים אינם מותרים ויתעלמו מהם. עיין בהפניה של ספק האימות לפרטים נוספים.Web modular API
provider.setCustomParameters({ 'lang': 'es' });
Web namespaced API
provider.setCustomParameters({ 'lang': 'es' });
- בצע אימות עם Firebase באמצעות אובייקט ספק Twitter. אתה יכול לבקש מהמשתמשים שלך להיכנס עם חשבונות הטוויטר שלהם על ידי פתיחת חלון מוקפץ או על ידי הפנייה מחדש לדף הכניסה. שיטת ההפניה מועדפת במכשירים ניידים.
- כדי להיכנס באמצעות חלון מוקפץ, התקשר ל-
signInWithPopup
:כמו כן, שים לב שאתה יכול לאחזר את אסימון ה-OAuth של ספק טוויטר שניתן להשתמש בו כדי להביא נתונים נוספים באמצעות ממשקי ה-API של Twitter.Web modular API
import { getAuth, signInWithPopup, TwitterAuthProvider } from "firebase/auth"; const auth = getAuth(); signInWithPopup(auth, provider) .then((result) => { // This gives you a the Twitter OAuth 1.0 Access Token and Secret. // You can use these server side with your app's credentials to access the Twitter API. const credential = TwitterAuthProvider.credentialFromResult(result); const token = credential.accessToken; const secret = credential.secret; // 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 = TwitterAuthProvider.credentialFromError(error); // ... });
Web namespaced API
firebase .auth() .signInWithPopup(provider) .then((result) => { /** @type {firebase.auth.OAuthCredential} */ var credential = result.credential; // This gives you a the Twitter OAuth 1.0 Access Token and Secret. // You can use these server side with your app's credentials to access the Twitter API. var token = credential.accessToken; var secret = credential.secret; // 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; // ... });
זה גם המקום שבו אתה יכול לתפוס ולטפל בשגיאות. לקבלת רשימה של קודי שגיאה, עיין ב- Auth Reference Docs .
- כדי להיכנס על ידי הפנייה מחדש לדף הכניסה, התקשר ל-
signInWithRedirect
: פעל לפי השיטות המומלצות בעת השימוש ב-'signInWithRedirect'.לאחר מכן, תוכל גם לאחזר את אסימון ה-OAuth של ספק טוויטר על ידי קריאהWeb modular API
import { getAuth, signInWithRedirect } from "firebase/auth"; const auth = getAuth(); signInWithRedirect(auth, provider);
Web namespaced API
firebase.auth().signInWithRedirect(provider);
getRedirectResult
כאשר הדף שלך נטען:זה גם המקום שבו אתה יכול לתפוס ולטפל בשגיאות. לקבלת רשימה של קודי שגיאה, עיין ב- Auth Reference Docs .Web modular API
import { getAuth, getRedirectResult, TwitterAuthProvider } from "firebase/auth"; const auth = getAuth(); getRedirectResult(auth) .then((result) => { // This gives you a the Twitter OAuth 1.0 Access Token and Secret. // You can use these server side with your app's credentials to access the Twitter API. const credential = TwitterAuthProvider.credentialFromResult(result); const token = credential.accessToken; const secret = credential.secret; // ... // 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 = TwitterAuthProvider.credentialFromError(error); // ... });
Web namespaced API
firebase.auth() .getRedirectResult() .then((result) => { if (result.credential) { /** @type {firebase.auth.OAuthCredential} */ var credential = result.credential; // This gives you a the Twitter OAuth 1.0 Access Token and Secret. // You can use these server side with your app's credentials to access the Twitter API. var token = credential.accessToken; var secret = credential.secret; // ... } // 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 באמצעות חשבון Twitter על ידי טיפול בזרימת הכניסה על ידי קריאה לנקודות הקצה של Twitter OAuth:
- שלב אימות טוויטר באפליקציה שלך על ידי מעקב אחר התיעוד של המפתח . בסוף תהליך הכניסה של טוויטר, תקבל אסימון גישה של OAuth וסוד OAuth.
- אם אתה צריך להיכנס ליישום Node.js, שלח את אסימון הגישה של OAuth ואת סוד ה-OAuth ליישום Node.js.
- לאחר שמשתמש נכנס בהצלחה עם Twitter, החלף את אסימון הגישה של OAuth ואת סוד ה-OAuth עבור אישור Firebase:
var credential = firebase.auth.TwitterAuthProvider.credential(token, secret);
- בצע אימות עם Firebase באמצעות האישורים של Firebase:
Web modular API
import { getAuth, signInWithCredential, FacebookAuthProvider } from "firebase/auth"; // Sign in with the credential from the Facebook user. const auth = getAuth(); signInWithCredential(auth, credential) .then((result) => { // Signed in const credential = FacebookAuthProvider.credentialFromResult(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 = FacebookAuthProvider.credentialFromError(error); // ... });
Web namespaced API
// Sign in with the credential from the Facebook user. firebase.auth().signInWithCredential(credential) .then((result) => { // Signed in var credential = result.credential; // ... }) .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 ואחסון בענן , אתה יכול לקבל את מזהה המשתמש הייחודי של המשתמש המחובר ממשתנה
auth
, ולהשתמש בו כדי לשלוט לאילו נתונים המשתמש יכול לגשת.
אתה יכול לאפשר למשתמשים להיכנס לאפליקציה שלך באמצעות מספר ספקי אימות על ידי קישור אישורי ספק אימות לחשבון משתמש קיים.
כדי לצאת ממשתמש, התקשר ל- signOut
:
Web modular API
import { getAuth, signOut } from "firebase/auth"; const auth = getAuth(); signOut(auth).then(() => { // Sign-out successful. }).catch((error) => { // An error happened. });
Web namespaced API
firebase.auth().signOut().then(() => { // Sign-out successful. }).catch((error) => { // An error happened. });