Firebase re-authenitcate user. How to get correct token?

I’m working on chrome extension (provides main functionality) and the complementary website (mostly profile and billing related functionality) both backed with firebase backend.

I’m wondering if it’s possible to implement the below scenario:

  • user logs in with the extension using firebase authentication (with firebaseUI lib)
  • I store a token that I can use to reauthenticate that user (is there such a token?)
  • when user opens the website, I login that user automatically with the token.

While both the extension and the website has their login/signup forms I’m wondering if it’s possible to login user in the extension and to somehow automatically login that same user on the website so they don’t have to enter their credentials twice?

So far I was hoping that I could use something like below:

firebase.auth().currentUser.getIdToken(true).then(function(idToken) {
            console.log("idToken = ", idToken)
})

And then to use that idToken like this, since if I understand correctly, it’s an AWT:

firebase.auth().signInWithCustomToken(idToken).catch(function(error) {
    // Handle Errors here.
     var errorCode = error.code;
     var errorMessage = error.message;
     console.log("signInWithCustomToken: error = ", error)
 })

But it gives the following error:

code: "auth/invalid-custom-token"
message: "The custom token format is incorrect. Please check the documentation."

I can parse the token on https://jwt.io/ which shows all the user information but in the end it says “invalid signature”

So I guess this token can be only used to check authentication (like admin.auth().verifyIdToken(idToken)) but not to login user. Am I right?

I know I can create a custom token, but is there any straightforward way to workaround that and to login user from one place only using firebase funstionality? (of course without storing username/password)

Firebase UI in Chrome extension: signInSuccess never called

It drives me mad, so posting it here after 3 wasted days of applying “drop-in” auth solution. Hopefully, anyone can shed any light on what I’m missing.

Basically I’ve setup faribes app in the dashboard and successfully inited farebase in my chrome extension. When I drop firebasUI for email/password authentication, it seems to work fine – it successfully checks if email exists or not and shows the respective flow. For signup, it creates a user in firebase database once the flow is completed.

The problem is that signInSuccess is never called neither in signin nor in signup flow.
Moreover firebase.auth().onAuthStateChanged(...) always returns null user

If I use plain signInWithEmailAndPassword() / createUserWithEmailAndPassword() everything works fine and onAuthStateChanged() returns the correct user.

Below is the code I’m using in the chrome extension:

credentials.js (popup script):

//init firebase
var config = {
    apiKey: "",
    authDomain: "",
    databaseURL: "",
    projectId: "",
    storageBucket: "",
    messagingSenderId: ""
};
firebase.initializeApp(config);


//ui config for firebaseUI
var uiConfig = {
    signInSuccessUrl: 'http://google.com',
    credentialHelper: firebaseui.auth.CredentialHelper.NONE,
    callbacks: {
        signInSuccess: function(currentUser, credential, redirectUrl) {
            console.log('sign in success');
            console.log(currentUser);
            // alert(currentUser)
            return false;
        },
        uiShown: function () {
            console.log("uiShow");
        }
    },
    signInFlow: 'popup',
    signInOptions: [{
        provider: firebase.auth.EmailAuthProvider.PROVIDER_ID,
        requireDisplayName: false
    }]
};

//launch the firebaseUI flow
var ui = new firebaseui.auth.AuthUI(firebase.auth());
ui.start('#firebaseui-auth-container', uiConfig);

credentials.html (popup html):




  
  Sample FirebaseUI App
  
  
  
  




Welcome to My Awesome App

manifest:

{
  "manifest_version": 2,
  "name": "Some Name",
  "description": "Some description",
  "version": "0.1",
  "icons": {
    "128": "icon.png"
  },
  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "credentials.html"
  },
  "background": {
    "page": "background.html"
  },
  "permissions": [
    "identity",
    "https://*/*",
    "activeTab",
    "background"
  ],

  "content_security_policy":"script-src 'self' https://www.gstatic.com https://apis.google.com https://www.googleapis.com https://securetoken.googleapis.com https://*.firebaseio.com https://cdn.firebase.com https://www.google.com; object-src 'self'",

  "oauth2": {
    "client_id": "",
    "scopes": [
      "https://www.googleapis.com/auth/userinfo.email",
      "https://www.googleapis.com/auth/userinfo.profile"
    ]
  },
  "key":""
}

Note: seems like I can put any client_id and it doesn’t make any difference (firebaseUI doesn’t work and firebase works anyway)

I was following this github steps and used the code base from the repo

Any input is much appreciated.