Netlify throws internal server error whereas vercel was working fine

Support
, , ,
1

Hi,

I was trying netlify for one of our nextjs project after first trying vercel. I’ve successfully deployed my nextjs app on netlify for site having id: “bd7f240e-427e-45b0-acb5-fcc12ecd23f6”.

The strange issue I’m facing is whenever I open login page and page is not completely fetched (while browser shows the loading in tab) and I submit the log form it throws 500 internal server error. However, If I wait till my login page gets fetched completely and then submit the form everything works fine.

Let me share my setup. I’m using nginx for reverse proxy because I want to display nextjs app in subpath. Here’s my nginx config:

location ~* ^/materialize-nextjs-admin-template/demo-1 {
    # Below `proxy_set_header` are from `proxy_params`
    # include proxy_params;

    # Content of `proxy_params`
    # proxy_set_header Host $http_host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
    proxy_set_header X-Forwarded-Host "demos.pixinvent.com";

    proxy_set_header X-server-header "demo-1";
    proxy_pass https://materialize-nextjs-admin-template.netlify.app;
}

Above mentioned issue doesn’t appear when I deploy same app on vercel with below nginx config:

location ~* ^/materialize-nextjs-admin-template/demo-1 {
    # Below `proxy_set_header` are from `proxy_params`
    # include proxy_params;

    # Content of `proxy_params`
    # proxy_set_header Host $http_host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;

    proxy_set_header X-server-header "demo-1";
    proxy_pass https://materialize-nextjs-admin-template.netlify.app;
}

When I check the netlify logs when error occurs it shows “x-forwarded-host header with value materialize-nextjs-admin-template.netlify.app does not match origin header with value demos.pixinvent.com from a forwarded Server Actions request”. You can check the screenshot below:

image
image1424×384 125 KB

May I know what’s the issue that isn’t occuring on vercel but only in netlify even with extra config of proxy_set_header X-Forwarded-Host "demos.pixinvent.com";?

Best Regards,
ThemeSelection Team

2

This was due to hydration because when your page gets loaded in browser its hydrating and during that time even handlers aren’t attached to the page and submitting the form triggers the page reloads. Hence, This is not related to netlify.

Sorry for the noise.