$auth.logout() and $auth.setToken() don't work on server side.

[Sheby]

Version

v4.0.1

Steps to reproduce

Use $auth.logout() or $auth.setToken() on server side code.

What is expected ?

User should be logged out and new token set, or set to null.

What is actually happening?

Nothing happens.

Additional comments?

$auth.setToken(...) issue can be resolved by changing token.prefix option from default "token" to "token", or anything else that doesn't start with "".
I used $auth.setToken(...) inside axios interceptor and if the interceptor is triggered on server side request it does nothing.

I haven't found any workaround for $auth.logout() problem yet.
The real problem is that cookies aren't set on server side, setCookie() method in storage.js line 158.
Result is that when auth module mounts on client side it uses syncUniversal() and old value from cookie gets set bot in localStorage and Vue store.

_{This bug report is available on Nuxt.js community (#c99)}

[benmccallum]

I believe Markdown/cmty removed your _ which you say is causing the issue. This seems like a bigger issue than just changing the default and updating the docs. The original Devs might want to jump in. I'll have a play around too when I get a chance as I do remember thinking I should've been logged out once and never was after a refresh, which matches your repro here. Thanks :)

[benmccallum]

I'd also been keen to understand if there was a reason why the underscore was used

[pi0]

Keys prefixed with _ are considered secure data which should be hidden from SSR HTML responses and Vuex. Logout from server side is not supported but can be implemented by doing Send-Cookie in storage class.

[benmccallum]

Interesting, knew there would be a reason for the _. Is that a Redux convention, or something else, like Vue?

So the reason nothing happens when you call setToken server-side is that it's stripped from the SSR response before it gets to the client for security reasons.

Do you mean Set-Cookie, @pi0? Could we use a universal/isomorphic js-cookie alternative that supports SSR, or is there still problems just in the way it all operates?

[Sheby]

After further testing $auth.logout() seems to be working on server side, it shouldn't but maybe I'm missing something.

@benmccallum token seems to be stripped yeah.
js-cookie is used by $auth.$storealready but setCookie() method returns early if process.serveris true.
@pi0 is there a reason for that behaviour?
And if you could point me to to some directions on why rendering tokens in vuex is a security issue I would be very grateful.

My initial problem was refreshing my token, I do that in an axios interceptor.
Since my app uses asyncData this happens on server side very often.
If I force it to be done on client side only then my app looks crappy since I do another req to refresh the token app look like I'm logged out until new token is set, and it causes other issues as well.

Proper way for it would be to use cookies as only storage method, but I still don't see the reason why its disabled on server side.

[benmccallum]

I think that's a very real scenario and one that I'll likely face too. Refreshing the token is important. Do you have a code sample of your interceptor? I'd be keen to see how that works if you can share a snippet.

I don't think I can address your concerns though as I'm just starting out with this module myself :)

[aldarund]

Faced this issue today.
On first page load this code executes on server. And im fetching a user if the token is set ( it is). And if fetch fails i want to logout user\set token to null. And setToken do set null, but if i call right after it getToken -> it will still return invalid token value ( from header cookie), and the token will still remain set. And it lead to app not working because it keep sending invalid token...
Is there a workaround for this issue?

[ak4code]

$auth.reset()

[Sheby]

Set your token.prefix to token instead of _token.
$auth.reset() won't work.

[aldarund]

@Sheby oooh. I didnt read about _token part somehow xD Ye, it seems to be working. Thanks

[nysos3]

The problem is with syncUniversal and getUniversal. Logging out on the server correctly updates the vuex-store, but because logging out simply sets the user and token to null the store is ignored in favor of the cookie, which is storing an old value that wasn't updated by the server, thus breaking hydration. If logging out set the user to false, then the syncToken() call in mounted() would properly update the cookie client side.

[nysos3]

I'm not entirely sure what the implications of setting the user and token to false are though. Hopefully @pi0 can have some insight here.

[nysos3]

Created a pull request to fix this. 😃

[nathanchase]

Yeah, I am seeing this behavior where if you're logged in, you logout, and then reload the browser, you're immediately logged in again.

Using "@nuxtjs/auth": "^4.5.1"

[Chathula]

@nathanchase did u find a way to fix this? i am having same issue

[alexbonhomme]

Same issue here

[uncleGena]

I have same issue.

export default {
  mounted() {
    console.log(this.$auth.loggedIn) // -> true
  },
  methods: {
    async onLogout() {
      await this.$auth.logout()
      // this.$store.commit('setLoggedIn', false) // even if I use this
      console.log(this.$auth.loggedIn) // -> false
      // and then redirect, and on mounted it again true. Why?
    },
  },
}

and in cookies it looks right:

auth._refresh_token.local: false
auth._token.local: false
auth.strategy: local

[dkonsoftware]

Same issue after refresh.
I noticed:
The problem exist when when user endpoint is set to false.
If valid user endpoint exist, everything works.

[KravtsovEgor]

Same issue with user endpoint set to false

[gofurnazarov]

You can call this.$auth.logout() in server side and check it if user logged out in store. If user logged out you can clear cookie using nuxtServerInit.

Here is my workaround way

async nuxtServerInit({ state }, appContext) {
	if (state.auth.loggedIn == false) {
		appContext.res.clearCookie('auth._token.local')
	}
}

[begueradj]

I have this same issue with the current version when using JWT authentication: $auth.logout() works, but if I refresh the page, I am logged in. I also find myself logged in at the very beginning when the server is launched. I tried 3 of the methods mentioned above. Any updates since then?

[BolsaWS]

@Gofurjon this won't work if the page is not refreshed. If you open another tab, and logout there, the current tab is still logged in, until the page gets refreshed.

[JohannesLichtenberger]

Any news on this?

[belgianMuscle]

Hey All.
So in my case I was using Auth0, I was having very similar symptoms and just could not figure it out. None of these solutions worked, except for the fact that it was required to call window.location 'http://{auth0 domain}/v2/logout....' The one thing I was forgetting was to add the client_id to the url... That was required for Auth0 to be able and delete those coookies.

[phips28]

Also having the issue when I do a $auth.logout() on serverside, it deletes the cookie and the store. But on the clientside the 'auth' store still holds the logged-in object: {"user":{...},"loggedIn":true,"strategy":"local","token.local":"Bearer xx.xx.chJsVdumLt-xx","status":true,"busy":false,"dark_mode":false}. But cookie got cleared (auth._token.local = false)

So it seems the store from my server does not reflect onto client. How can I fix that?