很多网站为了应对爬虫调试 会在代码中插入Debugger 此时一旦F12打开调试界面就会被断住
Debugger分为三种 非虚拟机、虚拟机和API
错误方法
首先介绍一种 能绕过所有Debugger 但是却杀敌一千自损八百的方法（不推荐）
image-20220604133204086.png
将activate breakpoints打开 此时所有断点都会失效
这样即可绕过所有Debugger 但同样你自己也不可以下断了 所以不推荐
非虚拟机
这种Debugger一般写在js代码中 形成原理如以下代码
function myDebugger() {
debugger;
console.log(1);
}
myDebugger(); // 此处如果加一个循环 就会陷入无限Debugger
如果是单个Debugger可以用如下方法解决
方法一
image-20220604134234103.png
首先在Debugger那一行下断 然后右键 Continue to here 这样即可跳过这种断点
方法二
image-20220604134754810.png
首先在Debugger那一行下断 然后右键 Edit breakpoint
image-20220604134941897.png
将Debugger属性修改为false 即可跳过断点
循环debugger解决方法 :: 代码替换
方法一
谷歌内核默认提供替换工具
image-20220604135941150.png
在 Sources 面板下 有一个 Overrides 面板 然后Select folder for overrides(随便选择一个空文件夹)
image-20220604140254350.png
然后再浏览器上方会出现一个横条 申请权限 这里点允许
image-20220604140532747.png
然后对于你要重写的js文件 右键 save for overrides
image-20220604140713151.png
此时文件前方会出现一个紫色的小圆圈 这就代表着 这个js代码你可以任意重写
删除debugger代码 ctrl+s保存 然后刷新网页即可
方法二
浏览器插件 如油猴等 这里不做赘述
方法三
代理替换 如Fiddler 这个后续会单独写一篇博客详细讲解
虚拟机 (eval Function)
这种Debugger形成原理如以下代码
var VMDebugger = Function.prototype.constructor("debugger;")
VMDebugger(); // 此处如果加一个循环 就会陷入无限Debugger
或者
eval("debugger;");
代码运行后 会进入虚拟机中
image-20220604142534855.png
此时已经被Debugger断住
方法一
image-20220604142844301.png
在Call stack中 回退到上一个js调用栈
然后就可以用非虚拟机中代码替换的方式 对js代码进行处理 以此绕过Debugger
缺点是 js中可能对"eval"或“function”进行混淆 此时如果想替换混淆后的代码 需要知道是如何被混淆的
方法二
从"eval"和"Function"下手 对他们进行hook操作 代码如下
Function.prototype.constructor = function(){}
缺点是 如果hook的代码中 除debugger外 还有业务逻辑 那么整个前端的运行会出问题
那么我们需要对他进行改进
Function.prototype.constructor = function(x){
if(x){
// 替换debugger
}
}
判断传入参数x中 有没有debugger 如果有替换成相同长度空格(可能会对传入长度进行检测)
网友评论