Catch up on everthing we announced at this year's Firebase Summit. Learn more

אמת באמצעות אפל באמצעות JavaScript

תוכל לאפשר למשתמשים שלך לאמת באמצעות Firebase באמצעות מזהה Apple שלהם באמצעות SDK Firebase לביצוע זרימת הכניסה מקצה לקצה OAuth 2.0.

לפני שאתה מתחיל

כדי להיכנס למשתמשים באמצעות אפל, הגדר תחילה כניסה עם אפל באתר המפתחים של אפל, ולאחר מכן הפעל את אפל כספק כניסה לפרויקט Firebase שלך.

הצטרף לתוכנית המפתחים של אפל

היכנס עם אפל יכול להיות מוגדר רק על ידי חברי המפתחים של אפל תוכנית .

הגדר כניסה עם Apple

על המפתחים של אפל באתר, לבצע את הפעולות הבאות:

  1. לשייך את האתר מחדש לאפליקציה שלך כמתואר בסעיף הראשון של סימן Configure עם אפל עבור האינטרנט . כשתתבקש, רשום את כתובת האתר הבאה ככתובת URL חזרה:

    https://YOUR_FIREBASE_PROJECT_ID.firebaseapp.com/__/auth/handler

    אתה יכול לקבל את זיהוי פרויקט Firebase שלך על דף הגדרות Firebase הקונסולה .

    לאחר שתסיים, שים לב למזהה השירות החדש שלך, שתזדקק לו בחלק הבא.

  2. צור היכנס באמצעות המפתח הפרטי אפל . תצטרך את המפתח הפרטי והמזהה החדש שלך בחלק הבא.
  3. אם אתה משתמש בכל התכונות של אימות Firebase ששולחים מיילים למשתמשים, כולל קישור בדוא"ל הכניסה, אימות כתובת הדוא"ל, חשבון שינוי הביטול, ואחרים, להגדיר את שירות ממסר הדוא"ל הפרטית אפל ולרשום noreply@ YOUR_FIREBASE_PROJECT_ID .firebaseapp.com (או דומיין תבנית הדוא"ל המותאמת אישית שלך) כך שאפל תוכל להעביר הודעות דוא"ל שנשלחו על ידי אימות Firebase לכתובות דוא"ל אנונימיות של אפל.

הפעל את Apple כספק כניסה

  1. להוסיף Firebase לפרויקט שלך .
  2. בשנות ה קונסולת Firebase , פתח את הקטע המחבר. 'הכניסה דרך כרטיסיית שיטה, לאפשר הספק האפל. ציין את מזהה השירות שיצרת בחלק הקודם. כמו כן, בחלק תצורת זרימת קוד OAuth, ציין מזהה צוות האפל שלך ואת המפתח הפרטי ובריח זיהה שיצרו בסעיף הקודם.

ציית לדרישות הנתונים האנונימיות של אפל

היכנס עם אפל מעניקה למשתמשים את האפשרות של שהפיכת הנתונים שלהם, כולל כתובת הדוא"ל שלהם, בעת הכניסה. משתמשים שיבחרו באפשרות זו יש כתובות דוא"ל עם תחום privaterelay.appleid.com . כאשר אתה משתמש בכניסה עם Apple באפליקציה שלך, עליך לציית לכל מדיניות המפתחים או התנאים החלים של Apple בנוגע למזהי Apple אנונימיים אלה.

