Auth-module: loggedIn set to false after refresh

[fanckush]

loggedIn is stored in the store (vuex) and so when i refresh the page i am logged out because i suppose loggedIn is set to false by default unless set to true after a successful login

Shouldn't LoggedIn be stored the same way the token is (cookie, localStorage)? or maybe set to true if token exists on load automatically?

If not then what is the recommended method for persistent session

_{This question is available on Nuxt.js community (#c38)}

[fanckush]

so for now i added the following:

initloggedIn () {
  if (! process.server) return
  if (this.getState('token')) {
    this.setState('loggedIn', true)
  }
}

to auch.class.js and then call it inside init, if you believe this the right aproach then i will try to make a pull request

[pi0]

Hi sorry for late answering. The behavior is intended indeed. loggedIn is set to true as soon as fetchUser is done not when just token is available. (https://github.com/nuxt-community/auth-module/blob/master/lib/templates/auth.class.js#L252) You can directly use token as a loggedIn validator if user availability is not important.

[fanckush]

oh i see i missed this line:
https://github.com/nuxt-community/auth-module/blob/55e0fbe91d19310b5f6969daae542c96e6ef2606/lib/templates/auth.class.js#L40

i thought that fetchUser was called only once only inside login().

So if i had an api endpoint for user then loggedIn will remain true after page refresh?

[pi0]

@fanckush Yes it should remain true (expected behaviour) :)

[fanckush]

a n0ob question: you said

You can directly use token as a loggedIn validator if user availability is not important.

where would i set that?

[fanckush]

never mind i will close this issue now. Thanks a lot!

[breakingrobot]

@fanckush You can use a custom watchState like this :

const customValue = 'loggedIn' // could be anything
this.$auth.watchState(customValue, newValue => {
  // do you logic here.
})

Then, you should edit you configuration watchLoggedIn to false

[alexdilley]

This functionality means that given mode: spa, a page refresh will $auth.redirect('home') instead of rendering the requested route (since the default watchState implementation is set up on init() – once the user is fetched [following a page refresh], it is considered a login action and a redirect occurs).

A workaround:

{
  auth: {
    watchLoggedIn: false,
  },
},

and use a custom watchState (which is seemingly set up _after_ the user is fetched [following a page refresh])

// plugins/auth.js
export default ({ app }) => {
  // Only _actual_ login/outs (including resets) will be watched here.
  app.$auth.watchState('loggedIn', (isLoggedIn) => {
    if (isLoggedIn) {
      // Follow @nuxtjs/auth workflow.
      app.$auth.redirect('home');
    }
  });
};

[kamaln7]

In case anyone comes across this, watchState is now available under $auth.$storage, not $auth.

[kabaluyot]

I solved it by setting axios plugin mode to client only

[ronelvcabrera]

I solved it by setting axios plugin mode to client only

@kabaluyot Good GOD you're a hero

[kamilcglr]

I solved it by setting axios plugin mode to client only

Sorry for the question but howdid you do it?

[kabaluyot]

@kamaln7 you set the axios plugin in client mode only ... like

auth: {
  ... rest of auth options
  plugins: [
      { src: "~/plugins/axios", mode: "client" },
      { src: "~/plugins/auth", mode: "client" }
   ]
}

[Panksi]

@kamaln7 Dude!!! I cannot thank you enough!
Works with @nuxt/axios and @nuxt/auth also...
like so:

modules: [ { src: '@nuxtjs/axios', mode: 'client' }, { src: '@nuxtjs/auth-next', mode: 'client' } ],