Next.js Discord

Discord Forum

Cookies - Next ^14.2.3 version Dynamically error

Answered
English Spot posted this in #help-forum
Open in Discord
English SpotOP
Hello guys, Ihave some issues about how to use cookies on Server pages,

I see this page on doc but this doesn't work:
https://nextjs.org/docs/app/building-your-application/rendering/server-components#dynamic-rendering

Someone could help me?
Answered by English Spot
Update, i finally got it hahaha

/** @type {import('next').NextConfig} */
const nextConfig = {
  output: 'export'
};

export default nextConfig;


The problem to use cookies is that output
View full answer

12 Replies

English SpotOP
Thats the problem


If i try this present on doc
Anay-208
whats the problem?
English SpotOP
The error:
Route /auth/home with dinamic = error couldnt be rendered statically
Anay-208
can you send your code so I can assist you further
English SpotOP
Sure, wait a sec
I have these function to use on login 

export async function logIn<UserCredentials>(credentials: UserCredentials) {
  'use server'
  try {
    const response = await API.post(`/login/signIn`, credentials)
    const content = { token: response.data.accessToken, userId: response.data.user.id }

    cookies().set('session', JSON.stringify(content), { httpOnly: true, secure: false });

    return response.data;
  } catch (error) {
    if (error instanceof AxiosError) {
      throw error.response?.data?.message
    } else {
      throw 'Internal server error'
    }
  }
}


export async function getSession() {

  try {
    const session = cookies().get('session')?.value;

    if (!session) return null;

    return JSON.parse(session)
  } catch (err) {

    console.error("Cannot find cookie session", err)
  }
}


After that, I redirect the user to auth/home page: 

import { getSession } from "@/services/http/AuthService";
export default async function HomePage() {

  const session = getSession()
  console.log(session)
  return (
    <div className="p-8 flex-1 flex flex-col gap-4">

      <h2 className="text-2xl font-bold">Welcome to home, John Doe</h2>

      <ul className="grid grid-cols-1 md:grid-cols-[30rem_1fr_20rem] gap-4">
        <div className="skeleton w-full h-32"></div>
        <div className="skeleton w-full h-32 md:col-span-2"></div>
        <div className="skeleton w-full h-64 md:col-span-2"></div>
        <div className="skeleton w-full h-64"></div>
        <div className="skeleton w-full h-96 md:col-span-3"></div>
      </ul>

    </div>
  )
}


But i got this error:
route /auth/home with dynamic = error couldnt be rendered statically because use cookies
Here is the video, that I use to create this code:

https://www.youtube.com/watch?v=DJvM2lSPn6w
@English Spot I have these function to use on login jsx export async function logIn<UserCredentials>(credentials: UserCredentials) { 'use server' try { const response = await API.post(`/login/signIn`, credentials) const content = { token: response.data.accessToken, userId: response.data.user.id } cookies().set('session', JSON.stringify(content), { httpOnly: true, secure: false }); return response.data; } catch (error) { if (error instanceof AxiosError) { throw error.response?.data?.message } else { throw 'Internal server error' } } } export async function getSession() { try { const session = cookies().get('session')?.value; if (!session) return null; return JSON.parse(session) } catch (err) { console.error("Cannot find cookie session", err) } } After that, I redirect the user to `auth/home` page: jsx import { getSession } from "@/services/http/AuthService"; export default async function HomePage() { const session = getSession() console.log(session) return ( <div className="p-8 flex-1 flex flex-col gap-4"> <h2 className="text-2xl font-bold">Welcome to home, John Doe</h2> <ul className="grid grid-cols-1 md:grid-cols-[30rem_1fr_20rem] gap-4"> <div className="skeleton w-full h-32"></div> <div className="skeleton w-full h-32 md:col-span-2"></div> <div className="skeleton w-full h-64 md:col-span-2"></div> <div className="skeleton w-full h-64"></div> <div className="skeleton w-full h-96 md:col-span-3"></div> </ul> </div> ) } But i got this error: route /auth/home with dynamic = error couldnt be rendered statically because use cookies
Anay-208
I'll have to try in my own environment, Which I'll do tomorrow when I'm free
English SpotOP
Ok, thx for help
@Anay-208 I'll have to try in my own environment, Which I'll do tomorrow when I'm free
English SpotOP
Update, i finally got it hahaha

/** @type {import('next').NextConfig} */
const nextConfig = {
  output: 'export'
};

export default nextConfig;


The problem to use cookies is that output
Answer
joulev
yes. static export does not support next/headers methods