whistle配合微信开发者工具使用

简介

基于Node实现的跨平台web调试代理工具，类似的工具有windows上的Fiddler，主要用于查看、修改HTTP、HTTPS、Webscoket的请求、响应，也可以作为Http代理服务器使用，不同于Fiddler通过断点修改请求响应的方式，whistle采用的是类似配置系统hosts的方式，一切操作都可以通过配置实现，支持域名、路径、正则表达式、通配符、通配路径等多种匹配方式，且可以通过Node模块扩展功能。

• 总结

whistle会启动一个代理服务器，覆盖浏览器的代理走它的代理
可以查看、修改http、https、ws请求/响应
通过配置hosts方式进行使用
支持多种方式匹配更改，可扩展

• 代理

在客户端与服务端沟通中间搭建的服务，客户端与服务端之前并不直接进行通信，而是通过代理服务器进行。在这个模式下，又区分正向、反向代理。它们的行为是一样的，都是通过代理服务器去转发请求给目标服务器。

• 正向代理

在请求发送(接收)之前加入中间层（代理），将不同的域名转换成相同的，就解决了跨域的问题。
客户端发送请求时，不直接到服务器，而是先到代理的中间层，利用中间代理去访问服务器，服务器发送结果给中间层，中间层再把结果返回给浏览器。
例如我们通常在Vue项目开发中，使用vueCli或是vite在config中配置proxy实现跨域访问的方式就是正向代理。还有VPN、CDN都是正向代理。

• 反向代理

此方法常用于服务器端，由客户端向反向代理服务器发送请求，反向代理服务器向真实服务器请求。
例如负载均衡就是通过Nginx反向代理实现。

Windows安装及代理配置

• 执行命令， 参考文档

# 前置条件，安装node.js
npm install -g whistle

# 启动whistle
w2 start

# 停止whistle
w2 stop

# 重启whistle
w2 restart

• 启动界面
  
• Ctrl+地址访问whistle并配置rules，意思是访问http://www.xxx.com地址的请求全都通过whistle转发到本地8080端口的服务

http://www.xxx.com http://localhost:8080

• 微信小程序请求后端地址对应上面www.xxx.com配置
  
• 微信开发者工具配置，设置-代理设置-手动设置代理(本地host不需要设置，网址才需要)
  
• 如果是https地址，需要安装根证书

https://wproxy.org/whistle/webui/https.html