Problems using headers, getting "expects to have requestAsyncStorage"
Answered
Giant ichneumon wasp posted this in #help-forum
![Avatar](https://cdn.discordapp.com/embed/avatars/3.png)
Giant ichneumon waspOP
Full error:
Collecting page data ..Error: Invariant: headers() expects to have requestAsyncStorage, none available.
at f (/Users/.../nextjs-playground/.next/server/chunks/210.js:14:9632)
at i (/Users/.../nextjs-playground/.next/server/chunks/46.js:5966:4984)
at /Users/.../nextjs-playground/.next/server/app/page.js:1:2399
at 44232 (/Users/.../nextjs-playground/.next/server/app/page.js:1:2419)
at Function.t (/Users/.../nextjs-playground/.next/server/webpack-runtime.js:1:142)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async collectGenerateParams (/Users/st/Documents/Programming/work/hammer-ui/node_modules/.pnpm/next@14.0.3_@babel+core@7.22.17_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/build/utils.js:884:17)
Answered by Giant ichneumon wasp
This is actually solved by having headers run not at a module level. Basically what was going on was
import { headers } from '...';
export const a = headers().get('a');
when what should've been happening was import { headers } from '...';
export const a = () => headers().get('a');
. The error is really unintuitive though, and should probably be looked at being improved.2 Replies
![Avatar](https://cdn.discordapp.com/embed/avatars/3.png)
Giant ichneumon waspOP
Here are the two usages of headers that route should be touching
export const getLocale = () => {
const host = headers().get('host');
if (!host) {
return 'en';
}
if (hostnameHasLocale(host)) {
return host.split('.')[0];
}
return 'en';
};
(called twice)const mobile = userAgent({ headers: headers() }).device.type === 'mobile';
![Avatar](https://cdn.discordapp.com/embed/avatars/3.png)
Giant ichneumon waspOP
This is actually solved by having headers run not at a module level. Basically what was going on was
import { headers } from '...';
export const a = headers().get('a');
when what should've been happening was import { headers } from '...';
export const a = () => headers().get('a');
. The error is really unintuitive though, and should probably be looked at being improved.Answer