如何使用 chrome 开发者工具来调试程序以及相关技巧

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接: https://blog.csdn.net/sergiojune/article/details/90038653

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


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



1. 第一排按钮


640?wx_fmt=png


先说下这几个按钮,从左到右按顺序:

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

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

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

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

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

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


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



2.  watch 和 call stack


640?wx_fmt=png


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


640?wx_fmt=png


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


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


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



3.  xhr 断点


640?wx_fmt=png


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


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


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



4. 事件监听


640?wx_fmt=png


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



5. 相关技巧


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


640?wx_fmt=png

某乎登陆

640?wx_fmt=png


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


2)hook 一些 cookie

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


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


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


640?wx_fmt=png


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


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


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


640?wx_fmt=png


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


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


END


往期文章回顾


薅羊毛 | 让Python每天帮你薅一个早餐钱

安卓抓包,为何总是 Tunnel to?

640?wx_fmt=png

猜你喜欢

转载自blog.csdn.net/sergiojune/article/details/90038653