前言:进行前端开发时,如果是在PC端,chrome的谷歌开发者工具可以很好查看前端发送和接收到的内容,然而在手机端,尤其是微信H5,有些页面必须在微信内部才能运行的,就必须用到抓包工具了。fiddler是免费软件,安装和使用很简单,最近正好在开发微信H5的项目,用它解决了不少问题。
一、下载及安装
fiddler下载地址:https://www.telerik.com/download/fiddler
进入官网选择使用Fiddler的目的,填写Email后即可下载,然后按照正常安装软件的步骤安装好即可。
二、使用fiddler进行HTTP抓包
1、Fiddler配置
打开fiddler软件,左上角菜单栏点击Tools→Options
在弹出来的页面点击Connections→勾选Allow remote computers to connect,默认端口是8888,可以修改也可以默认,设置完点击OK。
配置好后,一定要记得重启Fiddler!否则手机会连不到网。
2、手机配置(以安卓手机为例,苹果手机修改方法基本一样)
首先确保手机与电脑在同一局域网下,然后找到手机连接的wifi名长按出现对话框→点击修改网络
点击修改网络后,在进去的页面找到高级选项,点击高级选项→代理方式选择手动→代理服务器主机名填写局域网的IP地址→端口号默认填8888(如果在上一步的fiddler设置中修改了端口号,就填写自己修改的端口号)
如果不知道IP地址,打开电脑运行→输入cmd,回车→在命令行中输入ipconfig,再回车,出现的信息中IPv4地址就是IP地址
手机配置完了,随意打开一个网页或APP,就能抓取到HTTP包了,如果手机连不上网,检查以上配置都正确的话,记得要重启fiddler!
三、使用fiddler进行HTTPS抓包
以上配置只能抓取到HTTP包,如果项目是在HTTPS中开发的,还需要再做一些配置。
注意:HTTPS的配置是基于HTTP抓包配置已经完成的,如果HTTP抓包没配置好,查看上面的第二步使用fiddler进行HTTP抓包,按步骤完成后再进行下面的配置。
1、fiddler配置
打开fiddler,左上角菜单点击Tools→点击Options→点击HTTPS看到下面的页面
勾选Decrypt HTTPS traffic,下拉选择 remote client only(如果要网页和手机端都抓包,选择 all processes),勾选Ignore server cetificate errors,点击OK。这时候一般会弹出一个对话框安装证书,建议不要安装默认的证书,抓不到包。。
2、安装certmaker插件
用fiddler默认的证书抓不到包,IOS和安卓的都不行。。。需要安装插件。。
插件地址:https://www.telerik.com/fiddler/add-ons ,找到certmaker插件,下载后正常安装即可。安装完后记得重启fiddler!
3、下载证书
(1)PC端:点击 http://localhost:8888/ 下载
(2)手机端:打开浏览器或iphone 的safari 输入http:// IP地址:8888(局域网IP地址查询方法看前面)
进入页面点击FddlerRoot certificate下载证书并安装,安卓一般直接安装完即可
IOS的需要进入通用→关于本机→证书信任设置→启用fiddler证书
4、开始抓HTTPS包,手机打开想抓包的网页,就能在Fiddler上看到啦~