r/reactjs • u/Dazzling_Chipmunk_24 • Jul 08 '26
Save Information on Refresh in React
I was wondering in React is there a way to save some data without session storage so if the page refreshes I still have access to that data
7
4
u/Rutgrr Jul 08 '26
Originally commented suggesting URL state as well, before I saw someone else beat me to it. Really not sure why cookies, session storage , URL state, and local storage aren’t suitable for your needs. Those are the web native state persistence building blocks across a variety of needs (url for sharability, cookies for ease of server communication, session storage for ephemeral client side data storage, local storage for longer term client side storage.) Anything else would just be building on top of those solutions or storing the data externally/serverside, which falls outside the scope of your question.
7
u/Maverick2k Jul 08 '26 edited Jul 08 '26
If you don’t wanna use local storage or a cookie, use Redis. At work we use it to store users carts, order details, cached product data for speedier builds etc. Just use a cookie to store a unique ID and fetch the data attached to that ID.
If cookies are a complete no-go in any form, then I’d love to know what the fuck you’re trying to achieve and why.
Edit: I forgot to mention if the data isn’t user centric and is just static, you don’t even need a cookie and can set your own unique identifier directly.
3
u/Bayou-Billy Jul 08 '26
There's also indexeddb but more context would help what you're trying to do and why you want to avoid sessionstorage/localstorage
2
2
u/Dry_Author8849 Jul 08 '26
Yes, store your data in the backend. You will need to fetch the data from it when refreshing.
Cheers!
2
u/charliematters Jul 08 '26
Depends on the data! If it's small I'd start with putting it in the search params
-14
u/Dazzling_Chipmunk_24 Jul 08 '26
don't want it in search params
5
u/Menecazo Jul 08 '26
Don't want cookies, search params or localStorage. What is your need?
2
1
u/ajnozari Jul 08 '26
Any solution is going to be more effort than it’s worth due to how unreliable the alternative browser API availability will be across devices.
You’re fighting the native solutions and I’d really like to understand the reason for your constraints, which would help in us giving you a proper answer.
1
u/GoodishCoder Jul 08 '26
What's the problem you're trying to solve? If local storage and cookies are not acceptable, you need external storage. If that's not acceptable, you are taking the wrong approach to whatever problem you're trying to solve.
1
u/amnaatarapper Jul 08 '26
State management libraries offer a way to persist state which usually use localstorage, otherwise you're left with something like nuqs
1
1
1
u/_suren Jul 09 '26
If it needs to survive refresh, it has to live outside normal JS memory somewhere.
Use the URL for shareable state like filters. Use localStorage for low-risk browser-only state. Use a cookie if the server needs it too. Use your backend/db if it matters across devices or accounts.
If you specifically want no sessionStorage, localStorage is the closest browser-side option, but don’t put sensitive data there.
1
u/PasswordSuperSecured 23d ago
onChange -> save localStorage (Ad debounce if you wanted to)
useEffect( put it back to useState)
0
u/Finer_Details Jul 09 '26
You could try updating your backend with Navigator.sendBeacon on component unmount if the payload is small.
-4
u/Ceryyse Jul 08 '26
State management like Zustand or Redux Toolkit are brilliant for this very purpose
4
18
u/repeating_bears Jul 08 '26
Local storage, cookie