Issue with Routes in React Application Hosted on InfinityFree

[NataliaGiselle]

Dear InfinityFree Support Team,

I am experiencing an issue with the routes of my React application hosted on your service. Below is a detailed description of the situation:

Problem Description:

My application is developed with React on the frontend and uses PHP to access a database. The entire project is hosted in the htdocs folder on your server. The application works correctly in my local environment, but when I deploy it on InfinityFree, I can only access index.html. The routes configured in React do not work properly when I try to access them directly via the URL.

Example of the Problem:

1. When I navigate to https://darrona-pedidos.free.nf/lista-de-precios, I get a 404 error that says: “The page you were looking for could not be found!”
2. However, if I navigate through the application using internal links, the routes work correctly.

Current Configuration:

I have tried configuring an .htaccess file in the root of htdocs with the following rules to handle the routes of the React application:

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule ^ index.html [L]
</IfModule>

I also tried the following alternative configuration:

Options -MultiViews
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]

Despite this, I keep receiving 404 errors when I try to access the routes directly via the URL.

Request for Assistance:

I would appreciate your help in resolving this issue. Could you provide guidance on how to correctly configure the routes for a React application on your platform? Is there any specific configuration I need to adjust in the .htaccess file or on the server to make the routes work properly?

Additional Information:

• Domain: https://darrona-pedidos.free.nf/
• Location of .htaccess file: root of htdocs
• Type of application: React frontend with PHP backend

Thank you in advance for your help. I look forward to your response to resolve this issue as soon as possible.

Sincerely,

Natalia

[Greenreader9]

It has something to do with how you have React handling requests.

If I make a HTTP request the URL, it fails with a 404 error (As you said), but when I use the internal linking, I don’t actually make a HTTP request to that page, everything seems to be handled via JS. My best guess is that you don’t have a way for HTTP requests to be handled, only the internal navigation structure is correct (Even if I reload the working page, an HTTP request to that URL is created, causing it to fail).

I am not honestly sure how you would investigate/fix this (I don’t use React), but maybe you can use it as a starting point.

[NataliaGiselle]

Thank you for the response. I just realized that my .htaccess file was incorrectly written - I was able to fix it, thanks!