与后端数据通信是前端日常开发的重要一环,在与后端接口联调的时候往往需要通过查看后端返回的数据进行调试。如果在PC端,Chrome自带的DevTools就已经足够用了,Network面板可以记录所有网络请求,查看接口数据非常方便。但是在移动端就不能这样干了,手机上是无法直接查看网络请求数据的,这时候就需要一个能记录网络通信的工具,也就是抓包工具。来来回回尝试了好几个,Fiddler算是用起来最爽的了:)

Fiddler是一个免费的web调试代理,它能够记录、查看和调试所有连接上的终端和远程服务器之间的http/https通信。闲话少叙,直接说如何调试手机上的页面。

在电脑上安装Fiddler之后,需要进行一些简单的配置才能对手机上的网络通讯进行捕获。

如果想要捕获手机上的通信数据,首先需要手机连接上Fiddler代理,而Fiddler默认是不允许其他设备进行连接的,点击 Tools > Options...,在 Connections 面板选中 Allow remote computers to connect 允许其他设备连接(此操作需重启Fiddler生效),

然后在手机上连上Fiddler代理,贴上一张IOS配置代理截图:

好了,现在Fiddler已经可以捕获手机页面上的http通信了。但是会发现捕获了很多 Tunnel to 的会话,这是怎么回事呢?原来这些都是https请求,而https是加密传输的,Fiddler默认是不对https进行解密的,如果想对https进行捕获,需要继续进行配置。

首先配置Fiddler对https进行解密,点击 Tools > Options...,在 HTTPS 面板选中 Decrypt HTTPS traffic 解密https通信(此操作需重启Fiddler生效),

然后在手机上需要安装Fiddler根证书,因为Fiddler是通过自己生成的证书对网络请求重新签名进行https会话解密的。证书的安装方法就是在手机自带浏览器中访问FiddlerServer地址(比如10.200.8.155:8888),会出现 Fiddler Echo Service 页面,下载并安装 FiddlerRoot certificate

1.浏览器输入:电脑的IP地址192.168.60.30:8888,安装证书——安装后应该可以在安全——信任证书——用户(个人)里面看到

2.IOS手机手机设置-通用-关于本机,最后一个受信任证书存储区里面,把fiddler的证书信任下

3.安卓华为手机权限管理——软件——信任此应用

经过这两步设置之后,Fiddler就可以捕获手机与服务器之间的所有http/https通信了。

最新文章

  1. VFP正则表达式判断是否是手机号码/电子邮件
  2. Atitit 图像处理知识点  知识体系 知识图谱
  3. jQuery8种不同的瀑布流懒加载loading效果
  4. [转]一个简单的Linux多线程例子 带你洞悉互斥量 信号量 条件变量编程
  5. jMeter 监控cpu、内存
  6. (博弈论)hdoj 1525 Euclid's Game
  7. Spring Autowiring by Constructor
  8. WordPress Comment Extra Fields插件‘swfupload.swf’跨站脚本漏洞
  9. 如何合并相同数据并转置(mysql)实现
  10. 切换tab,并且动态添加标签
  11. hdu4670(树上点分治+状态压缩)
  12. [原创] linux deepin 2014.1下编译putty
  13. 转 互联网推送服务原理:长连接+心跳机制(MQTT协议)
  14. hdu 2254(矩阵)
  15. git 入门与应用
  16. (0)MySQL 的指令(包含了解知识点)
  17. Spring学习之路-从放弃到入门
  18. Vue前端框架面试问题
  19. 如何设置VMware中Linux命令行环境全屏
  20. db2

热门文章

  1. C语言之字符、整数、数组、字符串笔记
  2. sendfile
  3. 如何在不使用try语句的情况下查看文件是否存在
  4. TCP简介
  5. P3353 在你窗外闪耀的星星
  6. antd + node.js + mongoose小总结
  7. SpringBoot学习历程
  8. 动画库NineOldAndroids
  9. 一道颇有难度的JavaScript题
  10. bzoj3033: 太鼓达人 欧拉路径