זה כולל קבלת כל הסכמת משתמשים נדרשת לפני שאתה משייך כל מידע אישי המזהה ישירות עם מזהה Apple אנונימי. בעת שימוש באימות Firebase, הדבר עשוי לכלול את הפעולות הבאות:

  • קשר כתובת דוא"ל למזהה Apple אנונימי או להיפך.
  • קשר מספר טלפון לזהות Apple אנונימי או להיפך
  • קשר תעודה חברתית לא אנונימית (פייסבוק, גוגל וכו ') למזהה Apple אנונימי או להיפך.

הרשימה לעיל אינה ממצה. עיין בהסכם הרישיון של תוכנית המפתחים של Apple בחלק החברות בחשבון המפתח שלך כדי לוודא שהאפליקציה שלך עומדת בדרישות של אפל.

לטפל בזרימת הכניסה באמצעות SDK Firebase

אם אתה בונה יישום אינטרנט, הדרך הקלה ביותר לאמת את המשתמשים שלך באמצעות Firebase באמצעות חשבונות Apple שלהם היא לטפל בכל זרימת הכניסה באמצעות SDK JavaScript של Firebase.

כדי לטפל בזרימת הכניסה באמצעות SDK JavaScript של Firebase, בצע את השלבים הבאים:

  1. יצירת מופע של OAuthProvider באמצעות מזהה ספק המתאים apple.com.

    גרסת אינטרנט 9

    import { OAuthProvider } from "firebase/auth";
    
    const provider = new OAuthProvider('apple.com');

    גרסת אינטרנט 8

    var provider = new firebase.auth.OAuthProvider('apple.com');
  2. אופציונאלי: ציין OAuth נוסף 2.0 היקפים מעבר ברירת המחדל שברצונך הבקשה מספקת אימות.

    גרסת אינטרנט 9

    provider.addScope('email');
    provider.addScope('name');

    גרסת אינטרנט 8

    provider.addScope('email');
    provider.addScope('name');

    כברירת מחדל, כאשר חשבון אחד לכל כתובת דואר מאופשר, Firebase בקשות בהיקפים הדוא"ל והשם. אם תשנה הגדרה זו לחשבונות מרובים לכל כתובת הדוא"ל, Firebase אינו מבקש שום ההיקפים מאפל, אלא אם תציין אותם.

  3. אופציונלי: אם אתה רוצה להציג הכניסה של אפל מסך בשפה שאינה אנגלית, להגדיר את locale פרמטר. עיין היכנס עם docs האפל עבור האזורים הנתמכים.

    גרסת אינטרנט 9

    provider.setCustomParameters({
      // Localize the Apple authentication screen in French.
      locale: 'fr'
    });

    גרסת אינטרנט 8

    provider.setCustomParameters({
      // Localize the Apple authentication screen in French.
      locale: 'fr'
    });
  4. אימות באמצעות Firebase באמצעות אובייקט ספק OAuth. תוכל לבקש מהמשתמשים שלך להיכנס באמצעות חשבונות Apple שלהם על ידי פתיחת חלון מוקפץ או על ידי הפניה לדף הכניסה. שיטת הפניה מועדפת במכשירים ניידים.

    • כדי להיכנס עם חלון מוקפץ, שיחת signInWithPopup() :

      גרסת אינטרנט 9

      import { getAuth, signInWithPopup, OAuthProvider } from "firebase/auth";
      
      const auth = getAuth();
      signInWithPopup(auth, provider)
        .then((result) => {
          // The signed-in user info.
          const user = result.user;
      
          // Apple credential
          const credential = OAuthProvider.credentialFromResult(result);
          const accessToken = credential.accessToken;
          const idToken = credential.idToken;
      
          // ...
        })
        .catch((error) => {
          // Handle Errors here.
          const errorCode = error.code;
          const errorMessage = error.message;
          // The email of the user's account used.
          const email = error.email;
          // The credential that was used.
          const credential = OAuthProvider.credentialFromError(error);
      
          // ...
        });

      גרסת אינטרנט 8

      firebase
        .auth()
        .signInWithPopup(provider)
        .then((result) => {
          /** @type {firebase.auth.OAuthCredential} */
          var credential = result.credential;
      
          // The signed-in user info.
          var user = result.user;
      
          // You can also get the Apple OAuth Access and ID Tokens.
          var accessToken = credential.accessToken;
          var idToken = credential.idToken;
      
          // ...
        })
        .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() :

      גרסת אינטרנט 9

      import { getAuth, signInWithRedirect } from "firebase/auth";
      
      const auth = getAuth();
      signInWithRedirect(auth, provider);

      גרסת אינטרנט 8

      firebase.auth().signInWithRedirect(provider);

      לאחר משלים כניסה של משתמשים וחוזר בו, אתה יכול לקבל את הכניסה תוצאה על ידי התקשרות getRedirectResult() :

      גרסת אינטרנט 9

      import { getAuth, getRedirectResult, OAuthProvider } from "firebase/auth";
      
      // Result from Redirect auth flow.
      const auth = getAuth();
      getRedirectResult(auth)
        .then((result) => {
          const credential = OAuthProvider.credentialFromResult(result);
          if (credential) {
            // You can also get the Apple OAuth Access and ID Tokens.
            const accessToken = credential.accessToken;
            const idToken = credential.idToken;
          }
          // The signed-in user info.
          const user = result.user;
        })
        .catch((error) => {
          // Handle Errors here.
          const errorCode = error.code;
          const errorMessage = error.message;
          // The email of the user's account used.
          const email = error.email;
          // The credential that was used.
          const credential = OAuthProvider.credentialFromError(error);
      
          // ...
        });

      גרסת אינטרנט 8

      // Result from Redirect auth flow.
      firebase
        .auth()
        .getRedirectResult()
        .then((result) => {
          if (result.credential) {
            /** @type {firebase.auth.OAuthCredential} */
            var credential = result.credential;
      
            // You can get the Apple OAuth Access and ID Tokens.
            var accessToken = credential.accessToken;
            var idToken = credential.idToken;
      
            // ...
          }
          // The signed-in user info.
          var user = result.user;
        })
        .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;
      
          // ...
        });

      זה גם המקום שבו אתה יכול לתפוס ולטפל בשגיאות. לקבלת רשימה של קודי שגיאה, לראות את התייחסות API .

    שלא כמו ספקים אחרים הנתמכים על ידי Firebase Auth, אפל אינה מספקת כתובת URL לתמונה.

    כמו כן, כאשר המשתמש בוחר לא לשתף הדוא"ל שלהם עם האפליקציה, הוראות אפלות כתוב דואר אלקטרונית ייחודית עבור משתמש זה (מהצורה xyz@privaterelay.appleid.com ), אשר בה מניות עם האפליקציה שלך. אם הגדרת את שירות ממסר הדוא"ל הפרטי, Apple מעבירה הודעות דוא"ל שנשלחו לכתובת האלמונית לכתובת הדוא"ל האמיתית של המשתמש.

    אפל רק פרטי משתמש מניות כגון שם תצוגה עם אפליקציות לראשונה שמשתמש נכנס. בדרך כלל, בחנויות Firebase את השם לתצוגה בפעם הראשונה שמשתמש נכנס עם אפל, שבו אתה יכול לקבל עם firebase.auth().currentUser.displayName . עם זאת, אם השתמשת בעבר ב- Apple כדי להיכנס למשתמש באפליקציה מבלי להשתמש ב- Firebase, אפל לא תספק ל- Firebase את שם התצוגה של המשתמש.

