How to Hide API Keys of Your JavaScript Projects? (Secure & Easy Way / No .ENV File)

While developing SPA project, we sometimes need to use API keys. Although it is possible to hide these API keys with .ENV file importing method, you must find another method on production process because of the fact that:

• .env files’ content are visible to client when they investigate your .js files.
• .env importing is used for when you want to hide api key on Github 🙂

Quick fix for this problem:

You can try to create a new express.js project to get request from your client then forward this request this to 3rd party endpoint with API key (on backend side).

After it gets response from 3rd party endpoint, your express.js backend project must forward this response to you.

Here you can find my solution and steps:

1. We integrate express pack (npm install express)
2. Install helmet pack for possible security problems (npm install helmet)
3. Use axios for get and post steps (npm install axios)