How to handle redirects depending on LocalStorage?
Answered
White-horned horntail posted this in #help-forum
White-horned horntailOP
There are a few pages in my Next app that shouldn't be loaded if there are some values missing in LocalStorage. For example,
I considered using middleware, but that runs on the server, and won't have access to localStorage. What is the ideal way to solve this? I am using App Router.
/buy should not be loaded if localStorage does not have the key verified, and should be redirected to /signup instead.I considered using middleware, but that runs on the server, and won't have access to localStorage. What is the ideal way to solve this? I am using App Router.
Answered by Ray
try to use cookies instead or do it on client side if you need to use localStorage
9 Replies
Ray
try to use cookies instead or do it on client side if you need to use localStorage
Answer
White-horned horntailOP
Is there a way to do it in the client side without putting the redirection logic in the page?
For example, we have one
metadata.ts file that contains all the redirection logic if we want to do it in the server side. Is it possible to have all the redirection logic in one file for the client side too?Ray
no, if you are using
localStorage in metadata.tsWhite-horned horntailOP
Okay, thanks.
Komondor
I'm pretty sure any user can edit the values in LocalStorage, so I would be cautious about using that to prevent access from certain pages
Asian black bear
A common technique is to wrap the cookie with
iron-webcrypto or even using iron-sessionUsers can look at cookies too, they are just harder for malicious JS to see if properly configured. In either case, iron is a pretty good way to handle it.
White-horned horntailOP
I know. The value they use will still be validated in the backend. But for the frontend to work, I am using the localStorage. My use case is a bit more convoluted, so I overly simplified it.