אימות מחדש וקישור חשבון

אותו הדפוס יכול לשמש עם reauthenticateWithPopup() ו reauthenticateWithRedirect() , שבו ניתן להשתמש כדי לשלוף תעודה טריה עבור פעולות רגישות הדורשות כניסה אחרונה:

גרסת אינטרנט 9

import { getAuth, reauthenticateWithPopup, OAuthProvider } from "firebase/auth";

// Result from Redirect auth flow.
const auth = getAuth();
const provider = new OAuthProvider('apple.com');

reauthenticateWithPopup(auth.currentUser, provider)
  .then((result) => {
    // User is re-authenticated with fresh tokens minted and can perform
    // sensitive operations like account deletion, or updating their email
    // address or password.

    // The signed-in user info.
    const user = result.user;

    // You can also get the Apple OAuth Access and ID Tokens.
    const credential = OAuthProvider.credentialFromResult(result);
    const accessToken = credential.accessToken;
    const idToken = credential.idToken;

    // ...
  })
  .catch((error) => {
    // Handle Errors here.
    const errorCode = error.code;
    const errorMessage = error.message;
    // The email of the user's account used.
    const email = error.email;
    // The credential that was used.
    const credential = OAuthProvider.credentialFromError(error);

    // ...
  });

גרסת אינטרנט 8

const provider = new firebase.auth.OAuthProvider('apple.com');

firebase
  .auth()
  .currentUser
  .reauthenticateWithPopup(provider)
  .then((result) => {
    // User is re-authenticated with fresh tokens minted and can perform
    // sensitive operations like account deletion, or updating their email
    // address or password.
    /** @type {firebase.auth.OAuthCredential} */
    var credential = result.credential;

    // The signed-in user info.
    var user = result.user;
     // You can also get the Apple OAuth Access and ID Tokens.
    var accessToken = credential.accessToken;
    var idToken = credential.idToken;

    // ...
  })
  .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;

    // ...
  });

וגם, אתה יכול להשתמש linkWithPopup() ו linkWithRedirect() , לקשר ספקי זהות שונים לחשבונות קיימים.

שים לב שאפל דורשת ממך לקבל הסכמה מפורשת ממשתמשים לפני שאתה מקשר את חשבונות Apple שלהם לנתונים אחרים.

לדוגמה, כדי לקשר חשבון פייסבוק לחשבון Firebase הנוכחי, השתמש באסימון הגישה שקיבלת מחיבור המשתמש לפייסבוק:

גרסת אינטרנט 9

import { getAuth, linkWithPopup, FacebookAuthProvider } from "firebase/auth";

const auth = getAuth();
const provider = new FacebookAuthProvider();
provider.addScope('user_birthday');

