پیوند دادن چند ارائه‌دهنده اصالت‌سنجی به یک حساب بااستفاده از جاوا اسکریپت

می‌توانید به کاربران اجازه دهید با پیوند دادن اطلاعات اعتباری ارائه‌دهنده اصالت‌سنجی به حساب کاربری موجود، بااستفاده از چندین ارائه‌دهنده اصالت‌سنجی به سیستم برنامه‌تان وارد شوند. کاربران صرف‌نظر از ارائه‌دهنده اصالت‌سنجی که برای ورود به سیستم استفاده کرده‌اند، با همان شناسه کاربر Firebase قابل‌شناسایی هستند. برای مثال، کاربری که با گذرواژه به سیستم وارد شده است می‌تواند «حساب Google» را پیوند دهد و در آینده با هریک از این روش‌ها به سیستم وارد شود. یا، کاربر ناشناسی می‌تواند حساب Facebook را پیوند دهد و سپس، بعداً با Facebook به سیستم وارد شود تا به استفاده از برنامه شما ادامه دهد.

قبل از شروع

پشتیبانی از دو یا چند ارائه‌دهنده اصالت‌سنجی (احتمالاً شامل اصالت‌سنجی ناشناس) را به برنامه‌تان اضافه کنید.

برای پیوند دادن اطلاعات اعتباری از ارائه‌دهنده احراز هویت مثل Google یا Facebook به حساب کاربری موجود:

  1. کاربر را بااستفاده از هر روش یا ارائه‌دهنده اصالت‌سنجی به سیستم وارد کنید.
  2. شیء AuthProvider را که با ارائه‌دهنده موردنظر شما برای پیوند دادن به حساب کاربر مطابقت دارد دریافت کنید. مثال‌ها:

    Web

    import { GoogleAuthProvider, FacebookAuthProvider, TwitterAuthProvider, GithubAuthProvider } from "firebase/auth";
    
    const googleProvider = new GoogleAuthProvider();
    const facebookProvider = new FacebookAuthProvider();
    const twitterProvider = new TwitterAuthProvider();
    const githubProvider = new GithubAuthProvider();

    Web

    var googleProvider = new firebase.auth.GoogleAuthProvider();
    var facebookProvider = new firebase.auth.FacebookAuthProvider();
    var twitterProvider = new firebase.auth.TwitterAuthProvider();
    var githubProvider = new firebase.auth.GithubAuthProvider();
  3. از کاربر بخواهید با ارائه‌دهنده‌ای که می‌خواهید پیوند دهید به سیستم وارد شود. می‌توانید کاربرانتان را ترغیب کنید که با باز کردن پنجره بالاپر یا با هدایت شدن به صفحه ورود به سیستم ارائه‌دهنده به سیستم وارد شوند. روش هدایت در دستگاه‌های همراه ترجیح داده می‌شود.
    • برای ورود به سیستم با پنجره بالاپر، با linkWithPopup تماس بگیرید:

      Web

      import { getAuth, linkWithPopup, GoogleAuthProvider } from "firebase/auth";
      const provider = new GoogleAuthProvider();
      
      const auth = getAuth();
      linkWithPopup(auth.currentUser, provider).then((result) => {
        // Accounts successfully linked.
        const credential = GoogleAuthProvider.credentialFromResult(result);
        const user = result.user;
        // ...
      }).catch((error) => {
        // Handle Errors here.
        // ...
      });

      Web

      auth.currentUser.linkWithPopup(provider).then((result) => {
        // Accounts successfully linked.
        var credential = result.credential;
        var user = result.user;
        // ...
      }).catch((error) => {
        // Handle Errors here.
        // ...
      });
    • برای ورود به سیستم با هدایت به صفحه ورود به سیستم ارائه‌دهنده، با linkWithRedirect: هنگام استفاده از `linkWithRedirect`، روال‌های مطلوب را دنبال کنید.

      Web

      import { getAuth, linkWithRedirect, GoogleAuthProvider } from "firebase/auth";
      const provider = new GoogleAuthProvider();
      
      const auth = getAuth();
      linkWithRedirect(auth.currentUser, provider)
        .then(/* ... */)
        .catch(/* ... */);

      Web

      auth.currentUser.linkWithRedirect(provider)
        .then(/* ... */)
        .catch(/* ... */);
      پس‌از اینکه کاربر وارد سیستم شد، به صفحه شما هدایت می‌شود. سپس، می‌توانید نتیجه ورود به سیستم را با فراخوانی getRedirectResult هنگام بار شدن صفحه بازیابی کنید:

      Web

      import { getRedirectResult } from "firebase/auth";
      getRedirectResult(auth).then((result) => {
        const credential = GoogleAuthProvider.credentialFromResult(result);
        if (credential) {
          // Accounts successfully linked.
          const user = result.user;
          // ...
        }
      }).catch((error) => {
        // Handle Errors here.
        // ...
      });

      Web

      auth.getRedirectResult().then((result) => {
        if (result.credential) {
          // Accounts successfully linked.
          var credential = result.credential;
          var user = result.user;
          // ...
        }
      }).catch((error) => {
        // Handle Errors here.
        // ...
      });
    اگر کاربر باموفقیت به سیستم وارد شود، حساب کاربر نزد ارائه‌دهنده به حساب کاربر در پروژه Firebase شما پیوند داده می‌شود.

    اگر اطلاعات اعتباری ازقبل به حساب کاربری دیگری پیوند داده شده باشد، پیوند حساب ناموفق خواهد بود. در این وضعیت، باید ادغام حساب‌ها و داده‌های منسوب را به‌نحوی که برای برنامه‌تان مناسب است انجام دهید:

    Web

    import { getAuth, signInWithCredential, linkWithCredential, OAuthProvider } from "firebase/auth";
    
    // The implementation of how you store your user data depends on your application
    const repo = new MyUserDataRepo();
    
    // Get reference to the currently signed-in user
    const auth = getAuth();
    const prevUser = auth.currentUser;
    
    // Get the data which you will want to merge. This should be done now
    // while the app is still signed in as this user.
    const prevUserData = repo.get(prevUser);
    
    // Delete the user's data now, we will restore it if the merge fails
    repo.delete(prevUser);
    
    // Sign in user with the account you want to link to
    signInWithCredential(auth, newCredential).then((result) => {
      console.log("Sign In Success", result);
      const currentUser = result.user;
      const currentUserData = repo.get(currentUser);
    
      // Merge prevUser and currentUser data stored in Firebase.
      // Note: How you handle this is specific to your application
      const mergedData = repo.merge(prevUserData, currentUserData);
    
      const credential = OAuthProvider.credentialFromResult(result);
      return linkWithCredential(prevUser, credential)
        .then((linkResult) => {
          // Sign in with the newly linked credential
          const linkCredential = OAuthProvider.credentialFromResult(linkResult);
          return signInWithCredential(auth, linkCredential);
        })
        .then((signInResult) => {
          // Save the merged data to the new user
          repo.set(signInResult.user, mergedData);
        });
    }).catch((error) => {
      // If there are errors we want to undo the data merge/deletion
      console.log("Sign In Error", error);
      repo.set(prevUser, prevUserData);
    });

    Web

    // The implementation of how you store your user data depends on your application
    var repo = new MyUserDataRepo();
    
    // Get reference to the currently signed-in user
    var prevUser = auth.currentUser;
    
    // Get the data which you will want to merge. This should be done now
    // while the app is still signed in as this user.
    var prevUserData = repo.get(prevUser);
    
    // Delete the user's data now, we will restore it if the merge fails
    repo.delete(prevUser);
    
    // Sign in user with the account you want to link to
    auth.signInWithCredential(newCredential).then((result) => {
      console.log("Sign In Success", result);
      var currentUser = result.user;
      var currentUserData = repo.get(currentUser);
    
      // Merge prevUser and currentUser data stored in Firebase.
      // Note: How you handle this is specific to your application
      var mergedData = repo.merge(prevUserData, currentUserData);
    
      return prevUser.linkWithCredential(result.credential)
        .then((linkResult) => {
          // Sign in with the newly linked credential
          return auth.signInWithCredential(linkResult.credential);
        })
        .then((signInResult) => {
          // Save the merged data to the new user
          repo.set(signInResult.user, mergedData);
        });
    }).catch((error) => {
      // If there are errors we want to undo the data merge/deletion
      console.log("Sign In Error", error);
      repo.set(prevUser, prevUserData);
    });

