Vuex Store是否可以从控制台或客户端的浏览器访问？
Mar*_*ert 10 vue.js vue-component vuex vuejs2
我正在构建这个Vue 2应用程序,我一直在阅读一个人应该使用Vuex State管理,一开始我不太了解它的概念,但现在在玩了Vue之后,我可以看到它是一个更大的应用程序.
但我的问题是,有人可以从Dev控制台或任何形式访问存储在store.js中的数据,我的意思是那些我不会渲染到浏览器的数据？
我可以将灵敏数据保存在商店,敏感,我的意思是,用户点击此链接,向此用户发送消息,在此页面上花了这么多时间等...并且平均时间将所有这些数据上传到我的数据库..
Vuex商店是否适合这种工作/工作？
干杯
dot*_*hen 41
2022答案
视图2：
Array.from(document.querySelectorAll('*')).find(e => e.__vue__).__vue__.$store.state
视图3：
Array.from(document.querySelectorAll('*')).find(e => e.__vue_app__).__vue_app__.config.globalProperties.$store.state
该代码适用于所有生产站点，包括远程移动调试，并且不需要开发模式。
dspeyer的答案是我答案的基础，但基于标签<a>并不适用于所有应用程序。所有其他答案都假设 Vue 处于开发模式，不适用于移动网络浏览器上的生产站点。感谢Joe Maffei的 Vue 3 更新。
dsp*_*yer 26
是的他们可以.
我使用的调用是
document.getElementsByTagName('a')[0].__vue__.$store.state
这假定第一个链接具有vue属性,这几乎总是如此.如果没有,请尝试其他标签.用户界面令人不愉快,但充分自我记录.它是一个有用的调试工具,用户可以做的事情.
当然,一个坚定而熟练的用户可以编写一个浏览器插件来为此设置一个好的UI.或者这可能是Chrome的Vue.js devtools扩展程序的作用？我实际上并没有使用它.
- 由于几乎所有 vue 应用程序都是在 `<div id='app'></div>` 元素上初始化的，因此您只需使用 `document.getElementById('app').__vue__....` (5认同)
- 如果第一个“a”标签不是 vue 实例，您可以使用 `Array.from(document.getElementsByTagName('a')).find(e => e.__vue__).__vue__` 它将返回 vue 实例（如果有人在的话） (4认同)
- IIRC`Vue Devtools`仅在应用程序正在开发中运行([not production](https://vuejs.org/v2/guide/deployment.html))模式且启用了源映射时才有效. (2认同)
- 在 Vue 3 中，我可以通过 document.getElementById('app').__vue_app__.config.globalProperties.$store.state` 访问它 (2认同)
