用Web抓包分析工具Livepool 实现本地替换开发

这是官方的介绍:

LivePool 是一个基于 NodeJS,类似 Fiddler 支持抓包和本地替换的 Web 开发调试工具,是 Tencent AlloyTeam 在开发实践过程总结出的一套的便捷的 WorkFlow 以及调试方案。

功能特性还挺多:

  • 基于 NodeJS, 跨平台
  • 支持 http 抓包和本地替换调试,Https/WebSockets 直接代理转发(暂不支持本地替换)
  • 便捷的 UI 管理界面,跟 Fiddler 类似,降低学习成本
  • 可以脱离 UI 后台运行,适应于某些不需要抓包,只需要使用替换和简单路由的场景
  • 基于项目的替换规则管理,方便高效,规则支持拖曳排序
  • 支持基于请求路径的本地文件替换,支持基于请求路径的路由转发(host 配置)
  • 替换类型支持:文件/文件夹替换,combo合并替换,qzmin替换(批量combo),delay延时等
  • 支持自动设置系统代理
  • 支持规则过滤,只显示关注的请求
  • 提供构建 http get/post 请求界面,方便接口调试
  • 特色功能:模拟gprs/3g等低网速(mac only)
  • 特色功能:支持离线站点到本地,并自动代码格式化

但是让我热血沸腾的是他的本地替换开发功能,下面就让我们一步一步体验这个神奇的过程……

1. 安装NodeJS:由于本工具是基于NodeJS的,所以首先要安装NodeJS,下载地址:http://nodejs.org/download,选择适合你的版本:

技术分享

2. 通过npm(依赖包管理工具,可以理解为nodejs的maven)安装Livepool,在命令行直接输入:npm install livepool -g,npm会自动下载并安装Livepool及其依赖。

3. 通过命令行输入Livepool来运行,执行成功的结果参加下图:

技术分享

4. 打开Livepool的图形界面,通过浏览器访问:http://127.0.0.1:8002,界面如下图所示(点击放大):

技术分享

5. 设置Livepool浏览器代理,选择界面中的菜单 Tools -> System Proxy,设置完浏览任意网页,应该可以看到它抓到的请求了。

技术分享

6. 然后在下方的Pool面板中创建一个项目和一个规则,即可实现编辑本地静态文件CSS或JS,实时查看效果,省去了搭建环境的时间。

技术分享

更多功能和替换规则请参见:https://github.com/rehorn/livepool

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。