javascript - 在 Vuex 中存储敏感数据

Question

总而言之，我们正在使用 Vue在前端和 Hapi JS在后端。前端使用MSAL.js对用户进行身份验证，然后将访问 token 传递到后端。访问 token 使用 hapi-auth-jwt2 进行解码和 validate()函数返回{ isValid: true, credentials : { ps_ref: 12345, md_userid: <a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="04657762657763776344313c33302a676b69" rel="noreferrer noopener nofollow">[email protected]</a> }} 。然后，该对象被传递到路由的处理程序函数，该函数从我们的数据库和用户数据中提取身份验证组/用户 Angular 色(即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 的人都可以看到它。

我们的问题是:

1. 在生产环境中访问 Vuex 有多容易？

2. 如果公众可以很容易地访问 Vuex，那么 Vuex 是存储该对象的最佳方式吗？如果我们选择 Vuex，我们是否应该对用户对象或至少其中的 Auids 进行编码？

Answer 1

您存储在 js/html/cookies 中的所有内容都不会单独保存。但这都与您将如何管理它有关。基本上，您可以在前端存储几乎所有内容，只要它不是可用于道德黑客的敏感数据。地址、契约(Contract)号、银行账户等信息。

诸如 userIds(只要仅出于编程原因使用)或用户 Angular 色之类的数据可以存储在前端。但如果你做得正确，你的后端应用程序中也始终会进行每个客户端验证。

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