Master Whistle: A Step‑by‑Step Guide to the Node‑Based Web Debugging Proxy

whistlejs

https://github.com/avwo/whistle

Whistle is a Node‑implemented web debugging proxy similar to Fiddler, supporting inspection and modification of HTTP(S) and WebSocket traffic, and runs cross‑platform on any OS that can install Node. It is a project of the IMWEB team.

Step 1: Install

<code>npm i -g whistle</code>

Step 2: Start

<code>w2 run</code>

Step 3: Configure Browser Proxy

If you use SwitchyOmega, the setup is straightforward:

Create a new profile

Name it "whistle"

Proxy protocol: HTTP

Proxy server: 127.0.0.1

Proxy port: 8899

Switch the browser proxy to Whistle to proceed.

Step 4: Open the UI and Start Configuring

http://127.0.0.1:8899/#rules

Initially it may seem confusing; click the

Create

button to add a new project (similar to the "Add Project" menu in Fiddler’s Willow plugin). For example, create a project named "qq.com" and add a rule.

Goal: replace qq.com’s logo with a local file.

<code>http://mat1.gtimg.com/www/images/qq2012/qqlogo_1x.png file:/F:/logo-white.png</code>

The result looks like this:

Some commonly used features:

<code># whistle also supports directory matching
qq.com/folder file://E:\xxx\dev

# host configuration is possible
qq.com 127.0.0.1

# map a directory to a specific IP
qq.com/folder 127.0.0.1

# a more complex example: map a remote path to a local file
/^http://ke\.qq\.com/webcourse(/[\w\-]*)\.html(.*)/ file://E:\xxx\dev\pages\$1\main.html

# for detailed documentation see the official guide: https://whistle.gitbooks.io/help/content/</code>