Fiddler抓包远程调试篇
Fiddler抓包远程调试篇
由于部分同学没有mac电脑或者其他条件限制，不方便在ios手机上调试，或者在4.3版本的安卓手机以下在客户端大厅内不能debug，我们只能采用fiddler抓包进行远程调试。
远程调试使用weinre，weinre是一款非常好用的远程调试工具。功能与网页浏览器的开发者工具基本类似，但这个工具更适合用于移动端web的调试。
抓包的作用：
1.可使用的电脑：windows或mac电脑调试android和ios手机
2.可调试的手机有(所有手机)：安卓4.3版本以下、安卓4.3以上、ios手机
3.可抓取移动端(android和ios)或pc端从服务器端返回的响应报文
4.可解决与服务端交互的跨域问题，在fiddler工具内可下发跨域头
5.域名替换，用本地代码可替换线上的代码
fiddler抓包步骤如下：(以windows电脑为准，mac电脑需加前缀)
步骤一：pc电脑打开下载fiddler，一部手机，不需要数据线
步骤二：打开fiddler工具，设置监听端口号，默认是8888
(查看fiddler的默认端口号，也可自己设置)
步骤三：cmd命令打开窗口，用ipconfig命令拿到电脑ip（192.168.157.147）
步骤四：前提条件是电脑和手机在同一网络下，打开手机显示wifi网络页，点击或长按，进入到代理设置，进入到手动设置，服务器填电脑ip，端口填fiddler工具设置的端口号，使用默认情况就填8888
步骤五：在手机任意浏览器访问网页后，在fiddler框内拿到项目的入口文件(如:********/bestpayMobdown.html)，把此文件里面的代码赋值出来，保存在电脑的一个文件夹目录下:（如: temp/down.html）(如果状态码是304，拿不到入口的bestpayMobdown.html文件，就是浏览器有缓存，状态码为200就可复制bestpayMobdown.html里面的内容，手动保存一个down.html文件)
验证是否生效：复制代码好之后，就在html文件内写上一行 ，然后用手机刷新浏览器，看看手机是否弹出1。弹出1说明fiddler替换文件生效。
步骤六：在fiddler内设置一个路径，目的是手机访问的线上或者本地起的一个服务的index.html，设置后就是访问本地刚刚手动保存的temp/index.html文件(可查看图片上的说明文字)
步骤七：查看设置是否有效，在temp/index.html文件内打印一个alert(1)，再次刷新手机浏览器，如果浏览器显示alert(1)的内容，说明设置代理成功了，否则要查找原因
注意：如果找不到或者下载不了入口文件，可排查出浏览器是否是有缓存，拿到状态码是304；清除缓存地方：应用管理 --》 清除某个浏览器的数据
远程调试步骤如下：使用weiner调试 （weiner远程调试结合fiddler调试）
调试链接：weinre的使用 - migo_ - 博客园(不明白可访问)
步骤八：如果电脑未安装weinre服务，需npm -g install weinre 安装
步骤九：启动weinre服务 weinre --httpPort 8081 --boundHost 192.168.157.147
httpPort:调试服务器运行的端口，默认8080，一般8080端口被占用，所以换个端口号
8081：端口号，可自己定义，必须与fiddler的端口不同，或者本地其他端口号不同
192.168.157.147：本地电脑的ip地址
步骤十：启动服务后，用chrome浏览器打开 http://192.168.157.147:8081，然后找到script文件
步骤十一：引入weinre中刚刚找到的script文件路径，在temp/index.html中加入这个script文件路径，