前端抓包工具 spy-debugger

场景：H5页面嵌入在app页面里，页面展示有误，到底是前端问题还是后端问题，如果没有任何辅助工具，我们无法直接检查接口的数据返回。。。
如果每次都发布版本都测试环境，或者借助后端同学帮忙抓数据，也是非常麻烦的。。。
不需要发布测试版本，及借助后端同学的帮忙，我们如何获取到测试app里的接口数据
抓包工具由此诞生。

一.安装方法

1.windows下

npm install spy-debugger -g

2.mac下

sudo npm install spy-debugger -g

二.启动

spy-debugger -w true

启动成功后，如图：

四.按照启动spy-debugger的代理说明，使用浏览器打开http://127.0.0:62186，打开如图：

五.手机配置：

设置->无线局域网->选择当前网络，如图：

配置代理：选手动，按照终端启动spy-debugger的代理说明，填写配置代理，并存储：

六.配置完成，打开你的测试app,进入你要测试的h5页面，如果该页面有接口请求，http://127.0.0.1:55687/的请求抓包页面会同步该页面的请求情况。