3.web逆向之开发者工具调试
在web逆向分析中，通过使用浏览器开发者工具(Chrome/Firefox DevTools)调试，可以准确的定位到代码块，分析参数如何生成，通过那段代码生成的至关重要。熟悉开发者工具调试朋友们可以当本文在放屁。
这里以chrome为例，打开google示例，或者自己写段html + js代码，然后按F12, 进入source。
一般打开Chrome DevTools显示的英文，如果想设置中文，点击设置按钮，进入设置界面language选项->选择
可以根据自己的喜好选择。
界面介绍
进入source选项卡后，出现下面界面
资源（Sources）面板包含三个部分：
文件结构树区域：列出了 HTML、JavaScript、CSS 和包括图片在内的其他依附于此页面的文件。Chrome 扩展程序也会显示在这。
代码编辑（Code Editor） 区域展示源码。
调试区（JavaScript Debugging） 区域是用于调试的。
断点（break point）
常用的断点分为以下几类：
这里介绍经常用到的几种：
代码行断点
使用代码行断点可以暂停 JavaScript 代码，了解此处的js代码的堆栈引用以及变量情况。
在代码编辑区点击代码行号就可以给这行代码加上断点。
如果某一行调用了很多函数，也可以进行行内断点：
这样代码就执行到keys(i)方法处暂停。
条件代码行
右击代码行，选择add conditional break point, 然后输入表达式。
条件代码行需要当表达式的值为true时候，才会在这行代码处暂停。这对于遍历比较多的数据时，想查看某一种情况特别有用。
可以通过调试区的Breakpoints选项卡对代码行和条件代码行断点进行修改、删除、停用/启用等操作。
XHR/提取断点
当XHR 的请求网址包含指定字符串时中断，开发者工具会在 XHR 调用 send() 的代码行处暂停。
调试区的XHR/fetch breakpoints选项卡, 点击+，填写关键字
事件监听器断点
当触发事件后运行事件监听器上的代码时暂停。通常配合代码行断点和条件断点。
其他断点请参考Chrome DevTools断点使用
调试区的其他面板
最顶端
当前监听XHR 断点中的那个url。当XHR断点有可能有多个，或者会匹配多个。这个区域显示的是当前监听的url
watch
调试的时候，可以显示任意表达式的当前值
call statck
代码暂停当前位置所执行的堆栈信息。简单说就是代码怎么一步一步执行到这一行的。
代码调试示例
以google示例为例，给点击事件添加了断点，当点击按钮就触发了点击函数并暂停：
接下来主要介绍绿色框里面的按钮：
（F8）调到下一个断点，或者没有断点执行结束。
(F9) 运行下一条语句, 碰见if、for、函数等代码块会执行到代码块里面。
（F10）跟上一条命令“下一步（Step）”类似，但是不会进入到代码块中。
（F11）和“下一步（Step）”类似,但是会进入到异步代码中执行。示例
（Shift+F11）跳出当前函数（此函数的之后的代码还是会执行），执行到下一行。当我们使用 偶然地进入到一个嵌套调用，但是我们又对这个函数不感兴趣时，我们想要尽可能的继续执行到最后的时候是非常方便的。
启用/禁用所有的断点。
在代码中的某一行上右键，在显示的关联菜单（context menu）中点击一个非常有用的名为 “Continue to here” 的选项。
当你想要向前移动很多步到某一行为止，但是又懒得设置一个断点时非常的方便。