Fix bug when authentication middleware fails to renew the token

web-frontend/modules/core/middleware/authenticated.js

@@ -11,7 +11,6 @@ export default function ({ req, store, route, redirect }) {
     if (req) {
       query.original = encodeURI(req.originalUrl)
     }
-
     return redirect({ name: 'login', query })
   }
 

web-frontend/modules/core/middleware/authentication.js

@@ -3,18 +3,21 @@ import {
   setToken,
 } from '@baserow/modules/core/utils/auth'
 
-export default function ({ store, req, app, route }) {
+export default function ({ store, req, app, route, redirect }) {
   // If nuxt generate or already authenticated, pass this middleware
   if ((process.server && !req) || store.getters['auth/isAuthenticated']) return
 
-  // session token (if any) can be in the query param (if SSO) or in the cookies
+  // token can be in the query string (SSO) or in the cookies (previous session)
   let refreshToken = route.query.token
   if (refreshToken) {
     setToken(app, refreshToken)
   } else {
     refreshToken = getTokenIfEnoughTimeLeft(app)
   }
+
   if (refreshToken) {
-    return store.dispatch('auth/refresh', refreshToken)
+    return store.dispatch('auth/refresh', refreshToken).catch(() => {
+      return redirect({ name: 'login' })
+    })
   }
 }

web-frontend/modules/core/plugins/clientHandler.js

@@ -414,7 +414,6 @@ export function makeErrorResponseInterceptor(
 
     // user session expired. Redirect to login page to start a new session.
     if (rspData?.error === 'ERROR_INVALID_REFRESH_TOKEN') {
-      store.dispatch('auth/setUserSessionExpired', true)
       nuxtErrorHandler({ statusCode: 401, message: 'User session expired' })
       return Promise.reject(error)
     }

web-frontend/modules/core/store/auth.js

@@ -147,27 +147,32 @@ export const actions = {
    * new refresh timeout. If unsuccessful the existing cookie and user data is
    * cleared.
    */
-  async refresh({ commit, getters }, token = null) {
+  async refresh({ commit, getters, dispatch }, token = null) {
     const refreshToken = token || getters.refreshToken
     if (!refreshToken) {
       throw new Error('Invalid refresh token')
     }
 
-    const tokenUpdatedAt = new Date().getTime()
-    const rsp = await AuthService(this.$client).refresh(refreshToken)
-    if (!rsp) {
-      return // invalid refresh token
-    }
-
-    // if ROTATE_REFRESH_TOKEN=False in the backend the response will not contain
-    // a new refresh token. In that case we keep the old originally one stored in the cookie.
-    commit('SET_USER_DATA', {
-      refresh_token: refreshToken,
-      tokenUpdatedAt,
-      ...rsp.data,
-    })
-    if (!getters.getPreventSetToken && rsp.data.refresh_token) {
-      setToken(this.app, getters.refreshToken)
+    try {
+      const tokenUpdatedAt = new Date().getTime()
+      const { data } = await AuthService(this.$client).refresh(refreshToken)
+      // if ROTATE_REFRESH_TOKEN=False in the backend the response will not contain
+      // a new refresh token. In that case, we keep the one we just used.
+      commit('SET_USER_DATA', {
+        refresh_token: refreshToken,
+        tokenUpdatedAt,
+        ...data,
+      })
+      if (!getters.getPreventSetToken && data.refresh_token) {
+        setToken(this.app, getters.refreshToken)
+      }
+    } catch (error) {
+      unsetToken(this.app)
+      unsetGroupCookie(this.app)
+      if (getters.isAuthenticated) {
+        dispatch('setUserSessionExpired', true)
+      }
+      throw error
     }
   },
   /**
@@ -209,6 +214,8 @@ export const actions = {
     commit('SET_PREVENT_SET_TOKEN', true)
   },
   setUserSessionExpired({ commit }, value) {
+    unsetToken(this.app)
+    unsetGroupCookie(this.app)
     commit('SET_USER_SESSION_EXPIRED', value)
   },
 }
@@ -265,7 +272,7 @@ export const getters = {
     return state.preventSetToken
   },
   isUserSessionExpired: (state) => {
-    return state.authenticated && state.userSessionExpired
+    return state.userSessionExpired
   },
 }