Auth-module: Not being redirected after login/logout

[sergiocastrovale]

Hello,

I'm not being redirected after I login or logout. If I refresh the page, the middleware seems to kick in and redirect me to the right place, but shouldn't it redirect me after I run the dispatches?

Here's an example for my logout:

    async logout () {
      await this.$store.dispatch('auth/logout')
    }

My (auto-generated) auth.middleware.js is as follows:

middleware.auth = function authMiddleware ({ store, redirect }) {
  // If user not logged in, redirect to /login
  if (!store.getters['auth/loggedIn']) {
    return redirect('/users/login')
  }
}

middleware['no-auth'] = function noAuthMiddleware ({ store, redirect }) {
  // If user is already logged in, redirect to /
  if (store.getters['auth/loggedIn']) {
    return redirect('/books/collection')
  }
}

And I have them included in my nuxt.config.js:

  router: {
    middleware: [
      'auth',
      'no-auth'
    ]
  },

  auth: {
    user: {
      endpoint: 'auth/user',
      propertyName: '',
      resetOnFail: true
    },
    login: {
      endpoint: '/auth/login'
    },
    logout: {
      endpoint: '/auth/logout',
      method: 'GET'
    },
    redirect: {
      notLoggedIn: '/users/login',
      loggedIn: '/books/collection'
    },
    token: {
      enabled: true,
      type: 'Bearer',
      localStorage: true,
      name: 'token',
      cookie: true,
      cookieName: 'token'
    }
  },

Shouldn't I be redirected to /users/login after clicking the logout button?

_{This feature request is available on Nuxt.js community (#c15)}

[sergiocastrovale]

After digging into the package's code, it's clear that what I was assuming wasn't the expected behavior, but shouldn't it be? I mean, as I see it:

• If you're trying to login from the login form and it works, you should go to redirect.loggedIn
• If you're trying to login after being redirected from somewhere else, #7 should apply

To add to this, how can I present any error messages if the login fails?

[alvintran]

Hey @sergiocastrovale , you can try this code:

methods: {
  login() {
    this.$store.dispatch("auth/login", {
        fields: this.credentials
      }).then(() => window.location.reload())
  }
}

:)

[mr-e-]

The only way to fix this is to hard refresh the whole page? Is there not a more SPA way of doing this?

[sergiocastrovale]

Yeah @alvintran's solution is a bit ... old school-ish. Wish we could use a better alternative.

[rojerv]

You can use:

await this.$store.dispatch('auth/login', {fields: {username, password}})
        if (!this.$store.getters['auth/loggedIn']) {
          this.message = 'Error'
        } else {
          this.$router.push('/auth/user')
        }

[alphaelf]

reference to this

[breakingrobot]

Closing as this was fixed on 7112b21 - v4.0.0-rc.0
Please review the 4.0 documentation and migration guide