I'm using NuxtJS's auth module and trying to get the Bearer token and a custom cookie that contains a sessionType on nuxtServerInit so I can update the store with a mutation, but it only works when I reload the page.

If I close the browser and go directly to my app url, I keep getting undefined for auth._token.local because nuxtServerInit executes before the cookies are ready.

My code in store/index.js looks like this:

export const actions = {
  async nuxtServerInit({ mit, dispatch }, { req }) {
    // Parse cookies with cookie-universal-nuxt
    const token = this.$cookies.get('token')
    const sessionType = this.$cookies.get('sessionType')

   // Check if Cookie user and token exists to set them in 'auth'
    if (token && user) {
      mit('auth/SET_TOKEN', token)
      mit('auth/SET_SESSION_TYPE', user)
    }
  }
}

I'm using nuxt-universal-cookies library.

What's the way to execute the action after the cookies are loaded on the browser?

I'm using NuxtJS's auth module and trying to get the Bearer token and a custom cookie that contains a sessionType on nuxtServerInit so I can update the store with a mutation, but it only works when I reload the page.

If I close the browser and go directly to my app url, I keep getting undefined for auth._token.local because nuxtServerInit executes before the cookies are ready.

My code in store/index.js looks like this:

export const actions = {
  async nuxtServerInit({ mit, dispatch }, { req }) {
    // Parse cookies with cookie-universal-nuxt
    const token = this.$cookies.get('token')
    const sessionType = this.$cookies.get('sessionType')

   // Check if Cookie user and token exists to set them in 'auth'
    if (token && user) {
      mit('auth/SET_TOKEN', token)
      mit('auth/SET_SESSION_TYPE', user)
    }
  }
}

I'm using nuxt-universal-cookies library.

What's the way to execute the action after the cookies are loaded on the browser?

• javascript
• vue.js
• nuxt.js

• what cookie library are you using? – Ohgodwhy Commented Sep 23, 2019 at 15:23
• I'm using nuxt-universal-cookies. Sorry, I've already edited my question. – SiliconMachine Commented Sep 23, 2019 at 15:42

2 Answers 2

Having it work with F5 and not by hitting enter makes me suspect that it just works sometimes and sometimes it doesn't, because F5 and Enter should trigger same behaviour on Nuxt (apart from some cache headers).

The only suspicious thing about you code is the usage of an async function when the function is not returning or awaiting any promise.

So you either await for an action

export const actions = {
  async nuxtServerInit({ mit, dispatch }, { req }) {
    // Parse cookies with cookie-universal-nuxt
    const token = this.$cookies.get('token')
    const sessionType = this.$cookies.get('sessionType')

   // Check if Cookie user and token exists to set them in 'auth'
    if (token && user) {
      await dispatch('SET_SESSION', {token, user})
      //mit('auth/SET_TOKEN', token)
      //mit('auth/SET_SESSION_TYPE', user)
    }
  }
}

or you remove the async from the declaration

export const actions = {
  nuxtServerInit({ mit, dispatch }, { req }) {
    // Parse cookies with cookie-universal-nuxt
    const token = this.$cookies.get('token')
    const sessionType = this.$cookies.get('sessionType')

   // Check if Cookie user and token exists to set them in 'auth'
    if (token && user) {
      mit('auth/SET_TOKEN', token)
      mit('auth/SET_SESSION_TYPE', user)
    }
  }
}

I've had the same issue and found out that nuxtServerInit is triggered first before the cookie was set like via a express middleware.