今天在使用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请求的地址