代理工具

mac多用charles，windows多用fiddler

charles

是什么

Charles是在Mac下常用的截取网络封包的工具，开发时，为了调试与服务器端的网络通讯协议，常常需要截取网络封包来分析。

原理

Charles通过将自己设置成系统的网络访问代理服务器，使得所有的网络访问请求都通过它来完成，从而实现了网络封包的截取和分析。

常用功能

在需要将Charles设置成系统代理时，选择菜单中的 “Proxy” -> “Mac OS X Proxy”来将Charles设置成系统代理。想要有针对性的抓包，可以在Charles的菜单栏选择”Proxy”->”Recording Settings”里设置截取目标网站的封包。start Recording后，可以使用以下功能。

数据安全原因暂时撤图了。

1. 支持AJAX调试。可以自动将json或xml数据格式化，方便查看。

2. 支持重发网络请求，自定义重发次数等，在请求上右键即可找到入口。盗图一张列出2，3，4，5以及其他功能入口。

3. 支持流量控制。可以模拟慢速网络以及等待时间（latency）较长的请求。

4. 支持break point，实现网络请求的截获并动态修改。

5. 支持模拟网络请求返回，通过mapping local将请求代理到本地文件,实现mock数据以及代理线上资源到本地进行调试。

6. 支持SSL，支持移动端

fiddler排查实践

第一步：开启APPfiddler抓包

第二步：开启https支持并安装证书

第三步：查看接口情况

从这个排查的过程出发，可以排查domLoading至domInteractive 的时间各个异步接口的请求以及渲染时间，为以后对于针对较大用户量的优化提供思路。