浏览器F12调试工具监测

javascript

浏览器F12调试工具弹出时的监测

最近笔者在浏览别人的网站时，发现一个酷炫的效果，于是职业习惯的驱使，F12,元素检查，不过，这时候页面弹出debug，什么情况？原来，作者不想让别人剽窃他的代码。
这个功能是怎么做到的呢？
笔者上网查了下，都是一些大神搞得hack方式，具体代码啥意思，大家也不清楚，贴一个比较简单而且自测兼容性比较好的代码。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
  <h1>F12监测</h1>
</body>
<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>
</html>

再贴两个专门监测的插件库：

  浏览器