如何防止他人打开浏览器开发者工具

背景

昨天突发奇想，在文心一言的的页面上，打开开发者工具，想要查看一下它的接口请求，但是发现直接debugger卡住，无法查看请求内容。

有意思，居然通过debugger来防止他人使用开发者工具。这个时候好奇心来了，那么有哪些方式可以在应用中防止他人打开浏览器开发者工具呢？以及又有什么对策破解呢？

方式

通过使用debugger，当有人想用开发者工具查看你的代码和请求时，就会出现debugger。

<script>
      setInterval(function() {
        check();
      }, 2000);
      var check = function() {
        function doCheck(a) {
          if (('' + a / a)['length'] !== 1 || a % 20 === 0) {
            (function() {}['constructor']('debugger')());
          } else {
            (function() {}['constructor']('debugger')());
          }
          doCheck(++a);
        }
        try {
          doCheck(0);
        } catch (err) {}
      };
      check();
 </script>

破解

通过开发者工具的Deactive breakpoints跳过断点，点击该按钮，然后刷新页面即可。