motia/nuxt-auth-refresh

An ad-hoc module to periodically refresh @nuxtjs/auth for the local scheme.

An ad-hoc module to periodically refresh @nuxtjs/auth for the local scheme.

Setup

• Install the npm package

npm install @motia/nuxt-auth-refresh
# or 
yarn add @motia/nuxt-auth-refresh

• Register the module before @nuxtjs/auth and @nuxtjs/axios

// nuxt.config.js
buildModules: [
    ['@motia/nuxt-auth-refresh', config.refreshAuth],
],
modules: [
    ['@nuxtjs/auth', config.auth],
    ['@nuxtjs/axios', config.axios],
]

The module will automatically start the refresh interval after logging in.

• Add a client side plugin to start the refresh interval for users authenticated from stored token.

// ~/plugins/refresh-auth-token.js
export default ({app, store}) => {
    await (
        app.$auth.loggedIn ? app.$auth.fetchUserOnce().catch((e) => {}) : null
    )

    if(app.$auth.user) {
        app.$authRefresh.initRefreshInterval()
    }
}

// nuxt.config.js
auth: {
    plugins: [
        { src: '~/plugins/refresh-auth-token', ssr: false }
    ]
}

• You can attach an error handler for the refresh attempts

app.$authRefresh.onRefreshError((e) => {
    // handle the token refresh here
})

Options

{
  // the namespace for our vuex module
  vuexNamespace: 'refreshAuth',

  // a key used to store the refresh token
  storageKey: 'my_refresh_token_key',

  // the link for login
  loginUrl: '/auth/login',

  // access token key in login success response and refresh request
  accessTokenKey: 'access_token',

  // refresh token key in login success response and refresh request
  refreshTokenKey: 'refresh_token',
}

nuxt-auth-refresh's Issues

$authRefresh is undefined

I've copied the refresh-auth-token.js plugin from the README and this doesn't work as $authRefresh is undefined inside the plugin.

nuxt 2.14.0 with@nuxtjs/auth 4.9.1.

modules: [
    'nuxt-auth-refresh',
    '@nuxtjs/auth',
    '@nuxtjs/axios',
],
auth: {
    plugins: [
        '~/plugins/refresh-auth-token', // prevents "$auth is undefined"
    ],
    strategies: {
        // ...
    },
},

How to use with Auth module and Google provider

Cai I use it with the Auth module and Google provider?
Would you mind to provide an example?

NPM package not up-to-date

Thanks for the great plugin!

Is it possible the NPM package is outdated? Based on your readme file, I get following package: https://www.npmjs.com/package/nuxt-auth-refresh

Unfortunately, it's only version 1.1.0. There is another one at https://www.npmjs.com/package/@switchautomation/nuxt-auth-refresh. But again, this one is at 1.2.1.

config is not defined

there is no var config in the scope config.refreshAuth , config.auth and config.axios

buildModules: [
    ['@motia/nuxt-auth-refresh', config.refreshAuth],
],
modules: [
    ['@nuxtjs/auth', config.auth],
    ['@nuxtjs/axios', config.axios],
]

yarn dev
yarn run v1.22.4
$ cross-env NODE_ENV=development nuxt

 FATAL  config is not defined

  ReferenceError: config is not defined
  at Object.<anonymous> (nuxt.config.js:34:34)
  at Generator.next (<anonymous>)


   ╭───────────────────────────────────────────╮
   │                                           │
   │   ✖ Nuxt Fatal Error                      │
   │                                           │
   │   ReferenceError: config is not defined   │
   │                                           │
   ╰───────────────────────────────────────────╯

error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

How to install?

Please could you add some instructions for how to install this module?

• Is there an NPM package?
• What is ~/modules/refresh-auth, and where is it from? Is it a config file I have to create?