nextjs app-router ai_generated true

Error: Dynamic server usage: cookies

ID: nextjs/dynamic-server-usage

Also available as: JSON · Markdown
95%Fix Rate
96%Confidence
50Evidence
2023-01-01First Seen

Version Compatibility

VersionStatusIntroducedDeprecatedNotes
14 active
14 active

Root Cause

Using cookies(), headers(), or searchParams in a component that Next.js is trying to statically render.

generic

Workarounds

  1. 95% success Export const dynamic = 'force-dynamic' to opt out of static rendering
    Forces the page to render dynamically on every request

    Sources: https://nextjs.org/docs/app/api-reference/file-conventions/route-segment-config

  2. 90% success Move the dynamic API call to a Server Component that is not statically rendered
    Keep the static parts static and only make the dynamic part dynamic

Dead Ends

Common approaches that don't work:

  1. Adding 'use client' to the component 80% fail

    cookies/headers are server-only APIs; 'use client' will cause import errors

  2. Wrapping in try/catch 70% fail

    Next.js checks usage at build time; runtime handling doesn't prevent the error

Error Chain

Frequently confused with: