博客在前面几篇随笔中,介绍了在网络环境中浏览器和服务器之间交互的相关内容,下面主要主要从7个方面介绍一款网络抓包代理工具Fiddler,它能够帮助前端开发者和数据分析人员解决不少问题。html
1、Fiddler设置(PC端)前端
Fiddler默认是只能抓取http网络格式的,因此咱们要先设置下使Fiddler能够获取到https网络格式。首先按路径Tools→Options→HTTPS 进入设置 java
而后,须要容许远程链接打开:Tools-> Options->Connectionweb
默认监听端口为8888,下面几项所有勾选。配置后,重启便可完成。windows
2、手机的设置浏览器
须要保证使手机和电脑PC都处于同一个网络下,而后查看电脑的IP地址,能够CMD内经过命令ipconfig获取IP地址(更多详情可参看另外一篇随笔:《网络查看命令》 ),或者点击小箭头,鼠标移动到Online上查看IP地址。安全
得到本机IP和端口8888后,手机进入设置→wlan网络设置→选择无线,而后修改配置服务器
下载Fidder的安全证书:使用Android手机的浏览器打开以下格式的网址:网络
http://PC的IP: Fidder使用的端口号(e.g. 8888);工具
并点击以下图中所示的“FidderRoot certificate”连接,以实现证书的安装。
3、数据拦截
咱们能够经过点击这个位置或者按F11
右侧选择INSPECTORS→WebForms 对里面的数据进行修改,而后点击 Run to Completion 发送。
4、Fiddler使用方法:Fiddler显示IP
显示IP的做用:因为web前端在多个环境中开发,须要常常更换host,而设置host以后会出现延迟的状况,这时候就须要知道如今访问的域名时指向的服务器的IP地址。具体操做以下:
快捷键Ctrl+R 或者 菜单->Rules->Customize Rules…
在CustomRules.js文件里Ctrl+F查找字符串
static function Main()
添加一行代码便可显示IP
FiddlerObject.UI.lvSessions.AddBoundColumn("ServerIP", 120, "X-HostIP");
如图:
修改完成后保存,重启Fiddler完成操做。
5、Fiddler抓包中文乱码问题
6、Fiddler模拟发送get/post请求(也可作简单接口测试)
一、模拟get/post发送请求
(1)Fiddler设置post接口信息及参数,点击Execute发送请求
(2)Fiddler设置get接口信息及参数,点击Execute发送请求
二、发送请求后右侧会对产生相应的一条请求记录,选中查看右侧请求返回结果
7、运用Fiddler的查找功能,获取数据API(Json)
操做视频:https://v.kuaishou.com/7ldwnQ
参考:
Fiddler官介:https://www.telerik.com/fiddler
其余相似的抓包代理软件 - Charles官介 : https://www.charlesproxy.com/
《各种 HTTP 返回状态代码详解》:https://www.cnblogs.com/yxmings/p/14213407.html