Refreshing a page removes the cookie using the local provider

[jorni-moddit]

Environment

• Operating System: Darwin
• Node Version: v18.15.0
• Nuxt Version: 3.11.2
• CLI Version: 3.11.1
• Nitro Version: 2.9.6
• Package Manager: npm@9.5.0
• Builder: -
• User Config: devtools, app, runtimeConfig, modules, auth, i18n, image, css, nitro, vite, routeRules
• Runtime Modules: @nuxtjs/i18n@8.3.0, @nuxt/image@1.5.0, @vueuse/nuxt@10.9.0, @sidebase/nuxt-auth@0.7.1
• Build Modules: -

Reproduction

We're using a WordPress back-end with the simple-JWT plugin.
For this example I returned a hardcoded body in the api/auth/[...].ts
And there is a simple login form.

https://stackblitz.com/edit/github-gpkaqq?file=server%2Fapi%2Fauth%2F[...].ts

Describe the bug

After logging in a cookie is set, when not configured it's under auth.token and I have an authenticated state.

After a page refresh this cookie is removed.

Additional context

No response

Logs

No response

[MisterNox]

Unfortunately I cannot reproduce your issue. When I try it with your stackblitz example and refresh the page the cookie persists and I am still authenticated (I tried it with Firefox and Chrome).

However, I had a similar issue when I touched the cookie after it was set by the signIn method with the Cookies class of the js-cookie library. My intention was to build a wrapper around the signIn to dynamically set the expires attribute of the cookie by the value the jwt token comes with instead of relying only on the static definition via the config in nuxt. Don't know if this is related to the useCookie method or the Set-Cookie header. By the way I use simple-jwt as well.

Do you touch the cookie somewhere in your process flow? What helps me in this situations when it seems to get buggy is hard refreshing via Ctrl + Shift + R and/or closing the browser entirely and/or deleting the .nuxt folder and let it rebuild everything from scratch. Dont know if it helps in your situation but you could give it a try.

[husseinjahan]

I have the same Issue.

I'm using local authentication but connect to api to get user login. Sometimes not all the times when I refresh the browser, the response comes with a 'SET-COOKIE' response header that clears auth token (I don't know why!). I think there is a bug.

Is there any workaround about it?

I checked this in development and production server with chrome and firefox browsers.

[FireMasterK]

This only happens in the production build, I can reproduce the issue on the stackblitz too with npm install && npm run build && npm run preview.

Edit: removing the set-cookie headers from the nuxt server doesn't fix it, the client is unauthenticated despite having a valid cookie.

[Norel]

I have the exact same problem except I can't reproduce the bug in a local project (dev or prod), only when deployed to a distant server.

[FireMasterK]

I have the exact same problem except I can't reproduce the bug in a local project (dev or prod), only when deployed to a distant server.

Same case for me, except I'm able to reproduce it on the Stackblitz in production mode!

[phoenix-ru]

I can reproduce on playground-local using pnpm build && pnpm nuxi preview.

Adding this to the reproduction app.vue fixes the issue.

onMounted(() => {
  getSession({ force: true });
});

Why is it needed, however? And why doesn't it work without force: true?

I assume it is related to

nuxt-auth/src/runtime/composables/local/useAuth.ts

Lines 84 to 87 in 9bd9f45

	if (!token && !getSessionOptions?.force) {
	loading.value = false
	return
	}

and

nuxt-auth/src/runtime/composables/local/useAuthState.ts

Lines 52 to 57 in 9bd9f45

	onMounted(() => {
	// When the page is cached on a server, set the token on the client
	if (_rawTokenCookie.value && !rawToken.value) {
	setToken(_rawTokenCookie.value)
	}
	})

If someone could further investigate and propose a fix, it would be great!

[Norel]

It turns out that using node 18 is problematic when using nuxt fetch (nuxt/nuxt#12552).
Upgrading to node 20 fixed the issue for me.
Stackblitz is probably using node 18 too.

[FireMasterK]

It turns out that using node 18 is problematic when using nuxt fetch (nuxt/nuxt#12552). Upgrading to node 20 fixed the issue for me. Stackblitz is probably using node 18 too.

I'm able to reproduce it on node 20 still, my Dockerfile uses the node:20-slim image.

[ndro]

I have the same issue with local provider.

Cookie got removed in Firefox after reloading the browser or updating the app. But it's fine in Chrome.

my auth config in nuxt.config.ts:

  auth: {
    baseURL: `${process.env.SOME_DOMAIN_API}`,
    provider: {
      type: 'local',
      pages: {
        login: '/login'
      },
      endpoints: {
        signIn: { path: '/login', method: 'post' },
        signOut: { path: '/logout', method: 'delete' },
        signUp: { path: '/register', method: 'post' },
        getSession: { path: '/me', method: 'get' }
      },
      token: {
        signInResponseTokenPointer: '/token',
        type: '',
        maxAgeInSeconds: 1209600
      },
      sessionDataType: {
        data: {
          // some custom data
        }
      },
    },
    globalAppMiddleware: {
      isEnabled: true
    }
  },