Next 13 fetch in server component stuck forever if response is larger than ~15kb
See original GitHub issueVerify canary release
- I verified that the issue exists in the latest Next.js canary release
Provide environment information
Operating System:
Platform: linux
Arch: x64
Version: Ubuntu 20.04.0 LTS Wed Oct 26 2022 14:44:18 GMT+0200 (Central European Summer Time)
Binaries:
Node: 16.14.2
npm: 7.17.0
Yarn: 1.22.19
pnpm: 7.13.6
Relevant packages:
next: 13.0.0
eslint-config-next: N/A
react: 18.2.0
react-dom: 18.2.0
What browser are you using? (if relevant)
No response
How are you deploying your application? (if relevant)
No response
Describe the Bug
When fetching data as described in the docs, the fetch function gets stuck and never resolves, if the payload reaches a certain size.
I created a minimal stackblitz and a mock api to reproduce the problem. If I fetch 75 posts from the mock api it will never resolve, if I only fetch 50 it works fine. Since I was able to reproduce this problem with multiple mock apis and even when using something like supabase to fetch some data I think it might be a size issue? Here the difference is 14kb vs 20kb for the two requests.
EDIT:
I tried to nail the problem down further. fetch does indeed resolve but .json()
does not. Does this have to do with the highWaterMark buffer size limit on nodejs streams?
Expected Behavior
Fetch should not get stuck forever.
Link to reproduction
https://stackblitz.com/edit/nextjs-vv7ryj?file=app/page.tsx
To Reproduce
- Open the stackblitz
- Comment out line 3 and comment in in line 4 in
pages.tsx
to fetch 75 instead of 50 posts - See that fetch never resolves
Issue Analytics
- State:
- Created a year ago
- Reactions:23
- Comments:20 (5 by maintainers)
This hurts me deeply
Thanks for reporting, I did some digging, and the issue seems to be
node-fetch
-specific.Currently, on the server, Next.js uses
node-fetch
to polyfillfetch
when Node.js <18 is used. Above Node.js 18, or when theexperimental: {enableUndici: true}
option innext.config.js
is present, we will useundici
instead, which does not have this problem.So current workarounds are:
next.config.js
: