Search code examples
javascriptreactjsenvironment-variablescreate-react-app

Securing .env parameters in react project

I'm new to React and js worlds, I'm trying to create production build of my application

This application has some env parameters (api keys, secrets, etc.) living in .env.production file, when I run yarn build I get /build folder, especially main.js file, where all of my "secure" env parameters exposed in code and everybody can see it, definitely it's not what I want

Can somebody point me, how can I secure these parameters in my React App, so the project will somehow fetch them securely and not exposing it to the world?

Solution

  • Create a backend api that uses the api keys/secrets and returns the response. Call this api from your React frontend.

    Any keys on your frontend will be exposed.