Firebase JS API auth - account-exists-with-different-credential

Question

We're having real problems trying to resolve this and so hoping for some Firebase assistance / those that have solved the same problem.

The app is React Native (0.43.2) and using Firebase JS API (latest)

We provide Facebook and Google auth. Works fine.

BUT, if a user:

1. signs in with Facebook (is ok)
2. later, signs in with Google (is also fine)
3. later, tries to sign in with Facebook - BOOM! not so fine and Firebase returns this error:

auth/account-exists-with-different-credential

From reading docs and a few posts on SO, we thought the following was correct but clearly not as we're getting the same auth error back.

...error returned by Firebase auth after trying Facebook login...  const email = error.email; const pendingCred = error.credential;  firebase.auth().fetchProvidersForEmail(email) .then(providers => {    //providers returns this array -> ["google.com"]    firebase.auth().signInWithCredential(pendingCred)    .then(result => {        result.user.link(pendingCred)    })    .catch(error => log(error)) 

The call to signInWithCredential is throwing the same error auth/account-exists-with-different-credential.

Can anyone help point out what we are doing wrong with this implementation? Greatly appreciated.

Answer 1

What is happening is that Firebase enforces a same account for all emails. As you already have a Google account for the same email, you need to link that Facebook account to the Google account so the user can access the same data and next time be able to sign in to the same account with either Google or Facebook.

The issue in your snippet is that you are signing and linking with the same credential. Modify as follows. When you get the error 'auth/account-exists-with-different-credential', the error will contain error.email and error.credential (Facebook OAuth credential). You need to first lookup the error.email to get the existing provider.

firebase.auth().fetchProvidersForEmail(error.email)   .then(providers => {     //providers returns this array -> ["google.com"]     // You need to sign in the user to that google account     // with the same email.     // In a browser you can call:     // var provider = new firebase.auth.GoogleAuthProvider();     // provider.setCustomParameters({login_hint: error.email});     // firebase.auth().signInWithPopup(provider)     // If you have your own mechanism to get that token, you get it     // for that Google email user and sign in     firebase.auth().signInWithCredential(googleCred)       .then(user => {         // You can now link the pending credential from the first         // error.         user.linkWithCredential(error.credential)       })       .catch(error => log(error))