当不想让自己的代码被调试时,需要禁用F12功能。
整理了以下几种方法:
经测验,第一种方法和第二种方法结合使用最优。
1.打开调试时跳转页面。
(缺点:火狐及QQ浏览器不生效。)
<script>
//debug调试时跳转页面
var element = new Image();
Object.defineProperty(element,'id',{get:function(){window.location.href="https://www.baidu.com"}});
console.log(element);
</script>
2.无限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>
3.devtools-detect
缺点:原理为检验窗口大小是否正常。
浏览器开启手机模式或者F12开启全屏模式均检测不到
网址
4.最笨的办法
(缺点:先打开F12后访问页面无法禁用。右击点检查无法禁用。)
<script>
window.οnlοad=function(){
document.οnkeydοwn=function(){
var e=window.event||arguments[0];
if(e.keyCode==123){
window.location.href="https://www.baidu.com"
}else if((e.ctrlKey)&&(e.shiftKey)&&(e.keyCode==73)){
window.location.href="https://www.baidu.com"
}
};
}
</script>
5.计算debugger的时间差
(缺点:关闭debugger就无法检测了)
<script>
function consoleOpenCallback() {
alert("CONSOLE OPEN");
}
!function () {
const handler = setInterval(() =&gt; {
const before = new Date();
debugger;
const after = new Date();
const cost = after.getTime() - before.getTime();
if (cost &gt; 100) {
consoleOpenCallback();
clearInterval(handler)
}
}, 1000)
}();
</script>
综上所述,第一种第二种方法结合使用能有效禁用开发者工具。