-
Notifications
You must be signed in to change notification settings - Fork 26.8k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Missing prefetch headers in Middleware #63728
Comments
Upon some further investigation, it looks like the headers are present when using the And this can be confirmed by inspecting the Network request: So is it safe to assume that this discrepancy between |
It is a major blocker for my project as well, can we fix this for app/ router |
need this |
is also not working as expected in This is a big problem for us and we are due to go live soon. We don't want to be running our middleware for every link that is prefetched. We are worried that this could run up the quotas for Edge Middleware functions on Vercel if we receive a lot of traffic. |
I encountered the same issue. After some debugging, I discovered that the headers are missing when using |
Link to the code that reproduces this issue
https://codesandbox.io/p/devbox/nextjs-missing-prefetch-header-5ll75f?file=%2Fapp%2Flayout.tsx%3A38%2C17
To Reproduce
You will notice that as soon as you load the
/
page, the middleware logs the pages the current page and also the pages being prefetched, and that later should not happen.Current vs. Expected behavior
The current documentation suggests that if you don't want the middleware to run for pages that are being prefetched, you can target the
next-router-prefetch
andpurpose
headers:Unfortunately that does not seem to work in the latest version of Next.js - those headers are never present, therefore "missing" - so the middleware is running for pages that are being prefetched, which causes issues if you are handling redirects/rewrites, etc...
In my example app, I've a couple
Link
components in the root layout with aprefetch
prop. Those links are being prefetched, but they are also running in the middleware (see the logs) and no prefetch headers are added to those prefetched pages.I would expect those headers to be available in the middleware for pages that are being prefetched or at least another way for the middleware to know when a page is being prefetched or not.
Provide environment information
Operating System: Platform: linux Arch: x64 Version: #1 SMP PREEMPT_DYNAMIC Sun Aug 6 20:05:33 UTC 2023 Binaries: Node: 20.11.1 npm: 10.2.4 Yarn: 1.22.19 pnpm: 8.15.4 Relevant Packages: next: 14.1.4 eslint-config-next: 14.1.4 react: 18.2.0 react-dom: 18.2.0 typescript: 5.4.3 Next.js Config: output: N/A
Which area(s) are affected? (Select all that apply)
App Router, Middleware / Edge (API routes, runtime)
Which stage(s) are affected? (Select all that apply)
next build (local), next start (local), Vercel (Deployed)
Additional context
I also tested with version
13.5.6
and the issue remains.I also remove the
missing
property and added logs to those headers, but they always return asnull
no matter what.The text was updated successfully, but these errors were encountered: