关于fidder代理解决本地访问接口跨域问题

技术选型： Vue + vue cli + axios

在正常的写完页面之后调接口，我们设置axios的baseURL

设置baseURL

进行localhost：8080访问页面调接口时，正常情况下都会给予跨域报错响应：

跨域报错

因为本地与服务器不一致所以会造成跨域，如果是在服务器上192调用自己192那就不存在跨域问题；

这里我们借助fidder4来进行代理解决跨域问题；

首先我们进行本地代理：

本地代理

此步意思就是当我们访问192的时候会去读取本地的资源；

再进行接口代理：

接口代理

此步意思就是因为接口地址是http://192.168.4.250:8082/admin/，所以我们进行代理之后本地的192访问接口时会代理去真正的192访问；

综上两个规则实施后：

代理规则

在页面中访问

页面访问192的地址

页面访问192即会读取本地的资源同时接口请求也会成功

接口请求成功

至此，代理完毕，跨域问题解决；

*注：fidder只要你下载下来就行了然后点击AutoResponder，勾选Enable rules 和 Unmatched requests passthrough 即可，然后添加2个规则

正则在这里：

第一条：regex:http://192.168.4.250:8082/admin/([^\/]*)            http://192.168.4.250:8082/admin/$1

第二条：regex:http://192.168.4.250:8082/([^\/]*)                       http://localhost:8080/$1