Encountering 500 Internal Server Error

Website, Application, Performance
1

What is the name of the domain?

What is the error number?

500

What is the error message?

500 Internal Server Error

What is the issue you’re encountering

The 500 error only seems to affect https://imagesplitter.tools/grid-image-splitter this particular URL

What steps have you taken to resolve the issue?

My website https://imagesplitter.tools is hosted on Cloudflare. While all pages of the site, including https://imagesplitter.tools/grid-image-splitter, seem to work fine, I found a 500 error when accessing https://imagesplitter.tools/grid-image-splitter in my browser’s developer tools.

Here are some details on the subject:

The 500 error is only visible in the browser’s developer tools, and the page that the user sees on the frontend is normal
The error only seems to affect https://imagesplitter.tools/grid-image-splitter this particular URL
Other pages of the site don’t show a 500 error in Developer Tools
In the local development environment, this 500 error does not occur
I’m worried that this hidden 500 error could affect the SEO of the website because search engine crawlers might detect this error. I tried the following troubleshooting steps, but the problem persists:

The source code was checked and no obvious errors were found
Tested in a local environment with no 500 errors
Checked Cloudflare’s page rules and workers and found no misconfigurations
Cleared Cloudflare’s cache

What are the steps to reproduce the issue?

When I open the URL https://imagesplitter.tools/grid-image-splitter and check the developer console, I notice a 500 Internal Server Error. Although the page appears to load normally for users, this hidden error concerns me as it may potentially impact the website’s SEO, since search engine crawlers might detect this issue.

Screenshot of the error

screenshot-20240913-130524.png
screenshot-20240913-130524.png850×622 85.2 KB

2

Accessing a single file separated from other ones may lead to errors. Depending of the complexity of your website that can eventually happen.
As I understand if the front end works fine and the users can access the site normally (that what maters). Then you could think on disable that file from be accessed from outside your hosting server.
In that way only the site application will access it and no crowlers / SEO or public access.

Thanks
Eduardo.

3

Also, when you are in development / local mode your browser have access to all local variables and configurations that the remote access doesn’t have.
What maters are the users have normal access to the site. That’s what crawlers should also access. Apart from that engines should not access to specific files, so block that file form remote access.

4

I couldn’t reproduce 500. Instead, I see 103 Early Hints and then 200 OK:

% curl -svo /dev/null https://imagesplitter.tools/grid-image-splitter
* Host imagesplitter.tools:443 was resolved.
* IPv6: (none)
* IPv4: 172.67.200.109, 104.21.85.6
*   Trying 172.67.200.109:443...
* Connected to imagesplitter.tools (172.67.200.109) port 443
...
< HTTP/2 103 
< link: </_next/static/media/a34f9d1faa5f3315-s.p.woff2>; as=font; crossorigin=; rel=preload; type=font/woff2
< 
< HTTP/2 200 
< date: Mon, 16 Sep 2024 10:26:13 GMT
< content-type: text/html; charset=utf-8
< link: </_next/static/media/a34f9d1faa5f3315-s.p.woff2>; rel=preload; as="font"; crossorigin=""; type="font/woff2"
< vary: RSC, Next-Router-State-Tree, Next-Router-Prefetch, Accept-Encoding
< x-edge-runtime: 1
< x-matched-path: /[locale]/grid-image-splitter
< x-powered-by: Next.js
< report-to: {"endpoints":[{"url":"https:\/\/a.nel.cloudflare.com\/report\/v4?s=HxCSWBI6wR3R%2BGvGptOovoC9aFrOIccGvhcpsthHhjO%2BiqQ3uLXhdJ2Y6Q3bAj8aB2ZC4dAkbmFYC130mfK%2FHhw6O7IRReV5V8b%2FzryIrEija2%2BYRl7MM7RQJhKJTul8uDem5lbO"}],"group":"cf-nel","max_age":604800}
< nel: {"success_fraction":0,"report_to":"cf-nel","max_age":604800}
< cf-cache-status: DYNAMIC
< server: cloudflare
< cf-ray: 8c40282cb9e39497-LHR
< alt-svc: h3=":443"; ma=86400
< 
{ [1360 bytes data]
* Connection #0 to host imagesplitter.tools left intact

It is important to point out that on your screenshot the 500 Internal Server Error is returned by your localhost and not Cloudflare, as the remote server is set to 127.0.0.1:16005. It is possible that 500 is returned by your forward proxy that sits between your browser and Cloudflare — double check that first. :wink:

5

Thank you, Eduardo, for your reply. I understand where the problem lies; it’s because a component in my code needs server-side rendering. I can fix it by changing this component to ssr:true rendering.

6

Thank you, ncano, for your reply. I have fixed the 500 issue; changing one component in the code to server-side rendering with ssr:true is enough. The remote server is set to 127.0.0.1:16005 because my network uses a proxy, and the real IP is hidden.

7

This topic was automatically closed after 15 days. New replies are no longer allowed.