JS 检测 DevTools 是否打开

逼哥分享了个好玩的东西，里面有一段代码，可以让浏览器在开启 F12 的 devtool 工具的时候，自动跳转到百度页面。

逼哥也分享了代码和讲解了逻辑，感谢逼哥的分享，我在这分享一下。

var element = new Image();
var devtoolsOpen = false;
element.__defineGetter__('id', function () {
  devtoolsOpen = true; // This only executes when devtools is open.
});
setInterval(function () {
  devtoolsOpen = false;
  console.log(element);
  document.getElementById('output').innerHTML += devtoolsOpen
    ? 'dev tools is open\n'
    : 'dev tools is closed\n';
}, 1000);

然后我再网上也找了几个大同小异的代码

var minimalUserResponseInMiliseconds = 100;
var before = new Date().getTime();
debugger;
var after = new Date().getTime();
if (after - before > minimalUserResponseInMiliseconds) {
  // user had to resume the script manually via opened dev tools
  document.getElementById('test').innerHTML = 'on';
}

var devtools = function () {};
devtools.toString = function () {
  if (!this.opened) {
    alert('Opened');
  }
  this.opened = true;
};

console.log('%c', devtools);
// devtools.opened will become true if/when the console is opened

还有个检测函数

function isInspectOpen() {
  console.profile();
  console.profileEnd();
  if (console.clear) console.clear();
  return console.profiles.length > 0;
}

JS 检测 DevTools 是否打开

参考文章