Windows设置Charles监测Chrome请求并且监测localhost

在安装好Charles后，默认只给IE代理不会给Chrome设置代理，这样就需要手工设置，Charles的默认代理地址是127.0.0.1:8888

接下来就要给Chrome设置代理：

1、Chrome上安装ip代理插件Proxy SwitchySharp，其他类似的也可以

2、添加情景模式，如下图

这样打开Chrome，Charles就监测到Chrome的请求了

但可能发现localhost未被监测到，其实只要给localhost后面加个点，例如http://localhost:8088/dist/view/index.html可变成http://localhost.:8088/dist/view/index.html

加了点之后页面打开会提示Invalid Host header

这个原因是：新版的webpack-dev-server出于安全考虑，默认检查hostname，如果hostname不是配置内的，将中断访问。

解决方法：

在webpack.config.js中添加：

devServer: {

disableHostCheck: true

}

参考文章：

设置Fiddler监测Chrome请求

nodejs/webpack项目提示Invalid Host header