React - 如何让访问者使用 React 开发工具但不能编辑状态和道具
React - How can I let visitors use react dev tools but can not edit states and props
我一直在开发 React 应用程序，我认为 React 开发工具只能在应用程序的开发版本上使用，但令我惊讶的是我可以在生产版本上使用它，甚至可以更改路线和状态和其他东西。而且我不想从应用程序中完全禁用 React 开发工具（通过向 index.html 添加脚本来卸载它）。
所以我想做的是像 facebook.com 那样禁用对 React 开发工具的编辑（你可以在那里打开 React 开发工具，但你不能编辑任何很酷的道具或状态）
那么有什么好的方法可以在不禁用整个 React 开发工具的情况下做到这一点吗？
你不能也不应该。开发工具旨在为开发目的而构建，因此为什么有人要在生产中提供它。
您唯一的选择是使用以下代码完全删除开发工具：
<script>
window.__REACT_DEVTOOLS_GLOBAL_HOOK__.inject = function () {}
</script>
或者您可以考虑将其与您的环境条件包装起来，这样您就可以在服务器端渲染中执行以下操作：
#{process.env.NODE_ENV == 'production' ? "window.__REACT_DEVTOOLS_GLOBAL_HOOK__.inject = function(){}" : ""}
无论如何，将业务逻辑和敏感数据放回您的服务器仍然是一个好习惯。
我一直在开发 React 应用程序，我认为 React 开发工具只能在应用程序的开发版本上使用，但令我惊讶的是我可以在生产版本上使用它，甚至可以更改路线和状态和其他东西。而且我不想从应用程序中完全禁用 React 开发工具（通过向 index.html 添加脚本来卸载它）。 所以我想做的是像 facebook.com 那样禁用对 React 开发工具的编辑（你可以在那里打开 React 开发工具，但你不能编辑任何很酷的道具或状态） 那么有什么好的方法可以在不禁用整个 React 开发工具的情况下做到这一点吗？
你不能也不应该。开发工具旨在为开发目的而构建，因此为什么有人要在生产中提供它。
您唯一的选择是使用以下代码完全删除开发工具：
<script>
window.__REACT_DEVTOOLS_GLOBAL_HOOK__.inject = function () {}
</script>
或者您可以考虑将其与您的环境条件包装起来，这样您就可以在服务器端渲染中执行以下操作：
#{process.env.NODE_ENV == 'production' ? "window.__REACT_DEVTOOLS_GLOBAL_HOOK__.inject = function(){}" : ""}
无论如何，将业务逻辑和敏感数据放回您的服务器仍然是一个好习惯。