CODEWITHSUNDEEP
javascriptfirebaseauthenticationfirebase-authentication
Cellestial
Cellestial

Reputation: 71

Firebase authentication error: auth/invalid-credential

I've been experimenting with the authentication service provided by firebase for more than 2 weeks. Everything was perfectly working until yesterday it became impossible for me to use the facebook auth provider neither twitter to make users connect to my web app.

I've tried to sign out and sign in, I deleted my facebook and twitter apps and created others even with other accounts and the problem persists.

The same problem occurred when I tried to use the code they provide on their github which was working before.

The strange thing is that it's working fine when I use the google provider or the sign in with email and password method.

PS: I made sure the providers are enabled in the console.

const signInWithFacebookButton = document.getElementById('signInWithFacebook');

const auth = firebase.auth();

const signInWithFacebook = () => {

  const facebookProvider = new firebase.auth.FacebookAuthProvider();

  auth.signInWithPopup(facebookProvider)
  .then(() => {
    console.log('Successfully signed in');
  })
  .catch(error => {
    console.error(error);
  })
}

signInWithFacebookButton.addEventListener('click', signInWithFacebook);

Error message when I try to authenticate using facebook :

{code: "auth/invalid-credential", message: "The supplied auth credential is malformed or has expired."}

Error message when I try to authenticate using twitter:

{code: "auth/invalid-credential", message: "Error getting request token: 403 <?xml version="1.…ode-project-fd88e.firebaseapp.com/__/auth/handler"}

Upvotes: 7

Views: 24916

Answers (2)

Pandemonium
Pandemonium

Reputation: 8390

This is worth as an answer: Always click to show your Facebook app secret before copying and pasting it into Firebase setting console. It is counter-intuitive, but Facebook did not implement the clipboard correctly so the hidden asterisk characters will just be copied and pasted verbatim.

Upvotes: -3

Abhinav Kinagi
Abhinav Kinagi

Reputation: 3801

For Twitter login, the error code 403 indicates that access to the URL by the client is Forbidden. It gives such an error because you have to whitelist callback URLs(your site).

From documentation,

As part of our continued effort to ensure safety and security on the Twitter developer platform, any developer using Sign in with Twitter must explicitly declare their callback URLs in a whitelist in the Twitter apps settings which can be accessed in the apps dashboard when logged into your Twitter account on developer.twitter.com. This means that if the callback_url parameter used with the oauth/request_token endpoint isn't whitelisted, you will receive an error.

So in Twitter app settings, you have to add your URL say for example, https://sitename.example.com/auth/twitter and https://sitename.example.com/auth/twitter/callback

Refer this community article for more detail:- Twitter callback URLs

Upvotes: 3

Related Questions