如果刷新网页，Vuex存储为空

Question

如何保持我的商店，如果我刷新一个网页？

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


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

我使用历史模式，但如果我重新加载我的网页，我的商店是空的。有解决办法吗？

Answer 1

要在应用程序刷新后保持状态数据，可以使用localstorage或sessionstorage。

>

XSS:在localstorage中存储令牌的问题，正如您所说的，是应用程序容易受到XSS（跨站点脚本）攻击。除此之外，它还是相当安全的。localstorage绑定到域，因此www.yourapp.com的数据即使在浏览器关闭后也会留在那里。与Cookie不同的是，您不必管理哪个站点发出了请求。浏览器上具有相同域的所有选项卡都能够使用localstorage中的数据

如果不需要上述行为，您可以使用sessionstorage，它的工作方式几乎相同，但当浏览器关闭时数据会被清除。

使用cookies时，它们肯定有助于防止令牌被XSS拿走，但您必须确保还提供csrf-token以防止CSRF（跨站点请求伪造）攻击。

如果您打算继续使用Cookie，那么请确保它们的头中的HttpOnly标志设置为true，否则它们就不好了。

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

我将在这个答案中添加来源以供参考。

>

使用无状态(=无会话）身份验证时是否需要CSRF令牌？检查接受的答案以及其他答案。

https://github.com/owasp/cheatsheetseries/blob/master/cheatsheets/html5_security_cheat_sheet.md