electron-react-boilerplate / electron-react-boilerplate

A Foundation for Scalable Cross-Platform Apps

Home Page:https://electron-react-boilerplate.js.org/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

environment variable values are appeared directly in production code

Thesiva7 opened this issue · comments

Hi,
I am using below code to load the environmental variables in production

new Dotenv({
path: path.join(webpackPaths.rootPath, '.env'),
safe: false,
silent: false,
defaults: false,
})

but in production files that environmental values are appearing directly. like below image :

production

but in development it is like below image :

development

how to hide environmental values in production code.

@amilajack @jooohhn

This is part of the clientside bundle and therefore cannot be hidden from the client. React is responsible for this behavior. The client ID is ok to be seen in the public. You have to keep the SECRET_KEY secret. This is usually used on the server side. In this case inside the "main.js" process it will be hidden.

// main.js
const GOOGLE_SECRET = process.env.GOOGLE_SECRET

This is part of the clientside bundle and therefore cannot be hidden from the client. React is responsible for this behavior. The client ID is ok to be seen in the public. You have to keep the SECRET_KEY secret. This is usually used on the server side. In this case inside the "main.js" process it will be hidden.

// main.js
const GOOGLE_SECRET = process.env.GOOGLE_SECRET

Hi @sanneh2 ,
But in main.js also env variables visibling directly. I don't know how to hide the env variables from .env file in production application.

Please look below images of production main.js, i have marked encryptedkey field which have value from .env file

mainJS

store

This is a security question.

The best and most reliable thing is authentication and servers. So for example, if your users are logging in to your app, you could share secrets over a secure connection,

Unpackaging will always expose the entire code to the hacker. You can obfuscate it, encrypt it, or compile it with v8 bytecode which I heard works great.

But security with an external server will always be the safest bet, because you can move the secrets and confidential information to a remote location outside of your app.

Hey @Thesiva7

What @sanneh2 said on security is correct, you shouldn't keep secrets on the client. electron-store also advises that encryptionKey is not intended for security purposes, only obfuscation.

I'm not sure what your what your app's codebase looks like, but maybe Google's OAuth javascript
or server docs might help