博客在前面几篇随笔中,介绍了在网络环境中浏览器和服务器之间交互的相关内容,下面主要主要从7个方面介绍一款网络抓包代理工具Fiddler,它可以帮助前端开发者和数据分析人员解决很多问题。
一、Fiddler设置(PC端)
Fiddler默认是只能抓取http网络格式的,所以我们要先设置下使Fiddler可以获取到https网络格式。首先按路径Tools→Options→HTTPS 进入设置
然后,需要允许远程连接打开:Tools-> Options->Connection
默认监听端口为8888,下面几项全部勾选。配置后,重启即可完成。
二、手机的设置
需要保证使手机和电脑PC都处于同一个网络下,然后查看电脑的IP地址,可以CMD内通过命令ipconfig获取IP地址(更多详情可参看另一篇随笔:《网络查看命令》 ),或者点击小箭头,鼠标移动到Online上查看IP地址。
获得本机IP和端口8888后,手机进入设置→wlan网络设置→选择无线,然后修改配置
下载Fidder的安全证书:使用Android手机的浏览器打开如下格式的网址:
的IP: Fidder使用的端口号(e.g. 8888);
并点击如下图中所示的“FidderRoot certificate”链接,以实现证书的安装。
三、数据拦截
我们可以通过点击这个位置或者按F11
右侧选择INSPECTORS→WebForms 对里面的数据进行修改,然后点击 Run to Completion 发送。
四、Fiddler使用方法:Fiddler显示IP
显示IP的作用:由于web前端在多个环境中开发,需要经常更换host,而设置host之后会出现延迟的情况,这时候就需要知道现在访问的域名时指向的服务器的IP地址。具体操作如下:
快捷键Ctrl+R 或者 菜单->Rules->Customize Rules…
在CustomRules.js文件里Ctrl+F查找字符串
static function Main()