Nuxt•2y ago

How to get cookie value in SSR page?

I'm probably missing something, but I'm not understanding why I can't access a cookie value from a server-side rendered page.

In a most basic sense, why doesn't {{ useCookie('foobar') }} show the value of that cookie in the server-side rendered HTML? It works correctly when the page is rendered client-side, and I can get the cookie value using getCookie() in a /server/api/ endpoint -- but I was under the assumption that useCookie is "SSR-friendly" and should be able to retrieve the cookie value for the server-rendered page?

Wirkhof•5/22/24, 6:10 PM

https://nuxt.com/docs/guide/going-further/nuxt-app#the-nuxt-context

WWirkhof https://nuxt.com/docs/guide/going-further/nuxt-app#the-nuxt-context

SurrealOP•5/22/24, 6:31 PM

I use the Composition API exclusively (e.g., <script lang="ts" setup>...</script>) - shouldn't useCookie() have access to the Nuxt context in that scope?

SurrealOP•5/22/24, 6:34 PM

e.g.,

<template>
  <div>{{foobar}}</div>
</template>
<script lang="ts" setup>
  const foobar = useCookie('foobar');
</script>

<template>
  <div>{{foobar}}</div>
</template>
<script lang="ts" setup>
  const foobar = useCookie('foobar');
</script>

also returns undefined in the SSR HTML, even when the cookie is defined

SurrealOP•5/22/24, 6:38 PM

P.S. I'm also not getting a "A composable that requires access to the Nuxt instance was called outside of a plugin, Nuxt hook, Nuxt middleware, or Vue setup function." error, I'm getting a hydration mismatch between a server-side rendered undefined value, and a client-side rendered value from the cookie

SurrealOP•5/23/24, 2:17 AM

Ah, nevermind. I realized that I had modified the nuxt config to make some pages not use SSR, some pages use SWR, etc., and that seems to be tied to the cause

How to get cookie value in SSR page?

Similar Threads

Similar Threads

Similar Threads