ตรวจสอบสิทธิ์โดยใช้ Apple ด้วย JavaScript

คุณสามารถอนุญาตให้ผู้ใช้ตรวจสอบสิทธิ์กับ Firebase โดยใช้ Apple ID ได้โดยใช้ Firebase SDK เพื่อดำเนินการขั้นตอนการลงชื่อเข้าใช้ OAuth 2.0 แบบครบวงจร

ก่อนเริ่มต้น

หากต้องการให้ผู้ใช้ลงชื่อเข้าใช้โดยใช้ Apple ก่อนอื่นให้กำหนดค่าฟีเจอร์ลงชื่อเข้าใช้ด้วย Apple ในเว็บไซต์สำหรับนักพัฒนาแอปของ Apple แล้วเปิดใช้ Apple เป็นผู้ให้บริการลงชื่อเข้าใช้สำหรับโปรเจ็กต์ Firebase

เข้าร่วมโปรแกรม Developer Program ของ Apple

สมาชิกโปรแกรมนักพัฒนาแอปของ Appleเท่านั้นที่กำหนดค่าฟีเจอร์ลงชื่อเข้าใช้ด้วย Apple ได้

กำหนดค่าฟีเจอร์ลงชื่อเข้าใช้ด้วย Apple

ในเว็บไซต์สำหรับ นักพัฒนาแอปของ Apple ให้ทำดังนี้

  1. เชื่อมโยงเว็บไซต์กับแอปตามที่อธิบายไว้ในส่วนแรกของ หัวข้อกำหนดค่าฟีเจอร์ลงชื่อเข้าใช้ด้วย Apple สำหรับเว็บ เมื่อระบบแจ้ง ให้ลงทะเบียน URL ต่อไปนี้เป็น URL เปลี่ยนเส้นทาง

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

    คุณดูรหัสโปรเจ็กต์ Firebase ได้ใน Settings > แท็บ General ของคอนโซล Firebase

    เมื่อเสร็จแล้ว ให้จดรหัสบริการใหม่ ซึ่งคุณจะต้องใช้ใน ส่วนถัดไป

  2. สร้างคีย์ส่วนตัวสำหรับฟีเจอร์ ลงชื่อเข้าใช้ด้วย Apple คุณจะต้องใช้คีย์ส่วนตัวใหม่และคีย์ ID ในส่วนถัดไป
  3. หากคุณใช้ฟีเจอร์ใดๆ ของ Firebase Authentication ที่ส่งอีเมลถึงผู้ใช้ ซึ่งรวมถึงการลงชื่อเข้าใช้ด้วยลิงก์อีเมล การยืนยันอีเมล การเพิกถอนการเปลี่ยนแปลงบัญชี และอื่นๆ ให้กำหนดค่าบริการส่งต่ออีเมลส่วนตัวของ Apple และลงทะเบียน noreply@YOUR_FIREBASE_PROJECT_ID.firebaseapp.com (หรือโดเมนเทมเพลตอีเมลที่กำหนดเอง) เพื่อให้ Apple ส่งต่ออีเมลที่ส่งโดย Firebase Authentication ไปยังอีเมล Apple ที่ไม่ระบุตัวตน

เปิดใช้ Apple เป็นผู้ให้บริการลงชื่อเข้าใช้

  1. เพิ่ม Firebase ลงในโปรเจ็กต์
  2. ในคอนโซล Firebase ให้ไปที่ ความปลอดภัย > การตรวจสอบสิทธิ์
  3. ในแท็บวิธีการลงชื่อเข้าใช้ ให้เปิดใช้ผู้ให้บริการลงชื่อเข้าใช้ Apple ระบุรหัสบริการที่คุณสร้างไว้ในส่วนก่อนหน้า นอกจากนี้ ใน ส่วนการกำหนดค่าขั้นตอนการให้สิทธิ์ OAuth ให้ระบุรหัสทีม Apple และ คีย์ส่วนตัวและรหัสคีย์ที่คุณสร้างไว้ในส่วนก่อนหน้า

ปฏิบัติตามข้อกำหนดด้านข้อมูลที่ไม่ระบุตัวตนของ Apple

