whistle介绍

whistle是基于Node的跨平台web调试代理工具, 主要查看, 修改HTTP, HTTPS, Websocket的请求,响应, 也可以作为HTTP代理服务器使用

Chrome DevTools

Chrome开发者工具也能实现简单的资源替换, 但是功能没有whistle强大, 也有很多局限性

  1. 开发者工具打开资源面板(Sources)
  2. 选中Overrides选项卡, 单机下面的Select folder for overrides将保存修改资源的路径
  3. 打开网络面板(NetWork), 右键某一个资源, 点击Save For Overrides菜单, 点击就能修改保存代码, 按一下F5会发现刚才修改的还在

whistle安装和配置

  1. cnpm install -g whistle
  2. w2 run 运行后, 浏览器打开http://127.0.0.1:8899 进入UI界面
  3. 找到https按钮, 点击弹出对话框中勾选, 捕获https请求, 然后点击证书下载
  • 在windows中, 双击证书文件, 点击安装证书, 选择存储位置为本地计算机, 选择将所有证书都放入下列存储, 点击浏览, 选择受信任的根证书颁发机构,确定
  1. 配置系统代理
  • 在windows10中, 打开系统代理设置, 手动设置代理, 使用代理服务器开, 地址为127.0.0.1 或者 192.168.0.102你本机(whistle服务所在)的内网IP, 端口默认8899, 也可以在ws命令启动时指定参数设置
  1. 浏览器打开http:127.0.0.1:8899 进入UI界面, 点击Create创建一个规则, 在右侧面板中输入https://xx.com/js/index.js file:///mnt/c:/Users/xueyo/Downloads/test.js 就能替换资源了

whistle的更多相关文章

  1. 跨平台web调试代理工具---whistle

    whistle是基于Node实现的跨平台web调试代理工具,支持windows.mac.linux等所有安装了Node的操作系统,可以部署在本地机器.虚拟机或远程服务器,并通过本地网页查看或修改HTT ...

  2. 实用抓包工具:whistle

    无论是前端开发还是客户端,实际开发过程中,抓包都经常被用到.工欲善其事必先利其器,一款好用的抓包工具也是必须的. 说到抓包,Windows系统上不少人都用过Fiddler,Mac或Linux上用Cha ...

  3. 使用whistle模拟cgi接口异常:错误码、502、慢网速、超时

    绝大多数程序只考虑了接口正常工作的场景,而用户在使用我们的产品时遇到的各类异常,全都丢在看似 ok 的 try catch 中.如果没有做好异常的兼容和兜底处理,会极大的影响用户体验,严重的还会带来安 ...

  4. 使用 whistle 替代本地 nginx/webpack 服务

    加入鹅厂之后,我发现团队都在用一款叫做 Whistle 的工具,起初我以为这只是一款类似 Fiddler/Charles 的普通货色.然鹅,发现下面这两种用法之后,我把自己的膝盖摘下来献给了制作这款工 ...

  5. 移动端调试神器 whistle

    移动端h5页面嵌入的方式多种多样,普通的chrome真机调试功能有时就不能满足要求了. whistle通过设置wifi服务器代理的方式,可以抓包调试所有移动端请求的页面. whistle的github ...

  6. 前端代理----whistle

    场景一:如何将本地的请求代理到服务器上(如果接口没有校验登陆的情况) 最简单的方法:在项目文件中找到webpack开发环境的配置文件,配置devServer对象 devServer: { conten ...

  7. whistle工具全程入门

    接触过前后端开发的同学应该都了解网络请求代理工具fiddler(mac下面常用的是Charles),可以用来拦截分析请求.包装请求.本地调试和移动端代理开发调试等.多多少少,fiddler和Charl ...

  8. whistle.js连接ios手机中https步骤

    1:对于安卓直接扫码安装https的证书: 对于ios  连接电脑发出的wifi,打开whistle,配置代理之后(一定要保证先链接电脑发出的wifi,且配置代理) 用Safari打开网址:http: ...

  9. whistle替代Fiddler调试远程服务器代码使用教程

    前沿 之前在window下开发的同学大部分都是使用Fiddler代理工具做远程调试,自从换了Mac后也想找个代替工具调试,查询了下大概都比较推荐两款:Charles 和 Whistle .不过Char ...

随机推荐

  1. [Swift]LeetCode384. 打乱数组 | Shuffle an Array

    Shuffle a set of numbers without duplicates. Example: // Init an array with set 1, 2, and 3. int[] n ...

  2. 当使用vue的按键修饰符不起效果的时候怎么办?如@keyup.enter = '' ;

    这个问题困扰了我一个多小时,各种测bug !始终测不出来! 直接上代码(错误示范) <el-form-item prop="password"> <el-inpu ...

  3. python网络-多进程(21)

    一.什么是进程 进程(Process)是计算机中的程序关于某数据集合上的一次运行活动,是系统进行资源分配和调度的基本单位,是操作系统结构的基础.在早期面向进程设计的计算机结构中,进程是程序的基本执行实 ...

  4. Entity Framework Core 2.0 入门

    该文章比较基础, 不多说废话了, 直接切入正题. 该文分以下几点: 创建Model和数据库 使用Model与数据库交互 查询和保存关联数据 EF Core支持情况 EF Core的数据库Provide ...

  5. Qt之QComboBox定制

    说起下拉框,想必大家都比较熟悉,在我们注册一些网站的时候,会出现大量的地区数据供我们选择,这个时候出现的就是下拉框列表,再比如字体选择的时候也是使用的下拉框,如图1所示.下拉框到处可见,作为一个图形库 ...

  6. 如何在启用JWT Token授权的.NET Core WebApi项目中下载文件

    背景 前几天,做项目的时候遇到一个文件下载的问题.当前系统是一个前后端分离的项目,前端是一个AngularJs项目, 后端是一个.NET Core WebApi项目.后端的Api项目使用了Jwt To ...

  7. 带着萌新看springboot源码12(启动原理 下)

    先继续接上一篇,那个启动原理还有一点没说完. 6. afterRefresh(context, applicationArguments); 看这个名字就知道,应该就是ioc容器刷新之后的一些操作了, ...

  8. ThreadPoolExecutor系列三——ThreadPoolExecutor 源码解析

    ThreadPoolExecutor 源码解析 本文系作者原创,转载请注明出处:http://www.cnblogs.com/further-further-further/p/7681826.htm ...

  9. linux权限之su和sudo的差别

    我们都知道非常多的文件都仅仅有root有权限来改动,那么在我们平时的开发过程中都建议使用一般账号来登录进行开发.还记得前面说到的ssh吗.我们也是将同意root登录设置成no.到必要的时候再切换到ro ...

  10. JDBC驱动程序注册 JDBC简介(二)

    使用JDBC进行数据库操作的第一步就是驱动注册(当然你得先导入JAR). 驱动注册有多种方式,第一步必然是获得正确的驱动名称与URL格式 驱动名称与URL格式 RDBMS 驱动程序名称        ...