// Assuming the current user is an Apple user linking a Facebook provider.
linkWithPopup(auth.currentUser, provider)
    .then((result) => {
      // Facebook credential is linked to the current Apple user.
      // ...

      // The user can now sign in to the same account
      // with either Apple or Facebook.
    })
    .catch((error) => {
      // Handle error.
    });

גרסת אינטרנט 8

const provider = new firebase.auth.FacebookAuthProvider();
provider.addScope('user_birthday');

// Assuming the current user is an Apple user linking a Facebook provider.
firebase.auth().currentUser.linkWithPopup(provider)
    .then((result) => {
      // Facebook credential is linked to the current Apple user.
      // Facebook additional data available in result.additionalUserInfo.profile,

      // Additional Facebook OAuth access token can also be retrieved.
      // result.credential.accessToken

      // The user can now sign in to the same account
      // with either Apple or Facebook.
    })
    .catch((error) => {
      // Handle error.
    });

אימות באמצעות Firebase בתוסף Chrome

אם אתה בונה יישום תוסף Chrome, עליך להוסיף את מזהה תוסף Chrome שלך:

  1. פתח הפרויקט שלך קונסולת Firebase .
  2. במקטע אימות, לפתוח את דף הכניסה השיטה.
  3. הוספת URI כמו הבאה לרשימת הדומיינים שמורשים:
    chrome-extension://CHROME_EXTENSION_ID

רק פעולות קופצות ( signInWithPopup , linkWithPopup , ו reauthenticateWithPopup ) זמינים רחבים לכרום, כתוספות Chrome לא יכולות להשתמש HTTP הפניות. עליך לקרוא לשיטות אלה מתוך סקריפט של דף רקע ולא מחלון קופץ לפעולה בדפדפן, מכיוון שצץ האימות יבטל את חלונות הפעולה של הדפדפן. השיטות הקופצות אולי רק לשמש תוספים באמצעות מניפסט V2 . החדש יותר V3 המניפסט מאפשר סקריפטים רקע רק בצורה של עובדי שירות, אשר לא ניתן לבצע את הפעולות הקופצות בכלל.

הופכים את הקובץ במניפסט של תוסף Chrome שלך בטוח שאתה מוסיף את https://apis.google.com URL אל content_security_policy allowlist.

שים לב שעליך עדיין לאמת את הדומיין המותאם אישית עם Apple בדומה לדומיין ברירת המחדל של firebaseapp.com:

http://auth.custom.example.com/.well-known/apple-developer-domain-association.txt

מתקדם: אימות באמצעות Firebase ב- Node.js

