Understanding that you have applied the redirection rules following the blog mentioned above. It might be looking like this:
/* /index.html 200
What it conveys is that – no matter what the request is – redirect it back to index.html. And it was doing same for API calls as well, for which the application was hosted on AWS EC2.
Thus, clearly we need a new redirection rule. We settled for this eventually:
Now, the first rule will be transferring the endpoint requests beginning with “/api/” to API application on AWS. (Notice splat in end? Read more about it here)
And for rest of the paths, which don’t begin with “api”, will be redirected to “index.html”.
One more step needs to be completed on backend. We need to append “api” to all our API’s controller path in backend. In Nets.js it can be done by adding a global prefix (refer this).
Also, we will need a header rule to enable CORS header request generating from Netlify. My _header file looks as follows for now:
With this you should be ready for deployment on netlify.
To read more about _headers and _redirects follow their links. Conventions of these files can be a bit quirky sometimes. Netlify has provided a utility to cross-check the configs of both.
(Note: Remember to put the _headers and _redirects file in the public folder, near index.html)
Lastly, the api url changes that we have made to our react-app may hinder with local development. Here’s a little workaround for same using “environment variables” which comes already integrated with create-react-app.