ฟีเจอร์ลงชื่อเข้าใช้ด้วย Apple ให้ตัวเลือกแก่ผู้ใช้ในการไม่ระบุตัวตนของข้อมูล ซึ่งรวมถึงอีเมลเมื่อลงชื่อเข้าใช้ ผู้ใช้ที่เลือกตัวเลือกนี้จะมีอีเมลที่มีโดเมน privaterelay.appleid.com เมื่อใช้ฟีเจอร์ลงชื่อเข้าใช้ด้วย Apple ในแอป คุณต้องปฏิบัติตามนโยบายหรือข้อกำหนดสำหรับนักพัฒนาแอปที่เกี่ยวข้องจาก Apple เกี่ยวกับ Apple ID ที่ไม่ระบุตัวตนเหล่านี้

ซึ่งรวมถึงการขอความยินยอมของผู้ใช้ที่จำเป็นก่อนที่คุณจะเชื่อมโยงข้อมูลส่วนบุคคลที่ระบุตัวตนได้โดยตรงกับ Apple ID ที่ไม่ระบุตัวตน เมื่อใช้การตรวจสอบสิทธิ์ Firebase การดำเนินการนี้อาจรวมถึงการดำเนินการต่อไปนี้

  • ลิงก์อีเมลกับ Apple ID ที่ไม่ระบุตัวตนหรือในทางกลับกัน
  • ลิงก์หมายเลขโทรศัพท์กับ Apple ID ที่ไม่ระบุตัวตนหรือในทางกลับกัน
  • ลิงก์ข้อมูลเข้าสู่ระบบโซเชียลที่ไม่ระบุตัวตน (Facebook, Google ฯลฯ) กับ Apple ID ที่ไม่ระบุตัวตนหรือในทางกลับกัน

รายการข้างต้นไม่ครอบคลุมทั้งหมด โปรดดูข้อตกลงใบอนุญาตโปรแกรมนักพัฒนาแอปของ Apple ในส่วนการเป็นสมาชิกของบัญชีนักพัฒนาแอปเพื่อให้แน่ใจว่าแอปของคุณเป็นไปตามข้อกำหนดของ Apple

จัดการขั้นตอนการลงชื่อเข้าใช้ด้วย Firebase SDK

หากคุณกำลังสร้างเว็บแอป วิธีที่ง่ายที่สุดในการตรวจสอบสิทธิ์ผู้ใช้ด้วย Firebase โดยใช้บัญชี Apple คือการจัดการขั้นตอนการลงชื่อเข้าใช้ทั้งหมดด้วย Firebase JavaScript SDK

