445cc62b3e
The filenames of the two code blocks on this page https://nextjs.org/docs/messages/next-dynamic-api-wrong-context are written as comment instead of using the `filename` prop. ![image](https://github.com/vercel/next.js/assets/20135478/86b45742-cb83-4cd1-933c-a1c22f51e0fd) --------- Signed-off-by: Eng Zer Jun <engzerjun@gmail.com> Co-authored-by: Sam Ko <sam@vercel.com>
43 lines
1.2 KiB
Text
43 lines
1.2 KiB
Text
---
|
|
title: Dynamic API was called outside request
|
|
---
|
|
|
|
#### Why This Error Occurred
|
|
|
|
A Dynamic API was called outside a request scope. (Eg.: Global scope).
|
|
|
|
Note that Dynamic APIs could have been called deep inside other modules/functions (eg.: third-party libraries) that are not immediately visible.
|
|
|
|
#### Possible Ways to Fix It
|
|
|
|
Make sure that all Dynamic API calls happen in a request scope.
|
|
|
|
Example:
|
|
|
|
```jsx filename="app/page.js"
|
|
import { cookies } from 'next/headers'
|
|
|
|
- const cookieStore = cookies()
|
|
export default function Page() {
|
|
+ const cookieStore = cookies()
|
|
return ...
|
|
}
|
|
```
|
|
|
|
```jsx filename="app/foo/route.js"
|
|
import { headers } from 'next/headers'
|
|
|
|
- const headersList = headers()
|
|
export async function GET() {
|
|
+ const headersList = headers()
|
|
return ...
|
|
}
|
|
```
|
|
|
|
### Useful Links
|
|
|
|
- [`headers()` function](https://nextjs.org/docs/app/api-reference/functions/headers)
|
|
- [`cookies()` function](https://nextjs.org/docs/app/api-reference/functions/cookies)
|
|
- [`draftMode()` function](https://nextjs.org/docs/app/api-reference/functions/draft-mode)
|
|
- [`unstable_noStore()` function](https://nextjs.org/docs/app/api-reference/functions/unstable_noStore)
|
|
- [`unstable_cache()` function](https://nextjs.org/docs/app/api-reference/functions/unstable_cache)
|