前言
今天在某群里,有伙计抛出了一个页面求助大家,说是get不到前端源码。本着强烈的好奇心,我就点开页面一探究竟,发现页面每100ms断点一次,严重影响代码分析。本篇我们就来一步一步破解,这里先附上网站链接
思路分析
一、禁止断点
在Chrome控制台的Source Tab页点击Deactivate breakpoints按钮
或者按下Ctrl + f8
,这样chrome就不会自动跳转到debugger的代码了。
这个方法缺点也是很明显的,如此一来我们自己也无法进一步debug来更深入地了解页面的运行机制。此外,目前仅Chrome一家支持禁止断点功能,因此算不得什么好方法。当然,如果只是想要静心分析页面布局等情况,这应该不失为一个简单却行之有效的法子。
二、设置代理,去掉debugger
我们首先先找出页面中出现debugger的位置,在打开调试控制面板的情况下按住Shift+Ctrl+F
进行全局查找
发现有两个地方(201906122034576.shtml和shared.html)出现了debugger字样,我们打开fiddler,将浏览器代理设置为fiddler,并配置代理规则,使上述两个页面返回的内容去掉了debugger字样
待我们对其他带有debugger字样的页面如法炮制之后(注意:这里如果是https的页面的话还得进一步配置fiddler才能抓到对应的页面,相关的教程网上有很多,此篇不再赘述),然而,并没有出现我们期待的效果,source面板依然会跳出debugger断点。到这里,我们也许会怀疑,会沮丧!其实到此为止,步骤都没有问题。只能说网站的开发人员在探秘风险的防范上也是下了一番苦心。
既然对方用心以待,我们自然也得报之真情,这是做人的基本准则。所以我们并不打算放弃,细细一想,答案可能隐藏在混淆的代码之中。
三、代码重写
初步的想法是顺着断点执行下去,看下是代码调用栈,猜想并找到可能的代码拼接的地方,并进行替换处理。幸运的是通过调试很快我们就发现了,断点代码是通过字符串用
eval函数
动态执行的。返回动态字符串的是一个名为
_$jd
的函数,我尝试在console面板
输入_$jd
,发现这是一个全局函数,因此心中有了另一个想法——代码重定义,使得动态指定的代码为空代码。
_$jd=function(){}
但是这种方式只是临时改变当前页面的函数,每次刷新页面之后就会失效,因此为了一劳永逸,我们将这种方法与第二种方法结合起来,使得代理返回的页面上的代码就已经进行了代码重定义了。
在页面的最后添加上以下脚本即可
<script type="text/javascript">_$jd=function(){}</script>
与预期的一样,至此问题彻底解决!