在我的应用中,我使用 firebase API 进行用户身份验证
我将登录状态保存为我的 vuex 状态中的 bool 值
当用户登录时,我将登录状态设置为 true,并使用它隐藏顶部菜单中的登录按钮并在用户注销时显示注销按钮,反之亦然。
所以我使用vuex-persisted state保存页面刷新状态
vuex-persisted state默认存储是本地存储
我不想将存储状态保存在本地存储中,而是希望将其保存在 cookie 中...所以我遵循了与 vuex-persisted state 中描述的相同方法文档
我面临的问题是:
当我使用默认存储(即本地存储)时,它可以工作,但是当我使用 cookie 时,状态不会保存在 cookie 中,持久化状态也不起作用
当我在 2 个不同的选项卡上打开应用程序并且用户在一个选项卡中注销时,状态在两个选项卡中同步,但注销按钮仍显示在另一个选项卡中
我的商店
import Vue from 'vue'
import Vuex from 'vuex'
import createPersistedState from 'vuex-persistedstate'
import * as Cookies from 'js-cookie'
import authStore from './modules/auth'
import statusStore from './modules/allStatus'
Vue.use(Vuex);
export const store = new Vuex.Store({
modules: {
authStore,
statusStore
},
plugins: [
createPersistedState({
getState: (key) => Cookies.getJSON(key),
setState: (key, state) => Cookies.set(key, state, { expires: 3, secure: true })
})
]
});
最佳答案
这里是vuex-persistedstate
的作者。
您确实尝试过在“安全连接”上设置您的 cookie。尝试将 secure
设置为 false
应该可以解决问题。否则在存储库上打开一个问题。
关于vue.js - 页面刷新和多个选项卡上的 Vuex 状态,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43090136/