如果我刷新网页,如何保持我的店铺?

    let store = new Vuex.Store( {
    modules: {
        demo, auth
    },
    strict: true
} );


let router = new VueRouter( {
    mode: 'history',
    saveScrollPosition: true,
    routes: routes
} )

我使用历史模式,但如果我重新加载我的网页,我的store 是空的.

推荐答案

要在应用程序刷新后保留状态数据,可以使用localStoragesessionStorage.

  1. XSS:正如您所说,将令牌存储在localStorage中的问题在于应用程序易受XSS(跨站点脚本)攻击.除此之外,它是相当安全的.localStorage绑定到域,因此即使浏览器关闭,www.yourapp.com的数据也将保留在域中.与cookie不同的是,您不必管理发出请求的站点.浏览器上具有相同域的所有选项卡都将能够使用localStorage中的数据

    当浏览器关闭时,如果数据几乎可以被清除,那么它可以被清除.

  2. 至于Cookie,它们肯定会帮助保存被XSS拿走的令牌,但你必须确保还提供csrf-token,以防止CSRF(跨站点请求伪造)攻击.

    如果你打算继续使用cookie,那么确保它们的标题中的httpOnly标志设置为true,否则它们就不好.

总的来说,我已经看到localStorage是一个非常普遍推荐的用于维护令牌和其他应用程序数据的解决方案.

我将为这个答案添加来源以供参考.

  1. CSRF Token necessary when using Stateless(= Sessionless) Authentication?

  2. 一百

  3. 一百

  4. https://www.whitehatsec.com/blog/web-storage-security/这将让您了解使用本地存储的trap 和操作方法.

Vue.js相关问答推荐

无法解析组件:google—pay—button

为什么元素会从Vue 3中的TransitionGroup左上角出现?

vuejs:在确认提示之前更改 HTML

视图中的 vue 样式不适用于 html

在计算(computed)属性上调用数组方法

nuxt.js auth 始终重定向到登录,而不是允许转到带有 auth: false 的页面,

Vue 脚本标签中更漂亮的 destruct 功能

Webpack 编译错误:TypeError: __WEBPACK_IMPORTED_MODULE_1__ … is not a function

webpack vue-loader 配置

使用 Laravel 作为后端刷新 Vue.js SPA 的身份验证令牌

如何将 vuejs 项目部署到 heroku

可以同时使用 Tailwind css 和 Bootstrap 4 吗?

在 vuejs 中的图像中包含 router-link 标记

如何根据生产或开发模式读取不同的 .env 文件?

我可以使用 vue.js v-if 来判断值是否存在于数组中

为什么 vue 文档说 refs 不是响应式的,而实际上它们是响应式的

我可以避免使用 Vue.js 组件的重复样式吗?

如何确定 Vue 何时完成更新 DOM?

带有后退按钮的 Vue.js 路由

vue-router如何持久化导航栏?