1

I have just some general question about react (or rather redux) store security: Is it possible to manipulate the store state somehow from the frontend side? E.g set some "isLoggedIn" or "isAdmin" property to true from the frontend?

I suppose the store is somewhere on the client's browser and held in-memory probably. The store then must come from the javascript bundle loaded and injected into the html on the browser, right? Can I access the store somehow just like some view part in the browser, and then manipulate it? Or is it more complicated?

MMMM
  • 3,320
  • 8
  • 43
  • 80

2 Answers2

5

Yes it can be easily manipulated. Check out the "Application" tab in your browsers DevTools. Depending if you store it in LocalStorage or SessionStorage you can find a JSON-object which is representing the whole storage object. You can also edit or delete it. You can try to add some middleware to the store to sign the current state, but the whole signing and verification code has to be shipped to client and will be executed there. So this will just make things harder for attackers but not impossible. You can do it without the storages and save it to RAM but then the store will be gone when the user refreshes the page.

However on backend site treat every client as liar and doublecheck any authentication/authorization information. In frontend you can split between normal application data and security information. Security related information can be reloaded on every page refresh, but the server response can be manipulated too. So it may be signed with some RSA Public/Privatekey to be save. You can then store this information inside a React Context and provide it to every component.

The normal application data can remain inside the Redux store and used the normal way.

Auskennfuchs
  • 1,577
  • 9
  • 18
-1

Yes you can use store.getState() to get current state and store.dispatch() to set a new value.

There is hooks for alternative also. refer here