Next.js Discord

Discord Forum

Better debugging for hard-navigation

Unanswered
Sinhala Hound posted this in #help-forum
Open in Discord
Sinhala HoundOP
How can I get a better indication about why next/link is causing a full browser refresh between routes in production (but not in dev)? There's precious little useful output to let me know what happened. Is there some logging I can enable?

7 Replies

Sinhala HoundOP
Looks like I got a Network error when navigating? TypeError: NetworkError when attempting to fetch resource.
It has to do with loading URLS that are appended with something like: ?_rsc=l3ils
What is that? Why would that only fail in production (which is behind cloudfront)?
Sinhala HoundOP
Oh, this looks like another way that app router is just broken https://github.com/vercel/next.js/issues/65335
Sinhala HoundOP
I fixed it! Needed to allow a few headers through Cloudfront to get to the node.js
Sinhala HoundOP
Well, it was 2 settings. The Cloudfront cache needs to be configured to cache for query strings, and also a couple of headers. Next.js does set the Vary header with those necessary keys, but Cloudfront doesn't seem to use that...
The keys are: Rsc, Next-Router-Prefetch, Next-Router-State-Tree - they need to be set in your cache key settings in your cache policy, and in your request policy.