[Go] whistle--New Cross-platform Web debugging Tools

Whistle is a cross-platform Web debugging agent based on node, similar tools are fiddler+willow on the Windows platform, Charles based on Java, and company colleagues based on node Livepool, and so on. Whistle As with all Web debugging Agent tools, the main feature is also used to view, modify HTTP, HTTPS, websockt request response, or as an HTTP proxy server, but unlike Fildder+willow, Charles and Livepool Modify the request response by breakpoints, whistle is similar to configure the hosts way, through the configuration modification request response, and provides the rule grouping function and through the domain name, the path, the regular three matches the way (the system's hosts configuration only supports the domain name match), Especially for the terminal debugging provides Weinre,log and other functions, and support through the node module extension.

Basic functions

GitHub Address

Installation start

Installing boot whistle requires the following four steps: Install node, install whistle, start whistle, configure the agent.

2. Install node (recommended to install the latest version, LTS version or the current version can be, if installed can ignore this step): https://nodejs.org/
   Install TNPM ():

   npm install @tencent/tnpm -g --registry=http://r.tnpm.oa.com --no-proxy# Mac、Linux用户可能需要加sudosudo npm install @tencent/tnpm -g --registry=http://r.tnpm.oa.com --no-proxy

4. Install whistle and the plug-in TXPAC plug-ins needed to access the extranet on the corporate network:

   tnpm install -g whistle @tencent/whistle.txpac# Mac、Linux用户可能需要加sudosudo tnpm install -g whistle @tencent/whistle.txpac

6. Start whistle
   w2 start
   Whistle the default port is 8899, you can start this if you want to modify the port number:
   w2 start -p 8888
   Restart Whistle:
   w2 restart
   Close whistle:
   w2 stop
   For more information, see the command-line help:
   w2 help

8. Configure agents
   Whistle need to manually configure the browser agent or System agent (proxy IP is the IP of the whistle machine, if it is local), the port 127.0.0.1 number is set at the start of the port number, the default is 8899 :

   • Configure browser proxy (recommended):
     Install the Chrome proxy plugin: Whistle-for-chrome plugin or proxy switchysharp
     Install the Firefox proxy plugin: proxy Selector

   • To configure the System Agent:
     1) Windows
     2) Mac

How to use

Install node, install whistle, start whistle, configure the agent to start using whistle, open the Whistle Configuration Management page in Chrome browser

Interface related operation see interface function;

Configuration mode

Configuration mode for traditional hosts:

# singleHostIphostname# CombinationHostIphostname1 hostname2 ... hostnamen# such as 127. 0. 0. 1 www. Example. com127. 0. 0. 1 a. Example . com b. example. com c. example. com         

Configuration mode for whistle:

# 单个操作pattern operator-uri# 如果pattern和operator-uri不同时为域名或路径的一种组合，位置可以调换operator-uri pattern# 组合模式pattern operator-uri1 operator-uri2 ... operator-uriN# pattern1和operator-uri不同时为域名或路径的一种组合，可以如下配置operator-uri pattern1 pattern2 ... patternN

Where the pattern can be:

