chrome 开发者工具 转载：https://mp.weixin.qq.com/s/rk6R2t2qK4PDQoeJbRSmFw

很多人看了我之前写的文章，都说不会如何去调试，那今天就和大家分享是我如何去使用 chrome 开发者工具进行调试的。

 

先说明：以下内容均是我个人在使用开发者工具时自己探索的，相关的功能有可能说得不是很对，如果你发现我说错了，欢迎指出！或者在评论区分享一些别的技巧。

 

 

1. 第一排按钮

 

 

先说下这几个按钮，从左到右按顺序：

1. 跳到下一个断点处，如果后面没有断点了的话，就会停止调试

2. 不跳入函数内执行下一行代码，当函数内部逻辑太多或者不重要的时候，可以使用这个

3. 向下执行一行代码，会进入函数内部，需要理解函数内部的逻辑时候就可以使用这个

4. 跳出当前函数，当你所在的函数内部有循环或者突然觉得这函数可以跳过，就可以使用这个

5. 禁止所有断点，不做任何调试，一般很少用

6. 程序运行到异常时是否中断的开关，也很少用，我们一般调试别人的程序很少会有异常。

 

上面这几个按钮常用的就前面 5 个，对进行逆向 JS 时需要调试时非常重要，需要熟悉使用，当你掌握了如何去用的话，调试程序起来会得心应手。

 

 

2.  watch 和 call stack

 

 

这个用于监视变量的值的，比如在一段程序种，你需要关注哪个变量在什么时候变化了，就可以在这里点击右上角的加号进行添加，来观察在调试过程种这个变量的值。

 

 

上面这个是调用栈，特别重要。

 

用于查看 js 在执行过程种的调用栈，这个在我们寻找加密地方的时候就需要用到。比如我们在某个断点处，看到我需要的参数已经生成了，这时候我们就可以查看调用栈，看看他前面的执行过程种是如何调用的，很容易就会找到生成的地方。

 

这个也是需要非常熟练的，自己多折腾一下就会了。

 

 

3.  xhr 断点

 

 

这个是 xhr 断点，当自己需要捕捉一些请求的时候，可以使用这个，懂得如何去使用，有时候对于查找加密生成地方会省很多力气。不过需要配合上面的调用栈进行使用。

 

比如，我们在进行某个操作的时候，需要发送请求，嗯，比如点击登陆或点击链接，这些都会发送请求，如果你需要知道他们的参数的话，就可以在上面打个钩，捕捉一下。说不定会有惊喜！

 

这个还可以选择只捕捉指定域名的请求，但我没有用过，所以在这里就不说了，一般全部捕捉就行了，因为我们如过捕捉到没有用的请求，可以按下上面第一条所说的 第一个按钮，就会跳到下一个 xhr断点了。

 

 

4. 事件监听

 

 

这个是用来监听一些事件的，一般加密非常难的就会用到，我现在涉及到的还是很少，还有一些滑动验证码也会用到，里面就用到滑动监听，还有一些点击事件等。如果想要破解一些更加高深的网站的话，这个还是需要熟悉使用的，了解一下这些都是什么事件，当你在找加密地方找了很久都没有头绪的时候，都可以来这里看看，惊喜大大的。

 

 

5. 相关技巧

 

1）在找加密地方的时候，我们可以先来看看这里的调用栈

 

某乎登陆

 

上面这个就会有我们要找的参数的生成的地方，有时候，从这里开始寻找加密地方比较好突破，有时候会有太多调用栈，可能就不是很容易，不过也是一个突破口。

 

2）hook 一些 cookie

hook 按我的理解就是捕捉的意思，我们需要经常找一些 cookie 值得位置，就可以使用 hook来捕捉，怎么用呢？我也是向冷月大神学习的，这里先献上大佬博客再说：https://lengyue.me/

 

这里使用的是油猴脚本，一个插件来的，下载地址：http://www.tampermonkey.net/

 

安装后点击插件选择添加脚本，然后把这段代码添加到上面即可

 

 

需要获得完整代码在公众号 「日常学python」后台回复 hook 获取

 

接下来就是开启这个脚本进行 hook 了

 

就比如我们之前的努比亚论坛的cookie 

 

这里就有了，特别方便，至于具体的使用，下篇文章再写详细点，或者自己折腾下，这样会更加深刻，嘻嘻。

 

原创不易，对你有帮助的话，希望能点个在看，分享给你的朋友一起学习进步哈！

 

END