'Nuxt Auth Module c5 doesn't refresh token automatically when token expires

Version

module: 5.0.0-1624817847.21691f1 nuxt: 2.15.8

Nuxt configuration

  • Universal

Nuxt configuration

// Auth: https://auth.nuxtjs.org/ (v5)
auth: {
  redirect: {
    login: '/account/login/',
    logout: '/account/login/',
    callback: '/account/login/',
    home: '/account/beams/'
  },
  strategies: {
    local: {
      scheme: 'refresh',
      token: {
        property: 'access_token',
        maxAge: 120, // seconds, 2 minutes
        global: true
      },
      refreshToken: {
        property: 'refresh_token',
        data: 'refresh_token',
        maxAge: 1209600 // seconds, 2 weeks
      },
      user: {
        property: 'user',
        autoFetch: true
      },
      endpoints: {
        login: { url: '/api/account/login', method: 'post', propertyName: 'token' },
        refresh: { url: '/api/account/refresh', method: 'post', },
        logout: { url: '/api/account/logout', method: 'post' },
        user: { url: '/api/account', method: 'get' }
      },
      autoLogout: false
    }
  }
},

Additional information

Checklist

  • [x] I have tested with the latest Nuxt version and the issue still occurs
  • [x] I have tested with the latest module version and the issue still occurs
  • [x] I have searched the issue tracker and this issue hasn't been reported yet

Steps to reproduce

What is expected?

When a user's token expires and refresh scheme is implemented, a user shouldn't be logged out and redirected back to the login screen, the refresh token should be used to obtain a new token and the transition should be seamless allowing any authenticated route to continue to work.

What is actually happening?

In my Nuxt project with the Auth module I've implemented the refresh scheme, however, when my token expires I don't see any request in my network being made to the refresh route after my token expires and I navigate to a protected page via the auth middleware.

I expect I'm missing some simple configuration?

My current token has an expiry of 1 minute for testing, and my refresh token has an expiry of 14 days for testing.

However, when adding:

  • scheme: 'refresh'
  • refresh: { url: '/api/account/refresh', method: 'post', }

the functionality appears to not be fetching my user and automatically logging me in.

My /api/account/refresh endpoint in my API returns the following:

{
  refresh_token: 'my refresh token',
  token_type: 'bearer',
  expired_in: 5000
}

My /api/account/login endpoint in my API returns the following:

{
  access_token: 'my token',
  token_type: 'bearer',
  expired_in: 1000
}

What am I missing?



Solution 1:[1]

You need to return refresh token from /api/account/login. And then set in conf property name of it.

Solution 2:[2]

I have same issue with very similar comfiguration. This is my result from API (I added refresh token to the result):

{
    "access_token": "XXX",
    "refresh_token": "XXX", 
    "expired_in": 3600,
    "token_type": "bearer"
}

If I inspect cookies, I can see acces token, but refresh token does not set:

Cookie list after login

I try to manually set refresh token after login, but with same result:

const result = await this.$auth.loginWith('local', {
  data: this.login,
})

this.$auth.setUserToken(result.data.accessToken, result.data.refreshToken)

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 user68978
Solution 2 David Prokop