Refresh token not working on oauth2 scheme with IdentityServer4

[andoni97]

I am currently developing an application in Nuxtjs, I added @nuxtjs/auth to handle the login and refresh token login but the refresh token expires and never refreshes. Configuration in my nuxt.config.ts

auth: {
  strategies: {
    social: {
      scheme: 'oauth2',
      endpoints: {
        authorization: 'https://sts.azurewebsites.net/connect/authorize',
        token: 'https://sts.azurewebsites.net/connect/token',
        refresh: { url: 'https://sts.azurewebsites.net/connect/token', method: 'post' },
        userInfo: 'https://sts.azurewebsites.net/connect/userinfo',
        logout: 'https://sts.azurewebsites.net/connect/endsession',
      },
      token: {
        property: 'access_token',
        type: 'Bearer',
        maxAge: 3600,
      },
      refreshToken: {
        property: 'refresh_token',
        data: 'refresh_token',
        maxAge: 60 * 60 * 24 * 30
      },
      responseType: 'code',
      grantType: 'authorization_code',
      accessType: 'offline',
      redirectUri: 'http://localhost:4200/login/authorize',
      logoutRedirectUri: 'http://localhost:4200/login/logout',
      clientId: 'biggie-webapp',
      clientSecret: '37d4wJcSqaFhzvNWIdqk',
      scope: [
        'openid',
        'email',
        'phone',
        'role',
        'user',
        'customers',
        'locations',
        'catalog',
        'ordering',
        'cart',
        'profile',
        '-payments',
      ],
      state: 'omitted',
      // codeChallengeMethod: '',
      // responseMode: '',
      // acrValues: '',
      secure: true,
      // autoLogout: false
    },
  }},
}

The login function I call:

await this.$auth.loginWith('social')
The function that I call after the login redirect:

async mounted() {
  const strategy = this.$auth.strategy as any
  const query = this.$auth.ctx.query as any
  const params = new URLSearchParams()
  params.append('code', query.code)
  params.append('client_id', strategy.options.clientId)
  params.append('client_secret', strategy.options.clientSecret)
  params.append('redirect_uri', strategy.options.redirectUri)
  params.append('grant_type', strategy.options.grantType)
  const result = await this.$axios.$post(
    strategy.options.endpoints.token,
    params,
    {
      headers: {
        'Content-Type': 'application/x-www-form-urlencoded',
      },
    }
  )
  await this.$auth.setUserToken(result.access_token, result.refresh_token)
  await this.$router.push('/')
},

My package.json:

{
  "name": "biggie",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "dev": "nuxt-ts",
    "build": "nuxt-ts build",
    "start": "nuxt-ts start",
    "generate": "nuxt-ts generate"
  },
  "dependencies": {
    "@nuxt/typescript-runtime": "^2.0.1",
    "@nuxtjs/auth-next": "5.0.0-1622918202.e815752",
    "@nuxtjs/axios": "^5.13.1",
    "axios": "^0.21.1",
    "core-js": "^3.8.3",
    "lodash": "^4.17.21",
    "nuxt": "^2.14.12",
    "vue-debounce": "^2.6.0",
    "vue-router": "^3.5.1"
  },
  "devDependencies": {
    "@nuxt/types": "^2.15.7",
    "@nuxt/typescript-build": "^2.1.0",
    "@nuxtjs/device": "^2.0.1",
    "@nuxtjs/vuetify": "^1.11.3"
  }
}

But for some strange reason after 15 to 20 minutes the access token expires and is not refreshed.
Thanks in advance for the help

[mpgalaxy]

I had the same problem with keycloak also using oauth2, same version of auth-next. For all people running into similar problems with keycloak: make sure to set the timeouts for SSO session idle and max a lot greater than token lifespan. After doing this it worked perfectly fine. Btw: If you use apollo graphql client you can use this with auth-next to set your token:

...
getAuth: () =>
      app.$auth.refreshTokens().then((result) => {
        return result.data.access_token
      }),
...

This is not the best solution but a good starting point. ;)
hth