在 Firebase 中处理关联帐户 [英] Handling linking accounts in Firebase

问题描述

我正在遵循 Firebase 关于社交登录的说明.下面是我正在使用的示例，从登录身份验证的角度来看，一切正常.

I am following Firebase's instruction on social login. Below is an example of what I am using and it is all working fine from a login authentication perspective.

但是，我同时使用 Google 和 Facebook 登录独立工作.

I have, however, both Google and Facebook login working independently.

我现在希望能够做的是关联帐户.实际上，您可以在下面看到这可能会发生在哪里(查看评论):

What I would like now to be able to do is link the accounts. You can see below in fact where this might go (see the comment):

如果您在应用中使用多个身份验证提供程序，则应在此处处理用户帐户的链接.

If you are using multiple auth providers on your app you should handle linking the user's accounts here.

我尝试了许多我认为应该放在这里的变体，但无济于事.任何人都可以指导我他们认为应该去这里的内容吗?谢谢！

I have tried many variations of what I think should go here, but to no avail. Can anyone guide me in relation to what they think should go here? Thanks!

function initFBApp() {
    // Result from Redirect auth flow.
    // [START getidptoken]
    firebase.auth().getRedirectResult().then(function (result) {
        if (result.credential) {
            // This gives you a Facebook Access Token. You can use it to access the Facebook API.
            var token = result.credential.accessToken;
            // [START_EXCLUDE]
            document.getElementById('FBquickstart-oauthtoken').textContent = token;
        }
        else {
            document.getElementById('FBquickstart-oauthtoken').textContent = 'null';
            // [END_EXCLUDE]
        }
        // The signed-in user info.
        var user = result.user;
    }).catch(function (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;
        // [START_EXCLUDE]
        if (errorCode === 'auth/account-exists-with-different-credential') {
            alert('You have already signed up with a different auth provider for that emails.');
            // If you are using multiple auth providers on your app you should handle linking
            // the user's accounts here.
        }
        else {
            console.error(error);
        }
        // [END_EXCLUDE]
    });
    // [END getidptoken]
    // Listening for auth state changes.
    // [START authstatelistener]
    firebase.auth().onAuthStateChanged(function (user) {
        if (user) {
            // User is signed in.
            var displayName = user.displayName;
            var email = user.email;
            var emailVerified = user.emailVerified;
            var photoURL = user.photoURL;
            var isAnonymous = user.isAnonymous;
            var uid = user.uid;
            var providerData = user.providerData;
            // [START_EXCLUDE]
            document.getElementById('FBquickstart-sign-in-status').textContent = 'Signed in';
            document.getElementById('FBquickstart-sign-in').textContent = 'Log out';
            document.getElementById('FBquickstart-account-details').textContent = JSON.stringify(user, null, '  ');
            // [END_EXCLUDE]
        }
        else {
            // User is signed out.
            // [START_EXCLUDE]
            document.getElementById('FBquickstart-sign-in-status').textContent = 'Signed out';
            document.getElementById('FBquickstart-sign-in').textContent = 'Log in with Facebook';
            document.getElementById('FBquickstart-account-details').textContent = 'null';
            document.getElementById('FBquickstart-oauthtoken').textContent = 'null';
            // [END_EXCLUDE]
        }
        // [START_EXCLUDE]
        document.getElementById('FBquickstart-sign-in').disabled = false;
        // [END_EXCLUDE]
    });
    // [END authstatelistener]
    document.getElementById('FBquickstart-sign-in').addEventListener('click', toggleFBSignIn, false);
}

推荐答案

这些是如何处理 auth/account-exists-with-different-credential 的大致步骤:如果您使用另一个已存在帐户的电子邮件登录新的 Facebook 帐户，则会收到该错误.假设现有帐户是 Google 帐户.

These are roughly the steps on how to handle auth/account-exists-with-different-credential: You will get that error if you are signing in to a new Facebook account that uses the email of another account that already exists. Let's say the existing account is a google account.

你会在 getRedirectResult().catch(function(error) {})

该错误还将包含电子邮件和凭据字段.您需要保存凭证(使用推荐的 sessionStorage).查看此帖子了解更多信息:Firebase Authentication Javascript:setCookie 用于重定向的待定凭据

The error will also contain an email and credential field. You will need to save the credential (using the recommended sessionStorage). Check this post for more on that: Firebase Authentication Javascript: setCookie for pending Credential for redirect

然后调用 firebase.auth().fetchProvidersForEmail(error.email) 来确定该电子邮件已经存在的提供商.

You then call firebase.auth().fetchProvidersForEmail(error.email) to determine the providers that already exist for that email.

然后，您将登录这些现有提供商之一，并声明该电子邮件与 error.email 相同.成功后，您将从 sessionStorage 加载挂起的凭据，按照另一篇文章中的描述重新初始化并将其链接到 currentUser:

You will then sign in to one of those existing providers and assert that the email is the same as error.email. On success, you will load the pending credential from sessionStorage, re-initialize as described in the other post and link it to the currentUser:

firebase.auth().currentUser.linkWithCredential(savedCred);

您现在将关联两个帐户.请记住，现有提供程序可能是密码类型.在这种情况下，您不需要保存凭据，只需向用户询问密码并使用相同的电子邮件 error.email 登录即可.然后您可以直接使用 error.credential 调用链接.

You will now have both accounts linked. Keep in mind the existing provider could be a password type. In that case you don't need to save the credential, you just ask the user for the password and sign them in using the same email error.email. You can then call link directly with the error.credential.

顺便说一句，我推荐 firebaseui-web，它会为您处理所有这些:https://github.com/firebase/firebaseui-web

BTW, I recommend firebaseui-web which takes care of all this for you: https://github.com/firebase/firebaseui-web

这篇关于在 Firebase 中处理关联帐户的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！