在Firebase中处理链接帐户

Question

我正在遵循Firebase的社交登录说明。下面是我正在使用的示例，从登录身份验证角度来看，它们都可以正常工作。

但是，我有Google和Facebook登录独立工作。

我现在想做的是链接帐户。实际上，您可以在下面看到它的去向（请参阅注释）：

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

我已经尝试了许多我认为应该在此处进行的修改，但均无济于事。有人可以指导我有关他们认为应该去这里的事情吗？谢谢！

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

Answer 1

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

你会得到那个错误 getRedirectResult().catch(function(error) {})

该错误还将包含电子邮件和凭据字段。您需要保存凭证（使用推荐的 sessionStorage）。查看这篇文章了解更多信息： Firebase Authentication Javascript: setCookie for pending Credential for redirect

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

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

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

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

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