JS调试检测 及 绕过方法

禁止打开控制台

较为简单的反调试手段，常见如下方案：

• 禁用鼠标右键
• 禁用 F12
• 禁用 Ctrl+Shift+i

绕过方案也很简单，可采用如下方式：

1. 提前打开控制台，随后访问网页
2. 设置 --> 更多工具 --> 开发者选项

时间差异

这是一种从传统反逆向技术借鉴过来的反调试技巧。当脚本在 DevTools 等工具下执行时，运行速度会非常慢，所以我们可以根据运行时间判断脚本是否正在被调试。

演示代码如下：

setInterval(function () {
    start_time = new Date().getTime();
    debugger;
    stop_time = new Date().getTime();
    if (stop_time - start_time > 600) {
        alert('go out!')
    }
})

Object.defineProperty检测

利用了 div 元素的 id 属性，当打印 div 元素时，浏览器会自动尝试获取其元素id。如果代码在调用了 console.log 后又调用了 getter 方法，说明控制台当前正在运行。

演示代码如下：

let div = document.createElement('div');

function start_timer() {
    return setInterval(function () {
        console.log(div);
        console.clear()
    }, 500)
}

timer = start_timer();

Object.defineProperty(div, "id", {
    get: () => {
        clearInterval(timer);
        alert("go out!");
        timer = start_timer();
    }
});

检测窗口大小

检测窗口大小比较简单，首先需要明确两个概念，窗口的 outer大小 和 inner大小

• window.innerWidth / window.innerHeight：可视区域的宽高，包含滚动条的宽度
• window.outerWidth / window.outerHeight：会在 inner 的基础上加上工具条的宽度

具体实现代码可参考如下仓库：devtools-detect

缺点：

1. 使用 window属性检查大小可能会有浏览器兼容的问题
2. 此方案存在一个漏洞，例如在 Chrome中，若 开发者工具窗口设置为 单独窗口，则无法检测，可前往如下网站测试：https://sindresorhus.com/devtools-detect/