1. Install whistle
NPM install -g whistle install w2 startCopy the code
After the startup, open http://127.0.0.1:8899/#network. The following page is displayed
2. Install proxy
SwitchyOmega download address: github.com/FelisCatus/…
As shown in the image above, select.crx to download and add it to Google Extensions. It can also be downloaded directly from the Google App Store, either of which works
3. Whistle + Proxy implements the proxy
1) The console starts whistle 2) Create the required proxy proxy connection and create a new connection named “XXX” with the proxy server set to 127.0.0.1 and port set to 8899 (these two Settings are important!! Directly related to the success of subsequent agents).
3) Set the proxy rule to openhttp://127.0.0.1:8899, set agent Rules in Rules.For example, to point www.baidu.com to the local test-local file, add the test-local file to Values first, and add data at will (PS: Generally, the interface returns JSON. The data to be added here had better be formatted with JSON; otherwise, the interface after proxy returns an exception). If you access www.baidu.com, the local test-local is actually accessed. The following figure shows the result
PS: You can also import a local file, create a local 001.json file, and add data to it. Then values => files => drop file… => copy path and add rules to rules. file://{} is equivalent
www.baidu.com /$whistle/001.json
Copy the code
4) show time
Select the connection you created in proxy
Open www.baidu.com in your browser
In this case, the page is displayed as the proxy path defined in ***3) ***. The packet capture effect is shown as follows. The accessed url is www.baidu.com and the actual address is file://{test-local}
4, debugging,
Console (log://) Outputs console.xxx() when debugging a mobile device. Some capture tools don’t show this information, but Whistle internally implements a remote log platform similar to browser console. The simple whistle is responsible. Add the log rule to Rules as follows:
Whistle Enables HTTP/HTTPS interception, indicating that it is a whistlehttp://xxx (for the URL of the mobile debugging page). On the mobile terminal, open http://xxx and use ToolsThe Console information is displayed on the Console page.
// Add weinre Rules to Rules as follows:
http://xxx weinre://
Copy the code
Click Weinre (=> anonymous),
Mobile terminal openOn the http://xxx page, you can see the Targets part turns green, indicating that the debugging process is ok. When you refresh the page, you can see the page printing and DOM information.