Ensure the security of React variable import
P粉610028841
P粉610028841 2023-09-16 15:11:12
0
1
899

Will it cause security issues if I import an object in a React file to use some of its values?

For example, if I have an object like this:

var data = {
     'name': 'Adam',
     'id': 12345,
     'secret': 98765
}

and I import it like this:

import { data } from 'db.js';
 
function Index(){
     return(
          <>
             {data.name}
             {data.id}
          </>
     );
}

Would I create a scenario where someone could call and view the "secret" value using the imported "data" object, or would React prevent this from happening?

P粉610028841
P粉610028841

reply all(1)
P粉852114752

You should treat any code you send to the client machine as public. Any developer who is dedicated enough can eventually reverse engineer (although the size and minification/obfuscation of the code may increase the difficulty).

The only way to keep the secret secret is to not send it to the client in the first place - this can be achieved by doing all the rendering work on the server and then sending the resulting HTML markup to the client. (That being said, due to the greater flexibility of client-side rendered components, it's often best practice to not include sensitive values ​​in the client's bundle.)

Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template