obtaining headers in a nextjs api route
Answered
Hunting wasp posted this in #help-forum
Hunting waspOP
Hello,
I'm currently trying to obtain an authorization header on a post request using a nextjs api route. However, when attempting to do this I am getting an empty object returned.
output:
Any clue why this could be happening? I've attached a picture of the request which I am sending via bruno.
I have retrieved this code directly from the [nextjs docs](https://nextjs.org/docs/app/building-your-application/routing/route-handlers#headers)
I'm currently trying to obtain an authorization header on a post request using a nextjs api route. However, when attempting to do this I am getting an empty object returned.
import { headers } from 'next/headers';
export const dynamic = 'force-static';
export async function POST(request: Request) {
const headersList = headers();
const authorization = headersList.get('authorization');
console.log(111111, authorization);
console.log(22222222, headersList);output:
111111 null
22222222 Headers {}Any clue why this could be happening? I've attached a picture of the request which I am sending via bruno.
I have retrieved this code directly from the [nextjs docs](https://nextjs.org/docs/app/building-your-application/routing/route-handlers#headers)
Answered by joulev
'force-static': Force static rendering and cache the data of a layout or page by forcing cookies(), headers() and useSearchParams() to return empty values.https://nextjs.org/docs/app/api-reference/file-conventions/route-segment-config#dynamic
5 Replies
Hunting waspOP
Oh... for some reason if I remove "force-static" it works fine? Not sure why that is.
@Hunting wasp Hello,
I'm currently trying to obtain an authorization header on a post request using a nextjs api route. However, when attempting to do this I am getting an empty object returned.
ts
import { headers } from 'next/headers';
export const dynamic = 'force-static';
export async function POST(request: Request) {
const headersList = headers();
const authorization = headersList.get('authorization');
console.log(111111, authorization);
console.log(22222222, headersList);
output:
ts
111111 null
22222222 Headers {}
Any clue why this could be happening? I've attached a picture of the request which I am sending via bruno.
I have retrieved this code directly from the [nextjs docs](https://nextjs.org/docs/app/building-your-application/routing/route-handlers#headers)
'force-static': Force static rendering and cache the data of a layout or page by forcing cookies(), headers() and useSearchParams() to return empty values.https://nextjs.org/docs/app/api-reference/file-conventions/route-segment-config#dynamic
Answer
headers() is a Dynamic Function whose returned values cannot be known ahead of time. Using it in a layout or page will opt a route into dynamic rendering at request time.
Hunting waspOP
Ahh thanks for clarifying ^ 🙂
Black carp
Yup, force-static is saying this page is to be a static and generated a single time, this means that it can't leverage the context of headers or a cookie so you would get empty values. removing it makes it
dynamic (meaning SSR) and you get a request lifecycle on the server (meaning access to proper headers and cookies there)