how integrate auth0 with firebase

[leftjs]

Hi, Atinux
I am a sincere fan of nuxt
I wanna use firebase with nuxt to build my static page, but firebase don't have any token after doing below code

firebase.auth().signInWithEmailAndPassword(email, password).catch(function(error) {
  // Handle Errors here.
  var errorCode = error.code;
  var errorMessage = error.message;
  // ...
});

I can't see it return any token that I can save it to resume my status that has logged In. so I think about using auth0 and using auth0's delegation to generate a exchange token, and use this token to log in firebase, and save the exchange token to record my firebase status, so I add these code in your code

var lock = new Auth0Lock('YOUR-AUTH0-CLIENT-ID', 'YOUR-AUTH0-DOMAIN.auth0.com');
  var auth0 = new Auth0({ domain : 'YOUR-AUTH0-DOMAIN.auth0.com', clientID: 'YOUR-AUTH0-CLIENT-ID'})

  // Display the default lock widget
   lock.show();

  // listen to when the user gets authenticated and then save the profile
   lock.on("authenticated", function(authResult) {
      lock.getProfile(authResult.idToken, function(error, profile) {

        if (error) {
          // handle error
          return;
        }

        localStorage.setItem('profile', JSON.stringify(profile))

        // Set the options to retreive a firebase delegation token
        var options = {
          id_token : authResult.idToken,
          api : 'firebase',
          scope : 'openid name email displayName',
          target: 'YOUR-AUTH0-CLIENT-ID'
        };

        // Make a call to the Auth0 '/delegate'
        auth0.getDelegationToken(options, function(err, result) {
          if(!err) {
            // Exchange the delegate token for a Firebase auth token
            firebase.auth().signInWithCustomToken(result.id_token).catch(function(error) {
              console.log(error);
            });
          }
        });
      });
    });

but it can't achieve my goal, it seem lock.on() don't receive some events or function show() has exited before receiving some event. I have three questions , please give me some advice.

1. In nuxt, where can I write some code that can run or listen for some event all the time, like lock.on(), have some best practice ?
2. After logging In auth0 and having logged in firebase , I can get the auth0 access token and exchange token , but both of these have expiration second, default 3600s. I save these token to localsStorage and cookie, and depend on these token null or not-null to decide user whether logged in , but how can I judge these token whether has expired, where is best place to add these code, plugin or middleware or custom directory like utils ? I have a little puzzle.
3. I see you give some advice about using firebase with ssr like vue-hackernews 2.0 https://github.com/vuejs/vue-hackernews-2.0/blob/master/src/store/create-api-server.js
   I think about use process.__FIREBASE__ to save firebase instance, but I think it don't match nuxt philosophy, how to save it in my whole application

_{This question is available on Nuxt.js community (#c3)}

[josantana]

Hi @leftjs. I'm using Firebase too and my setup with Nuxt is close to be complete. I'm not using Auth0 or Firebase on the client side because Firebase's library is super heavy (almost 450kb for auth plus database, not gzipped). I'm using firebase-admin on the server side along with Passport.js. Now my build size is acceptable. I don't know if this setup makes sense to you. I think I'll share an example of what I'm doing soon.

[grifjef]

@josantana how'd that example come out?