לאימות עם Firebase ביישום Node.js:

  1. היכנס למשתמש באמצעות חשבון Apple שלו וקבל את אסימון מזהה Apple של המשתמש. אתה יכול להשיג זאת בכמה אופנים. לדוגמה, אם לאפליקציית Node.js שלך יש חזית דפדפן:

    1. בקצה האחורי שלך, צור מחרוזת אקראית ("nonce") וחשב את חשיש ה- SHA256 שלה. ה- nonce הוא ערך שימוש חד פעמי שבו אתה משתמש כדי לאמת נסיעה הלוך ושוב בין ה backend שלך לבין שרתי האימות של אפל.

      גרסת אינטרנט 9

      const crypto = require("crypto");
      const string_decoder = require("string_decoder");
      
      // Generate a new random string for each sign-in
      const generateNonce = (length) => {
        const decoder = new string_decoder.StringDecoder("ascii");
        const buf = Buffer.alloc(length);
        let nonce = "";
        while (nonce.length < length) {
          crypto.randomFillSync(buf);
          nonce = decoder.write(buf);
        }
        return nonce.substr(0, length);
      };
      
      const unhashedNonce = generateNonce(10);
      
      // SHA256-hashed nonce in hex
      const hashedNonceHex = crypto.createHash('sha256')
        .update(unhashedNonce).digest().toString('hex');

      גרסת אינטרנט 8

      const crypto = require("crypto");
      const string_decoder = require("string_decoder");
      
      // Generate a new random string for each sign-in
      const generateNonce = function(length) {
        const decoder = new string_decoder.StringDecoder("ascii");
        const buf = Buffer.alloc(length);
        var nonce = "";
        while (nonce.length < length) {
          crypto.randomFillSync(buf);
          nonce = decoder.write(buf);
        }
        return nonce.substr(0, length);
      };
      
      const unhashedNonce = generateNonce(10);
      
      // SHA256-hashed nonce in hex
      const hashedNonceHex = crypto.createHash('sha256')
        .update(unhashedNonce).digest().toString('hex');
    2. בדף הכניסה שלך, ציין את ה- nonce המוגזם בתצורת הכניסה שלך באמצעות Apple:

      <script src="https://appleid.cdn-apple.com/appleauth/static/jsapi/appleid/1/en_US/appleid.auth.js"></script>
      <div id="appleid-signin" data-color="black" data-border="true" data-type="sign in"></div>
      <script>
          AppleID.auth.init({
              clientId: YOUR_APPLE_CLIENT_ID,
              scope: 'name email',
              redirectURI: URL_TO_YOUR_REDIRECT_HANDLER,  // See the next step.
              state: '[STATE]',  // Optional value that Apple will send back to you
                                 // so you can return users to the same context after
                                 // they sign in.
              nonce: HASHED_NONCE  // The hashed nonce you generated in the previous step.
          });
      </script>
      
    3. קבל את אסימון מזהה Apple מצד שרת תגובת האימות POSTed:

      app.post('/redirect', (req, res) => {
        const savedState = req.cookies.__session;
        const code = req.body.code;
        const state = req.body.state;
        const appleIdToken = req.body.id_token;
        if (savedState !== state || !code) {
          res.status(403).send('403: Permission denied');
        } else {
          // Sign in with Firebase using appleIdToken. (See next step).
        }
      });
      

    ראה גם הגדרת תצורת האינטרנט שלך לצורך הכניסה עם אפל .

  2. לאחר שתקבל את אסימון מזהה Apple של המשתמש, השתמש בו לבניית אובייקט אישורים ולאחר מכן היכנס למשתמש עם האישור:

    גרסת אינטרנט 9

    import { getAuth, signInWithCredential, OAuthProvider } from "firebase/auth";
    
    const auth = getAuth();
    
    // Build Firebase credential with the Apple ID token.
    const provider = new OAuthProvider('apple.com');
    const authCredential = provider.credential({
      idToken: appleIdToken,
      rawNonce: unhashedNonce,
    });
    
    // Sign in with credential form the Apple user.
    signInWithCredential(auth, authCredential)
      .then((result) => {
        // User signed in.
      })
      .catch((error) => {
        // An error occurred. If error.code == 'auth/missing-or-invalid-nonce',
        // make sure you're sending the SHA256-hashed nonce as a hex string
        // with your request to Apple.
        console.log(error);
      });

    גרסת אינטרנט 8

    // Build Firebase credential with the Apple ID token.
    const provider = new firebase.auth.OAuthProvider('apple.com');
    const authCredential = provider.credential({
      idToken: appleIdToken,
      rawNonce: unhashedNonce,
    });
    
    // Sign in with credential form the Apple user.
    firebase.auth().signInWithCredential(authCredential)
      .then((result) => {
        // User signed in.
      })
      .catch((error) => {
        // An error occurred. If error.code == 'auth/missing-or-invalid-nonce',
        // make sure you're sending the SHA256-hashed nonce as a hex string
        // with your request to Apple.
        console.log(error);
      });

הצעדים הבאים

לאחר שמשתמש נכנס בפעם הראשונה, חשבון משתמש חדש נוצר ומקושר לאישורים - כלומר שם המשתמש והסיסמה, מספר הטלפון או פרטי ספק האישור - המשתמש נכנס איתו. חשבון חדש זה מאוחסן כחלק מפרויקט Firebase שלך, וניתן להשתמש בו כדי לזהות משתמש בכל אפליקציה בפרויקט שלך, ללא קשר לאופן בו המשתמש נכנס.

  • באפליקציות שלך, הדרך המומלצת לדעת את מצב האימות של המשתמש שלך היא להגדיר משקיף על Auth האובייקט. לאחר מכן תוכל לקבל את פרטי הפרופיל הבסיסיים של המשתמש מן User האובייקט. ראו ניהול משתמשים .

  • בבסיס הנתונים בזמן אמת Firebase שלך לאחסון בענן אבטחה חוקי , אתה יכול לקבל את שנכנסים למערכת זיהוי המשתמש הייחודי של המשתמש מן auth משתנה, ולהשתמש בו כדי לקבוע אילו נתונים גישה יכול משתמש.

תוכל לאפשר למשתמשים להיכנס לאפליקציה שלך דרך ספקי אימות מרובים על ידי מקשר auth אישורי ספק לחשבון משתמש קיים.

כדי לצאת מהחשבון משתמש, קוראים signOut :

גרסת אינטרנט 9

import { getAuth, signOut } from "firebase/auth";

const auth = getAuth();
signOut(auth).then(() => {
  // Sign-out successful.
}).catch((error) => {
  // An error happened.
});

גרסת אינטרנט 8

firebase.auth().signOut().then(() => {
  // Sign-out successful.
}).catch((error) => {
  // An error happened.
});