CODEWITHSUNDEEP
reactjsredux
Hafiz Temuri
Hafiz Temuri

Reputation: 4112

How to reset the Redux state in all browser sessions (tabs)

So lets say a user has multiple tabs open, each would have a its own redux session (state). I am saving user's access token in Redux and Local Storage. Because I dont want to check Local Storage every time if the access token exists in Redux. But on Logout, it deletes from Local Storage and from the current Redux session. But if the user has multiple tabs open, the access token persisted in other tabs until refreshing the page. How can I remove something from all the Redux states in all the different tabs? So that if you logout from one tab, you will be logout from all.

Upvotes: 2

Views: 2060

Answers (2)

timotgl
timotgl

Reputation: 2925

While redux-state-sync solves the problem by syncing the state in different tabs, I'd argue that using BroadcastChannel (see second answer here Communication between tabs or windows ) would be cleaner and simpler.

Ultimately you want to communicate with the other tabs solely by broadcasting a "log out now" message rather than keeping all the stores in sync.

It's not a redux-specific problem. The fact that you want to dispatch an action in the other tabs is just implementation detail, it could be anything else JS does.

Upvotes: 0

Zohaib Ijaz
Zohaib Ijaz

Reputation: 22875

You can use redux-state-sync https://github.com/AOHUA/redux-state-sync to fix this issue. This broadcasts event which will be caught by other tabs and state will remain same across tabs.

See the docs for more details.

Upvotes: 4

Related Questions