在 Vuex 中存储敏感数据答案

【问题标题】：Storing sensitive data in Vuex在 Vuex 中存储敏感数据
【发布时间】：2020-02-01 19:26:14
【问题描述】：

总而言之，我们在前端使用Vue，在后端使用Hapi JS。前端使用MSAL.js 对用户进行身份验证，然后将访问令牌传递给后端。访问令牌使用hapi-auth-jwt2 解码，validate() 函数返回{ isValid: true, credentials : { ps_ref: 12345, md_userid: asfasgsg@5874.com }}。然后将该对象传递给路由的处理函数，该路由从我们的数据库和用户数据中提取身份验证组/用户角色（即Auids）并返回。

想象一下用户对象看起来像这样：

{
  Auids: (4) ["user", "webadmin", "accounts"]
  md_clock: 5678
  md_picture: "./images/"
  ps_fname1: "Test Name"
  ps_surname: "Test Surname"
  psname: "Test Name Test Surname"
  psref: 125125
}

现在，我们希望将此对象存储在 Vuex 中，但是，我们担心任何在浏览器中安装了 Vue Devtools 的人或执行rootElementOfApp.__vue__.$store之类的任何人都可以看到它。

我们的问题是：

在生产环境中访问 Vuex 有多容易？
如果公众可以很容易地访问 Vuex，那么 Vuex 是存储此对象的最佳方式吗？如果我们选择 Vuex，我们应该编码用户对象还是至少编码其中的 Auid？

【问题讨论】：

我一直在使用 Chrome Vue Devtools。您的代码必须以“开发”模式构建才能正常工作。在“生产”模式下，它们不会出现。

标签： javascript security vue.js vuex encode

【解决方案1】：

您存储在 js/html/cookies 中的所有内容都不是自己保存的。但这一切都与您将如何管理它有关。基本上你可以在前端存储几乎所有东西，只要它不是可用于道德黑客的敏感数据。地址、合同号、银行账户等。

像 userIds（只要只用于编程原因）或用户角色之类的数据可以存储在前端。但如果你做对了，你的后端应用程序中也总是有每个客户端验证。

就 vue 的开发工具而言，它们仅在开发模式下可用，而不是在生产模式下可用。但优秀的黑客不会介意。

【讨论】：