2

Currently I'm developing a React web application that needs to store some data from user in the client side and also this data are Important and should not swap suddenly so we can't use Indexed DB.

I just thought about using a file to store data as JSON but in a file that can be stored in user computer and also access to read and write it from React.

Heretic Monkey
  • 11,687
  • 7
  • 53
  • 122
Sina Farhadi
  • 785
  • 4
  • 18
  • 1
    Does this answer your question? [Persist variables between page loads](https://stackoverflow.com/questions/29986657/persist-variables-between-page-loads) – Heretic Monkey May 14 '21 at 16:18
  • 1
    What do you mean by "*should not swap suddenly*"? Do you want the user be responsible for downloading, storing, and uploading that json file? – Bergi May 14 '21 at 16:35
  • 1
    @HereticMonkey No, I don't think so – Sina Farhadi May 14 '21 at 18:29
  • 1
    @Bergi Yes but not like that, I mean that user may accidentally remove chrome and browser cookies and indexDB and so the data that is important will be removes – Sina Farhadi May 14 '21 at 18:31
  • 1
    @Sina You can't really guard against that. Either you store the data in localStorage/indexedDB, or you store it for the user on your servers, or you let the user store it themselves as a backup file (that they might still lose). – Bergi May 14 '21 at 19:06
  • 1
    And yet, the answers to that question tell you exactly how to save data, client-side, with the ability to read and write from React. As @Bergi says, there is no way of storing user data in a place where a user can't destroy it. If nothing else, they could simply turn off their computer before your program has the chance to save the data. – Heretic Monkey May 14 '21 at 19:42

2 Answers2

2

What you're looking for is the in-browser sessionStorage or localStorage. Having the ability a JSON file to a user's computer would be a major vulnerability and is not possible from a browser/client. I suppose you could create one and trigger a download for them to accept–and then have them subsequently re-upload it when you need the data again. But, I'd argue that session/localStorage is more what you're looking for.

LMulvey
  • 1,662
  • 8
  • 14
2

The best way to work with that is using localStorage. Cookies are mainly for reading server-side, and local storage can only be read by the client-side. Other point is saving data, a big technical difference is the size of data you can store, localStorage give you more space. Check it out https://medium.com/@siobhanpmahoney/local-storage-in-a-react-single-page-application-34ba30fc977d

P Purcinelli
  • 109
  • 8
  • 1
    I'm looking for a way storing a data that will not removes when user clears the browser cache or cookies – Sina Farhadi May 14 '21 at 18:34
  • 1
    @Sina LocalStorage is (unlike SessionStorage) not a *cache* that's cleared. It's application data. – Bergi May 14 '21 at 19:07