'How to store sensitive data in react js frontend?

I want to clear this issue. I'm new to react js. but I need to store some sensitive data in frontend. just like database name, database password, and database username. I have used universal-cookie and local storage also. but it seems like not secure. because anyone can edit that data if they inspect the page and open the cookie tab. I just want to know if there is a way to make these cookies uneditable or suggest to me if there is a better way to keep this data in frontend?

Thanks in advance

i have edited the access token and dbname for testing

reactjscookieslocal-storage


Solution 1:[1]

Normally sensitive data are not saving on frontend. best way is you can call this from server using http request. Or you can use local storage,cookies,session storage etc. env setup is another way. Or you can use thirdparty storge for this, many free & trusted resources are available

Solution 2:[2]

Ideally you do not want to, you should always send it encrypted from your BE> But if you must you can create a .env.local file at the root of your react project and put all your variables there. The variable names should start REACT_APP. there should be NO space/quotations around your values in this file

REACT_APP_DB_PASS=your_pass
REACT_APP_DB_ID=your_id

and then you can access them from the process.env object like this

process.env.REACT_APP_DB_PASS

Sources

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

Source: Stack Overflow

Solution Source
Solution 1 Nowfal
Solution 2 ssaquif

Related Questions