Charles无法代理localhost的解决办法

10,232 阅读1分钟

今天在使用Charles的rewrite测试时发现Charles没有代理到本地localhost发出的请求,structure那一栏为空,网上一搜才发现这个问题是电脑系统的问题,官网解释

原因就是电脑系统硬编码使得localhost的流量不走系统代理,而charles原理就是将自己设置为系统的代理服务器,自然就无法获取到localhost的流量了,这里的一个办法是用localhost.charlesproxy.com 代替,我这里用create-react-app作为前端开发者server(端口3001),express作为后端server(端口3000),测试Charles的rewrite功能来解决跨域问题,因此需要修改3个地方,首先是hosts文件,我是windows系统,找到hosts文件,添加最后一行如下图

作用就是将这个网址映射到127.0.0.1也就是localhost,hosts文件的作用就是做一个映射,当访问某个网址时,首先查找hosts文件看看是否有映射到的ip地址,如果没有再去走dns查询。


第二步是在Charles的rewrite中修改localhost为localhost.charlesproxy.com,见下图

注意是http请求,端口就是后端server的端口

第三步就是修改前端ajax请求的地址

这里也要改成localhost.charlesproxy.com,至此就可以成功跨域