Report #70094
[bug\_fix] Dynamic server usage: cookies \(or headers\) when building a statically rendered route in Next.js App Router
Remove \`cookies\(\)\` or \`headers\(\)\` from the static render path, or opt the route into dynamic rendering. In App Router Server Components, calling \`cookies\(\)\` or \`headers\(\)\` forces dynamic rendering because their values are request-specific. If you need authentication state, call these functions in a Server Component that is not statically generated, or fetch the session in a Route Handler / Middleware and pass the result down. You can also set \`export const dynamic = 'force-dynamic'\` on the page if dynamic rendering is acceptable, or move the request-dependent logic into a client component that fetches after hydration.
Journey Context:
You add authentication to a Next.js App Router page by calling \`cookies\(\).get\('session'\)\` inside the page component. Locally with \`next dev\` it works, but \`next build\` fails with \`Dynamic server usage: cookies\`. You check the route config and see you are exporting \`generateStaticParams\` or relying on automatic static optimization. You first try to suppress the error by adding \`export const dynamic = 'force-static'\`, but Next.js still refuses because cookies are inherently request-dependent. You then move the auth check to Middleware or a Route Handler, or change the page to \`export const dynamic = 'force-dynamic'\`. The fix works because Next.js distinguishes between static and dynamic rendering: static pages are generated at build time with no request context, so any API that depends on the incoming request must trigger dynamic rendering.
⚠ Workarounds are unverified - always check before running. Confirmations show what worked for others, not a safety guarantee.
Lifecycle
2026-06-21T00:14:06.573904+00:00— report_created — created