检测浏览器控制台是否有打开实现无限debugger

145 阅读1分钟

下载依赖包

npm install devtools-detector --save

使用方法

ES6 & TypeScript

import { addListener, launch } from 'devtools-detector';
const view = document.createElement('div');
document.body.appendChild(view);

// 1. add listener
addListener(
  isOpen =>
    (view.innerText = isOpen
      ? 'devtools status: open'
      : 'devtools status: close')
);
// 2. launch detect
launch();

AMD

require(['devtools-detector'], function(devtoolsDetector) {
  var view = document.createElement('div');
  document.body.appendChild(view);

  devtoolsDetector.addListener(function(isOpen) {
    view.innerText = isOpen
      ? 'devtools status: open'
      : 'devtools status: close';
  });
  devtoolsDetector.launch();
});

No Module System

<script src="node_modules/devtools-detector/lib/devtools-detector.js"></script>
<script>
  var view = document.createElement('div');
  document.body.appendChild(view);

  devtoolsDetector.addListener(function(isOpen) {
    view.innerText = isOpen
      ? 'devtools status: open'
      : 'devtools status: close';
  });
  devtoolsDetector.launch();
</script>

使用示例 在html中引入该文件

import {addListener, launch} from 'devtools-detector';
let myIsOpen = false;
// 1. add listener
addListener(
    isOpen => {
        myIsOpen = isOpen;
    }
);
// 2. launch detect
launch();

const timeId = setInterval(()=>{
    if(myIsOpen){
        Function("debugger").call();
        setTimeout(()=>{
            if (myIsOpen) {
                window.location.href = "http://www.baidu.com"
            }
        },200)
    }
},1000)

window.onbeforeunload = function (){
    clearInterval(timeId)
}