生产环境下的React State能否在DevTools等工具中被查看？

首先直接给出结论：生产环境下React的State是可以被外界获取到的，它不是完全无法访问的私有属性。

具体可以分成几种情况说明：

• 默认生产构建下，如果你没有手动禁用React DevTools的挂载能力，安装了React DevTools浏览器插件的用户可以直接在DevTools的React面板中查看、甚至修改任意组件的state、props值，和开发环境的使用体验没有任何区别。
• 如果你在生产构建中添加了禁用DevTools的逻辑，比如执行类似window.__REACT_DEVTOOLS_GLOBAL_HOOK__.inject = () => {}的代码拦截DevTools的注入，普通用户无法再通过官方DevTools直接读取state，但这不代表state完全无法被访问。
• 即使禁用了DevTools，有前端调试经验的用户仍然可以通过断点调试打包后的JS代码、遍历DOM节点绑定的React内部实例属性（一般是__reactProps加随机后缀的隐藏属性）来获取对应组件的state值，只是获取成本比直接用DevTools高很多。

额外提醒：不要将任何敏感信息（比如明文密码、接口签名密钥、未脱敏的用户隐私数据）存储在前端state中，所有前端层面的存储数据本质上都对用户是透明的，不存在绝对的访问隔离。

内容的提问来源于stack exchange，提问作者DerDorius