برای افزودن اطلاعات اعتباری گذرواژه و نشانی ایمیل به حساب کاربری موجود:

  1. کاربر را بااستفاده از هر روش یا ارائه‌دهنده اصالت‌سنجی به سیستم وارد کنید.
  2. از کاربر بخواهید نشانی ایمیل و گذرواژه جدیدی وارد کند.
  3. شیء AuthCredential را با نشانی ایمیل و گذرواژه ایجاد کنید:

    Web

    import { EmailAuthProvider } from "firebase/auth";
    
    const credential = EmailAuthProvider.credential(email, password);

    Web

    var credential = firebase.auth.EmailAuthProvider.credential(email, password);
  4. شیء AuthCredential را به روش linkWithCredential کاربر واردشده به سیستم ارسال کنید:

    Web

    import { getAuth, linkWithCredential } from "firebase/auth";
    
    const auth = getAuth();
    linkWithCredential(auth.currentUser, credential)
      .then((usercred) => {
        const user = usercred.user;
        console.log("Account linking success", user);
      }).catch((error) => {
        console.log("Account linking error", error);
      });

    Web

    auth.currentUser.linkWithCredential(credential)
      .then((usercred) => {
        var user = usercred.user;
        console.log("Account linking success", user);
      }).catch((error) => {
        console.log("Account linking error", error);
      });

    اگر اطلاعات اعتباری ازقبل به حساب کاربری دیگری پیوند داده شده باشد، تماس با linkWithCredential ناموفق خواهد بود. در این وضعیت، باید ادغام حساب‌ها و داده‌های منسوب را به‌گونه‌ای که برای برنامه‌تان مناسب است انجام دهید (به مثال بالا مراجعه کنید).

