RefreshToken not working (auth module 4.9.1 with OpenID Connect (OIDC) and Keycloak)

[mpgalaxy]

Version

v4.9.1

Reproduction link

https://jsfiddle.net/

Steps to reproduce

Install nuxt auth module and configure it for OpenID Connect with Keycloak, including options for token refreshing

What is expected ?

token is being refreshed automatically

What is actually happening?

token expires and user is being logged out

Additional comments?

I'm using the auth module v4.9.1 with OpenID Connect (OIDC) and Keycloak, but the token refresh doesn't seem to be working. Could you please provide me with a hint or a working template for OIDC regarding refreshToken ?

This is my configuration:

[
      '@nuxtjs/auth',
      {        
        watchLoggedIn: true,
        resetOnError: true,
        redirect: {
          login: '/login',
          logout: '/',
          callback: '/login',
          home: '/welcome'
        },
        vuex: {
          namespace: 'auth'
        },
        strategies: {
          keycloak: {
            _scheme: 'oauth2',
            authorization_endpoint: xxx ($keycloakAuthEndpoint)
            access_token_endpoint: xxx ($keycloakTokenEndpoint)
            userinfo_endpoint: xxx ($keycloakUserinfoEndpoint)
            scope: ['openid'],
            response_type: 'code',
            grant_type: 'authorization_code',
            client_id: xxx ($clientId),
            refreshToken: {
              property: 'refresh_token',
              maxAge: 60 * 60 * 3,
              prefix: '_refresh_token.',
              expirationPrefix: '_refresh_token_expiration.'
            }
          },
...

_{This bug report is available on Nuxt community (#c690)}

[rwd]

We have faced the very same issue this past week, with v4.9.1.

After digging into the source code, it became apparent that while v5 of this module may introduce support for automatic refreshing of access tokens using refresh tokens, v4 it seems does not, despite storing the refresh token, and that refreshToken is not a supported configuration option for a strategy in v4.

In order to work around this until v5 has a stable release, we created a module plugin. Add that to your project directory, and supply to Nuxt Auth plugins.

The accompanying strategy configuration in nuxt.config.js uses:

...
  grant_type: 'authorization_code',
  response_type: 'code',
  access_type: 'online'
...

(Of which grant_type was not obvious as is not documented, so thank you @mpgalaxy for the hint on that.)

In addition, in the configuration of the client in Keycloak itself, we had to:

• Disable implicit flow
• Set access type to "public"
• Set web origins to permit CORS requests from your Nuxt app's deployment URLs, or to + if these are already configured as "Valid Redirect URIs"

This works well for us, catching 401s from Keycloak when access tokens have expired, using the refresh token to gain a new access token, and then retrying the original failed request.

This took us quite some time to get working, so I hope it may help you, or others.

[JoaoPedroAS51]

Hi @rwd! Refresh token support has been added in v5. We now recommend using v5 instead of v4. See status and #893

Docs here: https://auth.nuxtjs.org/schemes/oauth2