หากต้องการจัดการขั้นตอนการลงชื่อเข้าใช้ด้วย Firebase JavaScript SDK ให้ทำตามขั้นตอนต่อไปนี้

  1. สร้างอินสแตนซ์ของ OAuthProvider โดยใช้รหัสผู้ให้บริการที่เกี่ยวข้อง apple.com

    Web

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

    Web

    var provider = new firebase.auth.OAuthProvider('apple.com');
  2. ไม่บังคับ: ระบุขอบเขต OAuth 2.0 เพิ่มเติมนอกเหนือจากค่าเริ่มต้นที่คุณต้องการขอจากผู้ให้บริการการตรวจสอบสิทธิ์

    Web

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

    Web

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

    โดยค่าเริ่มต้น เมื่อเปิดใช้1 บัญชีต่ออีเมล Firebase จะขอขอบเขตอีเมลและชื่อ หากคุณเปลี่ยนการตั้งค่านี้เป็น หลาย บัญชีต่ออีเมล Firebase จะไม่ขอขอบเขตใดๆ จาก Apple เว้นแต่คุณจะระบุ

  3. ไม่บังคับ: หากต้องการแสดงหน้าจอลงชื่อเข้าใช้ของ Apple ในภาษาอื่นที่ไม่ใช่ภาษาอังกฤษ ให้ตั้งค่าพารามิเตอร์ locale ดูภาษาที่รองรับได้ที่ เอกสารประกอบของฟีเจอร์ลงชื่อเข้าใช้ด้วย Apple

    Web

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

    Web

    provider.setCustomParameters({
      // Localize the Apple authentication screen in French.
      locale: 'fr'
    });
  4. ตรวจสอบสิทธิ์กับ Firebase โดยใช้ออบเจ็กต์ผู้ให้บริการ OAuth คุณสามารถแจ้งให้ผู้ใช้ลงชื่อเข้าใช้ด้วยบัญชี Apple โดยเปิดหน้าต่างป๊อปอัปหรือเปลี่ยนเส้นทางไปยังหน้าลงชื่อเข้าใช้ เราขอแนะนำให้ใช้วิธี Redirect Method ในอุปกรณ์เคลื่อนที่

    • หากต้องการลงชื่อเข้าใช้ด้วยหน้าต่างป๊อปอัป ให้เรียกใช้ signInWithPopup()

      Web

      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;
      
          // 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 credential that was used.
          const credential = OAuthProvider.credentialFromError(error);
      
          // ...
        });

      Web

      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;
      
          // IdP data available using getAdditionalUserInfo(result)
        // ...
        })
        .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, linkWithRedirect, หรือ reauthenticateWithRedirect

    Web

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

    Web

    firebase.auth().signInWithRedirect(provider);

    หลังจากที่ผู้ใช้ลงชื่อเข้าใช้เสร็จสมบูรณ์และกลับมาที่หน้าเว็บแล้ว คุณจะดูผลการลงชื่อเข้าใช้ได้โดยเรียกใช้ getRedirectResult()

    Web

    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.customData.email;
        // The credential that was used.
        const credential = OAuthProvider.credentialFromError(error);
    
        // ...
      });

    Web

    // 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;
    
          // IdP data available in result.additionalUserInfo.profile.
          // ...
        }
        // 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

    Apple ไม่ได้ให้ URL รูปภาพ ซึ่งแตกต่างจากผู้ให้บริการอื่นๆ ที่ Firebase Auth รองรับ

    นอกจากนี้ เมื่อผู้ใช้เลือกที่จะไม่แชร์อีเมลกับแอป Apple จะจัดเตรียมอีเมลที่ไม่ซ้ำกันสำหรับผู้ใช้รายนั้น (ในรูปแบบ xyz@privaterelay.appleid.com) ซึ่งจะแชร์กับแอปของคุณ หากคุณกำหนดค่าบริการส่งต่ออีเมลส่วนตัว Apple จะส่งต่ออีเมลที่ส่งไปยังอีเมลที่ไม่ระบุตัวตนไปยังอีเมลจริงของผู้ใช้

    Apple จะแชร์ข้อมูลผู้ใช้ เช่น ชื่อที่แสดง กับแอปเฉพาะในครั้งแรกที่ผู้ใช้ลงชื่อเข้าใช้ โดยปกติแล้ว Firebase จะจัดเก็บชื่อที่แสดงในครั้งแรกที่ผู้ใช้ลงชื่อเข้าใช้ด้วย Apple ซึ่งคุณดูได้ด้วย firebase.auth().currentUser.displayName อย่างไรก็ตาม หากก่อนหน้านี้คุณเคยใช้ Apple เพื่อให้ผู้ใช้ลงชื่อเข้าใช้แอปโดยไม่ได้ใช้ Firebase, Apple จะไม่ให้ชื่อที่แสดงของผู้ใช้แก่ Firebase

การตรวจสอบสิทธิ์อีกครั้งและการลิงก์บัญชี

คุณสามารถใช้รูปแบบเดียวกันกับ reauthenticateWithPopup() และ reauthenticateWithRedirect() ซึ่งใช้เพื่อดึงข้อมูลเข้าสู่ระบบใหม่สำหรับการดำเนินการที่ละเอียดอ่อนซึ่งต้องมีการลงชื่อเข้าใช้ล่าสุด

Web

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.customData.email;
    // The credential that was used.
    const credential = OAuthProvider.credentialFromError(error);

    // ...
  });

Web

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;

    // 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;

    // ...
  });

และคุณสามารถใช้ linkWithPopup() และ linkWithRedirect() เพื่อลิงก์ผู้ให้บริการข้อมูลประจำตัวต่างๆ กับบัญชีที่มีอยู่

โปรดทราบว่า Apple กำหนดให้คุณต้องได้รับความยินยอมอย่างชัดแจ้งจากผู้ใช้ก่อนที่จะลิงก์บัญชี Apple กับข้อมูลอื่นๆ

เช่น หากต้องการลิงก์บัญชี Facebook กับบัญชี Firebase ปัจจุบัน ให้ใช้โทเค็นเพื่อการเข้าถึงที่คุณได้รับจากการให้ผู้ใช้ลงชื่อเข้าใช้ Facebook

Web

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

Web

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 โปรดดูคำแนะนำเกี่ยวกับ เอกสารนอกหน้าจอ

โปรดทราบว่าคุณยังคงต้องยืนยันโดเมนที่กำหนดเองกับ Apple ในลักษณะเดียวกับโดเมน firebaseapp.com เริ่มต้น

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

การเพิกถอนโทเค็น

Apple กำหนดให้แอปที่รองรับการสร้างบัญชีต้องอนุญาตให้ผู้ใช้เริ่ม การลบบัญชีของตนเองภายในแอปตามที่อธิบายไว้ในแนวทางการตรวจสอบแอปใน App Store

