我的书签
添加书签
移除书签快速上手
快速上手
推荐看这篇文章：whistle工具全程入门
按上述方法安装好whistle后，用Chrome浏览器打开配置页面: http://local.whistlejs.com
如图Rules，whistle的Rules配置页面有一个默认分组Default，用户也可以通过上面的菜单栏按钮Create、Edit、Delete分别创建、重命名、删除自定义分组，whistle先在选中的用户自定义分组中从上到下依次匹配，然后再到Default中匹配(如果Default分组被启用的情况下)。
点击页面上方菜单栏的Create按钮，新建一个名为test的分组，并参照下面例子输入对应的规则配置。
- 设置hosts
指定www.ifeng.com的ip:
www.ifeng.com 127.0.0.1
## or
127.0.0.1 www.ifeng.com
指定www.ifeng.com的ip和端口，把请求转发到本地8080端口，这个在平时开发中可以用来去掉url中的端口号:
## www.ifeng.com 127.0.0.1
www.ifeng.com 127.0.0.1:8080
## or
127.0.0.1:8080 www.ifeng.com
也可以用某个域名的ip设置hosts
www.ifeng.com host://www.qq.com:8080
## or
host://www.qq.com:8080 www.ifeng.com
更多匹配模式参考：匹配模式
- 本地替换
平时开发中经常会用到这个功能，把响应替换成本地文件内容。
## Mac、Linux
www.ifeng.com file:///User/username/test
## or www.ifeng.com file:///User/username/test/index.html
## Windows的路径分隔符可以用 \ 或者 /
www.ifeng.com file://E:\xx\test
## or www.ifeng.com file://E:\xx\test\index.html
http://www.ifeng.com/会先尝试加载/User/username/test这个文件，如果不存在，则会加载/User/username/test/index.html，如果没有对应的文件则返回404。
http://www.ifeng.com/xxx会先尝试加载/User/username/test/xxx这个文件，如果不存在，则会加载/User/username/test/xxx/index.html，如果没有对应的文件则返回404。
也可以替换jsonp请求，具体参见tpl
更多匹配模式参考：匹配模式
- 请求转发
www.ifeng.com域名下的请求都替换成对应的www.aliexpress.com域名
www.ifeng.com www.aliexpress.com
更多匹配模式参考：匹配模式
- 注入html、js、css
whistle会自动根据响应内容的类型，判断是否注入相应的文本及如何注入(是否要用标签包裹起来)。
## Mac、Linux
www.ifeng.com html:///User/xxx/test/test.html
www.ifeng.com js:///User/xxx/test/test.js
www.ifeng.com css:///User/xxx/test/test.css
## Windows的路径分隔符可以用`\`和`/`
www.ifeng.com html://E:\xx\test\test.html
www.ifeng.com js://E:\xx\test\test.js
www.ifeng.com css://E:\xx\test\test.css
所有www.ifeng.com域名下的请求，whistle都会根据响应类型，将处理好的文本注入到响应内容里面，如是html请求，js和css会分别自动加上script和style标签后追加到内容后面。
更多匹配模式参考：匹配模式
- 调试远程页面
利用whistle提供的weinre和log两个协议，可以实现修改远程页面DOM结构及自动捕获页面js错误及console打印的信息，还可以在页面顶部或js文件底部注入指定的脚步调试页面信息。
使用whistle的功能前，先把要相应的系统代理或浏览器代理指向whistle，如何设置可以参考：安装启动
weinre：
www.ifeng.com weinre://test
配置后保存，打开www.ifeng.com，鼠标放在菜单栏的weinre按钮上会显示一个列表，并点击其中的test项打开weinre的调试页面选择对应的url切换到Elements即可。
log:
www.ifeng.com log://{test.js}
配置后保存，鼠标放在菜单栏的weinre按钮上会显示一个列表，并点击其中的test.js项，whistle会自动在Values上建立一个test.js分组，在里面填入console.log(1, 2, 3, {a: 123})保存，打开Network -> 右侧Log -> Page，再打开www.ifeng.com，即可看到Log下面的Page输出的信息。
更多匹配模式参考：匹配模式
- 手机设置代理
iOS
Android
更多功能请参考：协议列表
