Use RefreshToken after AccessToken is expired to renew Login

[janpfischer]

Hi all :)

I having trouble to understand the integration of the "refresh" scheme in auth-next. For now I have a login flow working and the refresh_token is also stored in localState. I can receive a new token with "this.$auth.refreshTokens()".

My refresh token endpoint is not protected with the access_token so I think I do not need something like suggested here: #924

Now I would like to achieve this:
If the access_token is expired but the refresh_token is not, auth should ask the refresh endpoint for a new access_token and do not sign the user off.
So you can be still loged on if you open the page one day later for example.
But when the access_token is expired, auth do not call the refresh api and I simply get logged of.

With the suggestions of the above issue I created a custom scheme with following code:

if(Date.now() > this.token._getExpiration() && Date.now () < this.token.scheme.refreshToken._getExpiration()) {
        console.log("Token expired, getting new one")
        console.log(this.token.scheme.refreshToken)
        this.refreshController.handleRefresh().then((e) => {
          console.log(e)
        console.log("Refreshed!")
        }).catch((e) => console.log(e))
      }

My idea is that if the acces_token is expired and the refresh_token is not I call the handleRefresh() function. Sometimes this seems to be working, but it is not very robust as it messed up some tokens from time to time.

So my question would be if there is some sort of other method I am simply missing like an option in the module configuration. Or maybe a good way to try to get a new access_token before signing off because of acces_token expiration.

My config looks like:

auth: {
    redirect: {
      home: "/user",
      logout: "/user",
      login: "/user",
    },
    strategies: {
      local: {
        //scheme: "refresh",
        scheme: "~/schemes/test",
        token: {
          property: "access_token",
          maxAge: 1800,
        },
        refreshToken: {
          property: "refresh_token",
          data: "refresh_token",
          maxAge: 60 * 60 * 24 * 2,
          //tokenRequired: true,
        },
        user: {
          property: false,
          autoFetch: false
        },
        autoLogout: true,
        endpoints: {
          login: {
            url: "/user/login",
            method: "post",
          },
          logout: {
            url: "/user/logout",
            method: "post",
          },
          user: {
            url: "/user/data",
            method: "get",
          },
          refresh: {
            url: "/user/refresh",
            method: "post",
          },
        },
      },
    },
  },

Thanks a lot!

[JoaoPedroAS51]

Hi @b1rdhous3! You just need to set autoLogout to false

When true, if the token has expired, it will prevent the token from being refreshed on load the page and force logout the user.

[janpfischer]

Hi @JoaoPedroAS51,
wow thank you sooo much! I must have missed or misundersood that one line in the explanation of autoLogout.
Now it works like a charm. I simply switched it to false and the scheme back to default "refresh".
Thanks again!

Maybe it would make sense if we could make that notice a little more prominent in the Docs because it is a crucial part of getting refresh working (even if "autoLogout" is false by default)

[JoaoPedroAS51]

I'm happy to know it's working now! Closing here then :)

[GarciaTandela]

Hello, i'm facing the same issue, i even put autoLogout: false, but still when my access token expires refresh token doesn't get the new token automatically.