หากต้องการให้เป็นไปตามข้อกำหนดนี้ ให้ทำตามขั้นตอนต่อไปนี้

  1. ตรวจสอบว่าคุณได้กรอกข้อมูลในส่วน รหัสบริการ และ การกำหนดค่า ขั้นตอนการให้สิทธิ์ OAuth ของการกำหนดค่าผู้ให้บริการลงชื่อเข้าใช้ด้วย Apple ตามที่ ระบุไว้ในส่วนกำหนดค่าฟีเจอร์ลงชื่อเข้าใช้ด้วย Apple

  2. เนื่องจาก Firebase ไม่ได้จัดเก็บโทเค็นของผู้ใช้เมื่อสร้างผู้ใช้ด้วยฟีเจอร์ลงชื่อเข้าใช้ด้วย Apple คุณจึงต้องขอให้ผู้ใช้ลงชื่อเข้าใช้อีกครั้งก่อนที่จะเพิกถอนโทเค็นและลบบัญชี

    จากนั้นรับโทเค็นเพื่อการเข้าถึง Apple OAuth จาก OAuthCredential แล้วใช้โทเค็นดังกล่าวเพื่อเรียกใช้ revokeAccessToken(auth, token) เพื่อเพิกถอนโทเค็นเพื่อการเข้าถึง Apple OAuth

    const provider = new OAuthProvider('apple.com');
    provider.addScope('email');
    provider.addScope('name');
    
    const auth = getAuth();
    signInWithPopup(auth, provider).then(result => {
      // Get the Apple OAuth access token.
      const credential = OAuthProvider.credentialFromResult(result);
      const accessToken = credential.accessToken;
    
      // Revoke the Apple OAuth access token.
      revokeAccessToken(auth, accessToken)
        .then(() => {
          // Token revoked.
    
          // Delete the user account.
          // ...
        })
        .catch(error => {
          // An error happened.
          // ...
        });
    });
    
  3. สุดท้าย ให้ลบบัญชีผู้ใช้ (และข้อมูลที่เชื่อมโยงทั้งหมด )

ขั้นสูง: ตรวจสอบสิทธิ์กับ Firebase ใน Node.js

หากต้องการตรวจสอบสิทธิ์กับ Firebase ในแอปพลิเคชัน Node.js ให้ทำดังนี้

  1. ให้ผู้ใช้ลงชื่อเข้าใช้ด้วยบัญชี Apple และรับโทเค็น Apple ID ของผู้ใช้ คุณทำได้หลายวิธี เช่น หากแอป Node.js มีส่วนหน้าของเบราว์เซอร์ ให้ทำดังนี้

    1. สร้างสตริงแบบสุ่ม ("Nonce") ในแบ็กเอนด์และคำนวณแฮช SHA256 ของสตริงดังกล่าว Nonce เป็นค่าที่ใช้ครั้งเดียวเพื่อตรวจสอบการเดินทางไปกลับครั้งเดียวระหว่างแบ็กเอนด์กับเซิร์ฟเวอร์การตรวจสอบสิทธิ์ของ Apple

      Web

      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.slice(0, length);
      };
      
      const unhashedNonce = generateNonce(10);
      
      // SHA256-hashed nonce in hex
      const hashedNonceHex = crypto.createHash('sha256')
        .update(unhashedNonce).digest().toString('hex');

      Web

      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.slice(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 ID จากการตอบกลับการตรวจสอบสิทธิ์ที่ POST ไปยังเซิร์ฟเวอร์

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

    ดูเพิ่มเติมที่การกำหนดค่าหน้าเว็บสำหรับการลงชื่อเข้าใช้ด้วย Apple

  2. หลังจากได้รับโทเค็น Apple ID ของผู้ใช้แล้ว ให้ใช้โทเค็นดังกล่าวเพื่อสร้างออบเจ็กต์ข้อมูลเข้าสู่ระบบ แล้วให้ผู้ใช้ลงชื่อเข้าใช้ด้วยข้อมูลเข้าสู่ระบบ

    Web

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

    Web

    // 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 และใช้เพื่อระบุผู้ใช้ในทุกแอปในโปรเจ็กต์ได้ ไม่ว่าผู้ใช้จะลงชื่อเข้าใช้ด้วยวิธีใดก็ตาม

  • ในแอป วิธีที่แนะนำในการดูสถานะการตรวจสอบสิทธิ์ของผู้ใช้คือการตั้งค่า Observer ในออบเจ็กต์ 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.
});