Question

有没有办法防止生产前端的任何道具/州改变？

我尝试过关注，但它完全禁用了开发工具：

if (typeof window.__REACT_DEVTOOLS_GLOBAL_HOOK__ === 'object') {
  for (let [ key, value ] of Object.entries(
    window.__REACT_DEVTOOLS_GLOBAL_HOOK__
  )) {
     window.__REACT_DEVTOOLS_GLOBAL_HOOK__[key] =
       typeof value === 'function' ? () => {} : null;
  }
}

Answer 1

我在使用React 16.3作为UI库的Meteor应用程序中使用以下代码。

window.__ALLOW_REACT_DEVTOOLS__只是我在服务器发送的SSR html中设置的标志，因为这行代码需要排除任何React代码，我需要在浏览器中process.env之前使用它。在服务器上，我在生产中将该值设置为false。

<script>
  if (
    !window.__ALLOW_REACT_DEVTOOLS__ &&
    window.__REACT_DEVTOOLS_GLOBAL_HOOK__ &&
    typeof window.__REACT_DEVTOOLS_GLOBAL_HOOK__ === "object"
  ) {
    for (let [key, value] of Object.entries(window.__REACT_DEVTOOLS_GLOBAL_HOOK__)) {
      window.__REACT_DEVTOOLS_GLOBAL_HOOK__[key] = typeof value == "function" ? ()=>{} : null;
    }
  }

  delete window.__ALLOW_REACT_DEVTOOLS__;
</script>

使这项工作的关键是它在React之前加载。

这将完全禁用React-Devtools。当您点击devtools选项卡时，它只会说＆＃39;寻找反应......＆＃39; 。

Answer 2

好的，找到了一种防止该功能被注入/参与的方法。

我刚刚将禁用者代码更改为此：

//为此项目禁用react-dev-tools

 if (typeof window.__REACT_DEVTOOLS_GLOBAL_HOOK__ === "object") {
        for (let [key, value] of Object.entries(window.__REACT_DEVTOOLS_GLOBAL_HOOK__)) {
            window.__REACT_DEVTOOLS_GLOBAL_HOOK__[key] = typeof value == "function" ? ()=>{} : null;
        }
    }

防止React dev工具改变道具/状态

2 个答案: