突破前端反调试--阻止页面不断debugger

问题复现

一次扒某网站的前端代码，打开控制台要看Network，结果发现他们页面一打开控制台就不断的debugger，100ms一次，很影响看页面内容。就像下面这样的

问题分析

每次在断点处停下来的时候页面都会跳到source这个tab页面，也可以看到他的debugger的代码，其实他的实现很简单，只有这一行代码

(function() {var a = new Date(); debugger; return new Date() - a > 100;}())

虽然简单，可是却颇有效。

• 不停地打断你，页面跳到source页面，阻止你看他代码不
• 断的产生不可回收的对象，占据你的内存，形成内存泄漏，没过多久浏览器就会卡顿

因此他带来的影响仍是挺大的，咱们须要解决这个问题。

问题解决

这个问题解决起来仍是蛮简单的，问题解决只须要一句话：禁止断点。
而对应的操做是在Chrome控制台的Source Tab页点击Deactivate breakpoints按钮或者按下Ctrl + f8(下图)。

这样就能禁用断点了，问题就获得了解决，可是当你须要调试的时候记得要起他哦。很简单的操做，可是你若是对Chrome控制台调试不熟悉的话仍是比较头疼的。在这里记录一下，分享给更多的人。

更新

2018-09-10更新

后来发现这种作法有时候有些不妥，就好比有咱们看别人网站代码有时候就是为了调试网站的代码，那么这时咱们这么直接干脆的禁止断点后咱们也没办法调试网站的代码了，那这就有点杀敌一千自损八百的意思。那有什么办法能够知足咱们既能阻止网站一直debugger还能让咱们继续调试网站的代码呢？这就要看网站怎么实现不断debugger了:
有的网站作的比较简单，是用具名函数作的，相似这样

1. setInterval(startDebug, 100); // 举个例子而已，不少网站并非这么实现的

2. function startDebug() { debugger; };

这种状况比较好解决，咱们随便从新定义这个方法就好了，形如:

function startDebug() {};

可是也有的网站作的比较厉害点，用匿名函数来实现，形如:

setInterval(function () { debugger }, 100); // 举个例子而已，不少网站并非这么实现的

这种状况就比较蛋疼了，目前我是没啥解决方法，若是有人知道的话，不妨在下面留言了。

2019-03-13更新

下面有位老兄(@XYShaoKang)提到用条件断点来应对这样的实现

setInterval(function () { debugger }, 100); // 举个例子而已，不少网站并非这么实现的

我试了下，确实能够，可是有局限性。
先说能够应对的状况，一个动图说明问题。

再来讲说不能应对的状况，仍是一个动图说明问题。

也就是说，条件端点的适用状况与具体代码的书写风格有关系。
另外，我发现Add conditional breakpoint下面的Never pause here也能在突破反调试的时候也能起到必定做用。局限性与上Add conditional breakpoint同样。
一样用两个动图说明问题。

能work的状况

不能work的状况