14

经常有人说抓包抓包,很极客的感觉,其实就是利用工具分析网络请求和响应而已。用工具,谁不会呢?对吧。恰好有个QA同学曾问我,怎么模拟出这种情况,怎么模拟出那种情况,等写完就把博客链接发给她好了。

本文介绍的工具是 Fiddler,它能够在本机和服务端之间建立一个代理,通过这个代理,可以对所有经过的请求和响应进行拦截、修改、分析等。理论上说,只要你使用的软件支持代理,都可以用 Fiddler 进行拦截,包括浏览器、命令行等。

类似的软件有很多,比如 WireShark、HttpWatch 等,如果只是模拟发请求的话,Chrome 中有几个插件也很不错,比如 Postman、REST Client 等。

基本术语

会话(Session)

不同于服务端的 Session,这里仅仅指一次HTTP请求而已。会话面板在工具左侧,如下图所示。

Session

图中显示了三条请求,每一列的具体含义都很清晰,认识英文单词就能懂了。

只是左边 # 号下的图标,帮各位找了一下,见下图。

会话图标

默认情况下,一旦开启 Fiddler,就会走它的代理。有时候你想暂停这种行为,那请看到左下方有个状态栏。

状态栏

单击一下左边的 Capturing,就能停止拦截,想再开启,就再单击一下。

它的右边是会话的来源,可以设置仅仅拦截浏览器发出的请求。

再右边有三种选择:1、在请求发出之前进行断点;2、在响应回来的时候进行断点;3、不设断点。

审查(Inspector)

随便单击一条会话,右侧就会显示详细信息。

详细信息

题外话,我觉得教程的意义在于,当你对某种新事物不熟悉的时候,帮助你了解一下而已。tutorial 和 reference 之间是有点区别的。

所以这里就挑一些足够使用的 tab 来解释一下。首先,这里有上下两栏,上面是 Request,下面是 Response。

Request 中有三个比较厉害的:

  • Inspectors:选中之后,可以详细查看请求的 Headers、Cookies,并且可以对请求体格式化,以 WebForms、JSON、Raw 等方式查看。具体每种方式的区别可以自己感受一下。一般来说,想要查看请求的参数的话,WebForms 的方式就挺直观的。

  • AutoResponder:这个地方可以模拟服务端返回值。顾名思义,当浏览器发出的请求满足你设置的匹配条件的话,Fiddler 就自动响应了,并不需要走网络。

  • Composer:模拟向服务端发送请求,用于测试服务端接口是否正确。

Response 中常用也列三个吧:

  • Headers:响应头。比如 Content-Type、Access-Control-Allow-Origin 等这些属性都在这个 tab 展示。

  • Cookies:查看由服务端带回来的 cookie。

  • JSON:将返回的内容以 JSON 格式显示。这个很有用,特别是当服务端返回的内容本身就是 JSON 的时候。

QuickExec

抱歉这么快就要讲命令行,实在是因为它太有用了。它位于状态栏的上方,有个 QuickExec 的提示,非常显眼。

其实,当你看到它的时候,就已经会了第一个命令

help

输入 help 会带你到命令行的帮助页,上面列举了所有可用的命令。不是很多,而且都很直观。这里同样把常用的列一下。

  • ?sometext:高亮包含匹配文字的会话。比如 ?/foo 就可以把所有包含 /foo 的请求都找出来。

其他的高亮功能还有:=(匹配请求方法或状态码)、@(匹配host)、select(匹配MIME)。

  • clear:清空会话面板。

  • keeponly:清空会话面板,仅保留指定的MIME类型。比如 keeponly json 就能筛选出所有返回 json 的会话。

  • go:放行所有的断点。

设置断点

按照之前介绍的,在状态栏启用断点(无论是请求断点,还是响应断点)后,所有的请求都会中断。

事实上,一个网页加载时,会触发很多异步请求。甚至在加载完成后,也还会不停地发送异步请求,比如现在很流行的二维码登录页面。拦截所有请求似乎显得不太合适。

而在上一节其实留了断点的命令行没有介绍。断点即 breakpoint,所有跟断点相关的都是以 bp 为前缀。

  • bpu:请求时断点,比如 bpu /foo

  • bpafter:响应时断点,比如 bpafter /foo

  • bps:拦截状态码,比如 bps 404

  • bpm:拦截方法,比如 bpm post

用不带参数的命令可以清除断点,比如 bpafter 可以清除所有的响应断点。

url 的匹配方式是判断“字符串是否包含”,比如 bpu /foo 会拦截所有包含 /foo 的请求。

如果忘了这些命令,在命令行输入 bp ,敲回车,就能看到提示了。bp is short for breakpoint,这个能记住吗?

模拟返回值

想要模拟返回值,首先要设置响应断点。

bpafter /foo

bpafter

当满足条件的响应回来时,选中该会话,就可以看到如图所示的面板。选择 Raw 视图(其他也可以,Raw 可以修改更多的内容),然后可以清楚地看到,服务端返回的内容是

{name: 'Jarvis', gender: 'M'}

把上面的 M 修改成 F,然后单击“Run to Completion”,就能把修改后的返回值送还给浏览器了。

自动化呢?没错,人往往喜欢偷懒,如果每次要修改,岂不是很麻烦。

自动响应

  • 选中想要拦截的请求,比如 /api/foo

  • 然后在 Request 面板选择 AutoResponder

  • 再选择 “Add Rule”

  • 在最下面的下拉框选择 “Create New Response...”

  • 然后 “Save”

此时会弹出一个对话框,跟 Response 面板的布局一样,在上面可以编辑返回值。

或者你直接把定义好的返回内容保存成文件,在刚才那个下拉框中选择该文件就行了。

模拟请求

右侧的 Composer 窗口可以模拟发送请求。

Composer

刚打开这个窗口的时候,应该是一片空白。你可以从左侧会话列表拖一个会话过去,这样就有预填的信息了,修改一下参数,点“Execute”,piu,一条请求就发送出去了。

接着在会话列表就可以查看服务端的返回值。

小结

其实 Fiddler 的官方文档上已经写得很全了,我只是稍微结合了平时的使用经验,仅仅把常用的功能罗列一下,希望可以帮助各位更快上手。毕竟,磨刀不误砍柴工。


名一
2.9k 声望522 粉丝