Vuex persisted state doesn't remove state after closing tab

Question

I use vuex-persistedstate package https://github.com/robinvdvleuten/vuex-persistedstate to persist data state on browser.

When I logout from the app, the package clears all the state info about the authenticated user. However, I realized that, it doesn't remove the sensitive data after closing the tab and the jwt token expires, and it is still reachable on the local storage.

Any recommendation to handle this ?

Answer 1

If you want to store data for the lifetime of the current tab only, you need to store data inside the sessionStorage instead of inside the localStorage. vuex-persistedstate makes this easy for you.

When you create an instance of this plugin, you can specify an options object, and this object can have a link to the sessionStorage, if you want to use that instead.

import createPersistedState from 'vuex-persistedstate'

const store = new Vuex.Store({
    // ...
    plugins: [createPersistedState({
        storage: window.sessionStorage,
    })],
})