1. Domain Name: www.test.com( all requests under that domain name will match operator-uri )
2. Path: http://www.test.com/xxx ( http://www.test.com/xxx and its subpath's request will match Operator-uri), or no protocol protocol://www.test.com/xxx，protocol can be HTTP, HTTPS, WS, WSS ( http://www.test.com/xxx and its sub-path requests will match operator-uri )
3. Regular: Requests to and from the Subpath /^https?:\/\/([^\/]+)\/xxx/(http(s)://host:port/xxx match operator-uri , and operator-uri can be in the $1, $2, ..., $9 URL by getting a sub-match inside

operator-uriThe Uri,whistle, which is abstracted from the basic functions described above protocol://ruleValue operator-uri , modifies the request or response according to the matching protocol and Rulevalue. See the whistle Help documentation and the list of protocols for details on protocol and Rulevalue.

For example:

# 修改www.example.com的响应corswww.example.com resCors://*# 或resCors://* www.example.com# 同时修改多个自定域名或路径resCors://* /example\.com/ a.test.com b.test.com# 修改www.test.com的带端口host、referer和响应的corswww.test.com 127.0.0.1:8080 referer://http://www.example.com resCors://*

Some examples

2. Block HTTPS

   Do not turn on interception of HTTPS, can not see the whistle HTTPS and Websockt request response in clear text, and only through whistle to HTTPS and Websockt set host, agent and other limited operations, through whistle full operation of HTTPS, WebSocket request response, need to turn on HTTPS interception and install whistle root certificate in system or browser, see: https://avwo.github.io/whistle/webui/https.html

3. Configure host

   # Traditional hosts configuration 127.0.0.1 www.example.com# equivalent to: www.example.com 127.0.0.1127.0.0.1 a.example.com b.example.com c.example.com# Support with Port 127.0.0.1:8080 www.example.com # equivalent to: www.example.com 127.0.0.1:8080127.0.0.1:8080 a.example.com b.example.com c.example.com# support to get hosthost://www.qq.com:8080 www.example.com # by domain name is equivalent to: www.example.com host:/ /www.qq.com:8080host://www.qq.com:8080 a.example.com b.example.com c.example.com# supports matching with regular expressions 127.0.0.1:8080/ example\.com/i # equivalent to:/example\.com/i 127.0.0.1:8080127.0.0.1:8080/example\.com//test\.com/# Support path matching 127.0.0.1:8080 example.com/Test # equivalent to: Example.com/test 127.0.0.1:8080127.0.0.1:8080/HTTP// example.com/index.html https://www.test.com/Test          

   See the list of protocols for full functionality.

5. Modify Request

   The following features are supported by the domain name, path, regular matching method, for the convenience of only the domain name matching method as an example, other similar:

   # 修改url参数www.qq.com urlParams://E:\test\params.json        # 请求方法www.qq.com method://post# 添加请求头www.qq.com reqHeaders://(x-a=1&x-b=a%20b)# 修改referer(修改referer快捷方法)www.qq.com referer://http://ke.qq.com/# 修改cookie(修改请求cookie快捷方法)www.qq.com reqCookie://{reqCookie.json}# 修改请求表单www.qq.com params://{form.json}

   JSON objects can have local files, or the presence of the interface values, or inline into the rules configuration, see the implementation principle, data format.
   See the list of protocols for full functionality.

6. Modify response

   The following features are supported by the domain name, path, regular matching method, for the convenience of only the domain name matching method as an example, other similar:

   # Modify Response status code www.qq.com StatusCode:500 # Requests are not sent to the backend server and can be used to simulate 4xx, 5xx requests www.qq.com Replacestatus:404 # Request Return and then modify StatusCode# Add response header www.qq.com Resheaders:(x-res-a=1&x-res-b=a%20b)# Modify the response type (shortcut method for modifying the response type) www.qq.com ResType:Text/plain # or: www.qq.com restype://text# request replacement www.qq.com Https://www.baidu.com # local replacement (the directory separator in Windows can be used ' \ ' or '/') www.qq.com file://e:\xxx # Equivalent to: file://E:/xxx www.qq.com# mac or Linuxwww.qq.com file:///user /xxx/test# if you want to keep the request on the line without a corresponding file locally, you can use www.qq.com xfile://e:\ Xxx# local replacement jsonpwww.qq.com tpl://e:\xxx.json # Xxx.json: {callback } ({"EC": 0}) www.qq.com xtpl://e:\xxx.json # Xxx.json: {callback} ({"EC": 0}) # injected HTML, CSS, JS (whistle automatically encapsulated and injected according to the response type) www.qq.com html://htmlfilewww.qq.com Css://cssfilewww.qq.com js://jsfile    

   The JSON object or injected text can exist in a local file, or there are values for the interface, or it can be inline into the rules configuration.

7. Set up Proxy

   The following features are supported by the domain name, path, regular matching method, for the convenience of only the domain name matching method as an example, other similar:

   # HTTP Proxy www.qq.com proxy://127.0.0.1:8888# equivalent to: proxy://127.0.0.1:8888 www.qq.com# set up multiple proxies at the same time://127.0.0.1:8888 www.qq.com/google//facebook/# socks Agent www.qq.com Scoks://127.0.0.1:1008 # equivalent to: socks://127.0.0.1:8888 www.qq.com# simultaneously set multiple Socks://127.0 .0.1:1008 www.qq.com /google//facebook/# PAC script # set office network PAC script (without setting if WHISTLE.TXPAC is installed) /./pac://http://txp-01.tencent.com/proxy.pac# set up the office network PAC script (without setting if WHISTLE.TXPAC is installed) /./PAC: //http://txp-01.tencent.com/ Proxy_devnet.pac              

   See the list of protocols for full functionality.

9. Mobile-side debugging

   Open the online button in the upper-right corner of the whistle configuration interface to get the current whistle IP and port, the mobile device configures the agent based on the appropriate IP and port (make sure the mobile device and PC are on the same network segment), and if it is still inaccessible after configuration, you may need to turn off the firewall or set the whitelist.

   # weinre(调试网页DOM结构)www.qq.com weinre://test# log(输出网页console打印的日志)www.qq.com log://{test.js}

   See also: weinre, log

   See the list of protocols for full functionality.

11. Other functions

    The following features are supported by the domain name, path, regular matching method, for the convenience of only the domain name matching method as an example, other similar:

    # 禁用缓存www.qq.com disable://cache# 忽略规则www.qq.com filter://rule|host|https

    See the list of protocols for full functionality.

Plug-in extension and application

Whistle supports extending functionality through the node module, see: Plug-in development.

Some applications for plugins:

1. HTTP proxy server function: Imweb local agent Imwebproxy (Pb and Cmem in the function respectively for two whistle plug-in Whistle.imwebproxy, Whistle.cmem)
2. Extended protocol Features: Imweb front-end local debugging environment whistle.imwebenv
3. Extended interface Features: Whistle.websocket

User Feedback

If you have questions, you can check the whistle Help document first.

If you still can't fix it, or have suggestions, contribute code, and so on, you can use either of the following methods:

Finally, if whistle is helpful to you, add a star:https://github.com/avwo/whistle to the project

[Go] whistle--New Cross-platform Web debugging Tools