'Secure Node API for React Front End

I’m building a React application with a Node backend. In the backend I have an API that just talks to a database and I can deploy the API and the React app at the same time.

Although this works fine, the API routes are not secure ,i.e, anyone can freely access myapp.com/api/getData. I would like only my React front end to be able to access these /API endpoints and I’m not sure what is the best way to do that.

To be clear, I don’t mean securing them so that only a logged in user can access them but basically preventing a user from going in their browser / Postman, typing in that URL and getting the data.

I know that a solution would be to have the API as a separate project, deployed separately and secure that with an API key for example but I like the convenience of having both deployed at the same time.

Is there a better way of doing this?

EDIT: I've ended up just moving the API to a separate project



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source