Get a $149 diagnosis

Error library

Next.js DynamicServerError: Dynamic Server Usage

Next.js throws this at build time when a request-time function like cookies() or headers() runs outside the call stack it was bound to, for example inside setTimeout or after an un-awaited promise. Call those functions directly in the render path and await every promise that uses them.

Cause: cookies()/headers() called inside a new execution context (timer, callback, un-awaited promise), so Next.js can't catch it to opt the page into dynamic rendering.

How to fix it

  1. Find the route named in the build log and the cookies()/headers() call it uses.
  2. Move the call out of setTimeout, setInterval, or callbacks into the main async function.
  3. Await every promise whose work calls these functions.
  4. Avoid try/catch blocks that swallow errors from these calls during rendering.

Example

Illustrative example, not from a customer project.

  async function getCookieData() {
+   const cookieStore = await cookies()
    return new Promise((resolve) => setTimeout(async () => {
-     const cookieStore = await cookies()
      resolve(cookieStore.getAll())
    }, 1000))
  }

FAQ

Why only during next build?

Static generation happens at build time; normally Next.js catches this error to switch the page to dynamic rendering, but an escaped one fails the build.

Is this the same as a page being dynamic?

No. Using cookies() correctly just makes the page dynamic; this error means the call escaped its async context.

Get a $149 diagnosis See pricing Launching soon? The Launch Path gets you ready for $1,195 flat.

$149Get a $149 diagnosis