Loading chunk errors on dynamic routes
Answered
Thrianta posted this in #help-forum
ThriantaOP
Hello all. I've been having an issue with Next.js ever since
This issue is currently live on my website at https://mcstatus.io. Clicking any of the links under the "Sample Servers" header will produce this issue. The website is also entirely open source at https://github.com/mcstatus-io/website. Please let me know if there is anything I can do to fix this, as it has been happening for quite a while.
v13.4.12. I have a route on my website that uses two dynamic segments (/status/[type]/[address]) that uses data fetching. After updating to v13.4.13 and any version since, clicking a link that goes to this page will instantly result in a client-side error with the console reporting "Loading chunk X failed". Attempting to directly go to the page by URL will cause the page to load correctly, then re-render with no content and the same error being reported to the console. This issue only happens in production on my live server, but not on my local machine. I've attached a screenshot of the console when attempting to load the page.This issue is currently live on my website at https://mcstatus.io. Clicking any of the links under the "Sample Servers" header will produce this issue. The website is also entirely open source at https://github.com/mcstatus-io/website. Please let me know if there is anything I can do to fix this, as it has been happening for quite a while.
27 Replies
if not, it seems like the issue is you are proxying using something that doesnt decode the url, so your [ never gets turned back into a [ making it an invalid chunk
@DirtyCajunRice | AppDir if not, it seems like the issue is you are proxying using something that doesnt decode the url, so your [ never gets turned back into a [ making it an invalid chunk
ThriantaOP
I am currently not using Vercel, it's running behind an Nginx proxy on my VPS. I'll look into my configuration to see if this is something I could fix.
@Thrianta I am currently not using Vercel, it's running behind an Nginx proxy on my VPS. I'll look into my configuration to see if this is something I could fix.
check your chunks. i bet they have [type] in the name
and the url is requesting the urlencoded version
@DirtyCajunRice | AppDir and the url is requesting the urlencoded version
ThriantaOP
Like the contents of the
.next/server/chunks directory?@DirtyCajunRice | AppDir yeah exactly
ThriantaOP
According to the console, it's trying to request chunk 305 but that file does not exist in the chunks directory.
@Thrianta According to the console, it's trying to request chunk 305 but that file does not exist in the chunks directory.
in the pic you sent above, look at the very first line
%5Btype%5D
ThriantaOP
So that's an issue with Nginx not properly decoding the URL when sending it to the Next server?
@Thrianta So that's an issue with Nginx not properly decoding the URL when sending it to the Next server?
well… when you built the app it exported the chunks a certain way.
and the links are linking a certain way
if you run it without a reverse proxy and it works, that means its the proxy
ThriantaOP
Yep, looks like it works without the reverse proxy. It's weird because this issue never appeared until recently. I'll see what I can do to fix it.
@Thrianta Yep, looks like it works without the reverse proxy. It's weird because this issue never appeared until recently. I'll see what I can do to fix it.
proxies are fun and not fun all at the same time
paste your proxy config for reference
ThriantaOP
# mcstatus.io
upstream mcstatus-website {
server 127.0.0.1:3000;
keepalive 64;
}
server {
listen 80;
server_name mcstatus.io www.mcstatus.io;
location / {
rewrite ^/?(.*)$ /$1 break;
proxy_pass http://mcstatus-website;
proxy_http_version 1.1;
proxy_set_header Connection "";
add_header Strict-Transport-Security "max-age=31536000; includeSubDomains" always;
add_header X-Content-Type-Options "nosniff" always;
add_header X-Frame-Options "SAMEORIGIN" always;
add_header X-XSS-Protection "1; mode=block" always;
add_header Cache-Control "max-age=86400" always;
}
}It might have something to do with the
rewriteooo yeah why you rewriting at all
Answer
and why you using upstream with only 1 endpoint haha
ThriantaOP
I've been rewriting for years lol. I had to use it at some point but forgot why so I've been copying the same config for a while. Also I use upstream because I was load balancing across 3 instances but have since reduced it back to 1.
@Thrianta I've been rewriting for years lol. I had to use it at some point but forgot why so I've been copying the same config for a while. Also I use upstream because I was load balancing across 3 instances but have since reduced it back to 1.
back in the base dir days it was needed. but now its not. remove that caca haha
ThriantaOP
I'm pretty sure it was the rewrite, removing it seemed to fix the issue 🎉
That is so dumb lol
glad its sorted 🙂
ThriantaOP
Thank you for your help