feat(auth): added onIdTokenChanged() handlers to auth.initialize

Added onIdTokenChanged() handlers to auth.initialize

re #411

Author: lupas

docs/content/en/service-options/auth.md

@@ -30,15 +30,15 @@ Set firebase auth persistence, see [here](https://firebase.google.com/docs/auth/
 
 ## initialize
 
-This sets up an `onAuthStateChanged()` listener and hooks it up to the vuex store.
+This sets up an `onAuthStateChanged()` and/or `onIdTokenChanged()` listener and hooks them up to the vuex store.
 
 Just add a mutation/action to your vuex store ([as seen below](#onauthstatechangedmutation)) that handles what to do with the authUser object (e.g. save it to the state or get user data from FireStore) and then define the name of the action/mutation in the `firebase.services.auth.initialize` configuration as above.
 
 <alert type="info">You can also use namespaces for your store actions/mutations like so: `onAuthStateChangedAction: 'namespaceName/actionName'`.</alert>
 
-When onAuthStateChanged() gets triggered by Firebase, the defined mutation/action will be called with the `authUser` and `claims` attributes as [as seen below](#onauthstatechangedmutation)
+When `onAuthStateChanged()` or `onIdTokenChanged()` get triggered by Firebase, the defined mutation/action will be called with the `authUser` and `claims` attributes as [as seen below](#onauthstatechangedmutation)
 
-To unsubscribe from the listener simply call the `$fireAuthStore.unsubscribe()` function.
+To unsubscribe from both listeners simply call the `$fireAuthStore.unsubscribe()` function.
 
 <alert type="warning">This does not work in *lazy-mode*, since auth is not initialized. If you want to use this option in lazy-mode, call the *authReady()* function in a separate plugin.</alert>
 
@@ -86,6 +86,21 @@ onAuthStateChangedAction: (ctx, { authUser, claims }) => {
 }
 ```
 
+### onIdTokenChangedAction
+
+Same as `onAuthStateChangedAction`, but also gets triggered when the idToken changes (e.g. expires).
+
+<alert type="warning">
+The Firebase SDK automatically refreshed your id token, so this option shall only be used if you use the idToken for custom authentication scenarios.
+</alert>
+
+### onIdTokenChangedMutation
+
+Same as `onAuthStateChangedMutation`, but also gets triggered when the idToken changes (e.g. expires).
+
+<alert type="warning">
+The Firebase SDK automatically refreshed your id token, so this option shall only be used if you use the idToken for custom authentication scenarios.
+</alert>
 ### subscribeManually
 
 By settings `subscribeManually: true`, the `onAuthStateChanged()` listener won't be set up until you call it manually:

lib/plugins/services/auth.js

@@ -1,5 +1,12 @@
 <% const { serviceMapping, serviceOptions, writeImportStatement } = options %>
 
+<% const hasOnAuthStateChangedMutation = (typeof serviceOptions.initialize.onAuthStateChangedMutation === 'string') %>
+<% const hasOnAuthStateChangedAction = (typeof serviceOptions.initialize.onAuthStateChangedAction === 'string') %>
+<% const hasOnAuthStateChanged = (hasOnAuthStateChangedMutation || hasOnAuthStateChangedAction) %>
+<% const onIdTokenChangedMutation = (typeof serviceOptions.initialize.onIdTokenChangedMutation === 'string') %>
+<% const onIdTokenChangedAction = (typeof serviceOptions.initialize.onIdTokenChangedAction === 'string') %> 
+<% const hasIdTokenChanged = (onIdTokenChangedMutation || onIdTokenChangedAction) %>
+
 export default async function (session, firebase, ctx, inject) {
 
   <% if (!serviceOptions.static) { %>    
@@ -42,32 +49,52 @@ export default async function (session, firebase, ctx, inject) {
   // Sets up a listener, mutations and action for every onAuthStateChanged by Firebase.
   const fireAuthStore = {
     unsubscribe() {
-      if (this.off) {
-        this.off()
-        delete this.off
+      if (this.unsubscribeAuthStateListener) {
+        this.unsubscribeAuthStateListener()
+        delete this.unsubscribeAuthStateListener
+      }
+      if (this.unsubscribeIdTokenListener) {
+        this.unsubscribeIdTokenListener()
+        delete this.unsubscribeIdTokenListener
       }
     },
     subscribe() {
-      if (this.off) {
-        // already subscribed
-        return
-      }
 
+      <% if (hasOnAuthStateChanged && !this.unsubscribeAuthStateListener) { %>
       return new Promise(resolve => {
-        this.off = authService.onAuthStateChanged(async authUser => {
+        this.unsubscribeAuthStateListener = authService.onAuthStateChanged(async authUser => {
           const claims = authUser ? (await authUser.getIdTokenResult(true)).claims : null
 
-          <% if (typeof serviceOptions.initialize.onAuthStateChangedMutation === 'string') { %>
-            ctx.store.commit(<%= serialize(serviceOptions.initialize.onAuthStateChangedMutation) %>, { authUser, claims })
+          <% if (hasOnAuthStateChangedMutation) { %>
+          ctx.store.commit(<%= serialize(serviceOptions.initialize.onAuthStateChangedMutation) %>, { authUser, claims })
           <% } %>
 
-          <% if (typeof serviceOptions.initialize.onAuthStateChangedAction === 'string') { %>
+          <% if (hasOnAuthStateChangedAction) { %>
           await ctx.store.dispatch(<%= serialize(serviceOptions.initialize.onAuthStateChangedAction) %>, { authUser, claims })
           <% } %>
 
           resolve()
         })
       })
+      <% } %>
+
+      <% if (hasIdTokenChanged && !this.unsubscribeIdTokenListener) { %>
+      return new Promise(resolve => {
+        this.unsubscribeIdTokenListener = authService.onIdTokenChanged(async authUser => {
+          const claims = authUser ? (await authUser.getIdTokenResult(true)).claims : null
+
+          <% if (onIdTokenChangedMutation) { %>
+          ctx.store.commit(<%= serialize(serviceOptions.initialize.onIdTokenChangedMutation) %>, { authUser, claims })
+          <% } %>
+
+          <% if (onIdTokenChangedAction) { %>
+          await ctx.store.dispatch(<%= serialize(serviceOptions.initialize.onIdTokenChangedAction) %>, { authUser, claims })
+          <% } %>
+
+          resolve()
+        })
+      })
+      <% } %>
     }
   }
   inject('fireAuthStore', fireAuthStore)

types/index.d.ts

@@ -38,6 +38,8 @@ export interface AuthServiceConfig extends ServiceConfig {
   initialize?: {
     onAuthStateChangedMutation?: string
     onAuthStateChangedAction?: string
+    onIdTokenChangedMutation?: string
+    onIdTokenChangedAction?: string
     subscribeManually?: boolean
   }