یک حساب کاربری Firebase می‌تواند چندین ارائه‌دهنده اصالت‌سنجی پیوندشده داشته باشد (برای مثال، ایمیل/گذرواژه، Google،‏ Facebook)، که به کاربر امکان می‌دهد ازطریق روش‌های مختلف به همان حساب Firebase وارد شود.

اگر ارائه‌دهنده اصالت‌سنجی را از حساب کاربری لغو پیوند کنید، کاربر دیگر نمی‌تواند با آن ارائه‌دهنده به سیستم وارد شود.

برای لغو پیوند ارائه‌دهنده اصالت‌سنجی از حساب کاربر، شناسه ارائه‌دهنده را به متد unlink ارسال کنید. می‌توانید شناسه‌های ارائه‌دهنده ارائه‌دهندگان اصالت‌سنجی پیوندشده به کاربر را از دارایی providerData دریافت کنید.

Web

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

const auth = getAuth();
unlink(auth.currentUser, providerId).then(() => {
  // Auth provider unlinked from account
  // ...
}).catch((error) => {
  // An error happened
  // ...
});

Web

user.unlink(providerId).then(() => {
  // Auth provider unlinked from account
  // ...
}).catch((error) => {
  // An error happened
  // ...
});

عیب‌یابی

اگر هنگام تلاش برای پیوند دادن چند حساب با خطا مواجه شدید، مستندات مربوط به نشانی‌های ایمیل تأییدشده را ببینید.