Should one use local storage to persist and reload redux state and JWT across browser restarts?

user_13782227 0
Viewed 269

Is there any rule regarding when to use local storage or not to store state information if I have redux?

For example if I have some online form, then

Q1. should I have its state (currently filled values) persisted to localstorage say when user closes tab or browser, so that I can reload the state in redux from localstorage when user revisits the webpage? Is there any well know / documented security consideration for storing redux state in local storage?

Q2. Or should I always send last saved redux state from the server (and not save and load from localstorage) when user visits the website first time after opening the browser. If that is the case

Q3. If the answer to Q2 is YES, then what about JWT? Should we store JWT in localstorage avoiding forcing user to re-login?

jwt redux reactjs oauth-2.0 javascript
2 Answers

Q1

In terms of OAuth Best Current Practice I would avoid storing anything like this in local storage:

  • Credit card numbers
  • Passwords
  • Access tokens
  • Personally identifiable information, eg name, email

Use browser storage for simple data such as the application path before an OAuth redirect, or simple boolean preferences. Prefer session storage over local storage, unless you need settings across multiple browser tabs.

Q2

Using the server is safest for anything sensitive, so it is worth investing in an API driven save and load option.

Q3

Avoid JWTs in local storage, since there are more attack vectors that could result in stolen data. If you are migrating from this model then start by storing a refresh token in an encrypted HTTP Only SameSite=strict cookie, and store access tokens only in memory.

This will enable you to avoid logins on page reloads or when the user opens a new browser tab, and is easy to implement by routing token requests via a utility API. You could then go further to take access tokens out of the browser completely. See the SPA Best Practices article for further related details.

user_90198850

It depends.

Q1. If it's non-updating data and you don't need to make request to backend for it. You can use localstorage.

Security Issue with localstorage is that user can access it and alter or delete the data. In that case you again need to hit your api for data.

Q2. If the data is updating (eg - posts,likes in blog app). Then you need to make a request to server to fetch the latest data.

Q3. Yes, mostly jwt is stored in localStorage which avoid user to re-login. If the user try to alter the jwt, the backend has methods to check it. read How jwt works

user_150116210
Related