vue-cli3配置axios代理跨域（一）——代理跨域的原理

如果你知道代理跨域的原理，可以直接查看配置方法：https://blog.csdn.net/qq_36485978/article/details/100017849

要了解跨域的解决办法，首先要了解什么情况下就是跨域：违反同源策略的都是跨域。

同源策略：协议，域名和端口都相同。

分类	举例
协议不同	http://localhost:8080和ftp://localhost:8080
域名不同	http://127.0.0.1:8080和http://192.168.0.1:8080
端口不同	http://localhost:8080和http://localhost:8081

违反以上任意一个都是跨域。

代理解决跨域原理：化不同为相同。

通过一些方法设置代理，在请求发送(接收)之前加入中间层，将不同的域名转换成相同的，就解决了跨域的问题。客户端发送请求时，不直接到服务器，而是先到代理的中间层。

例如在8080端口向8081端口发送请求，就发生了跨域。下面是代理跨域的原理图：

在这里将http://localhost:8080的这个域名装换为http://localhost:8081,再将请求发送到服务器,这样在服务器端收到的请求就是使用的http://localhost:8081；同理，当服务器返回数据的时候，也是先到代理的中间层，将http://localhost:8081转换成http://localhost:8080，这样在客户端也是在同源下访问的了。