如何解决跨域问题？简单易懂！

首先我们先了解什么是跨域？在什么情况下会出现跨域问题？

举个例子帮助我们轻松理解！

场景：当我们的A页面发送Ajax请求B地址数据的时候，当A地址与B地址，他们的协议名，域名以及端口号其中有一个不同（不同源）的时候就会出现跨域，简而言之：跨域只会出现在Ajax请求的时候会出现，这在我们开发的时候是非常常见的，不要慌！！

其实解决这个问题很简单，这时候我们只需要跟我们的后端老哥哥说一声，帮忙给响应头设置`res.setHeader('Access-Control-Allow-Origin', '*')`这行代码即可！

当然求人不如求己！我们也可以自己解决！

那就是需要用到代理了，那什么是代理呢，就是我们前端自己创建一个服务器，就是代理服务器，众所周知，服务器之间是不存在跨域问题的，这个时候我们就可以在自己的内部去配置这个服务器，然后 给代理服务器去发送请求，然后代理服务器再去跟后端的服务器进行连接，简而言之：代理服务器就是起到一个中介的作用，这样我们就可以解决跨域的问题了！

那么操作步骤就是以下步骤，跟着来准没错

1.在vue.config.js中的devServer中配置proxy（就是做个转接服务器）

 

 2.将utils文件夹中的reques.js中的基地址设置为环境变量，将原先的接口地址注释掉

注意：这里设置环境变量是为了之后可以更好的切换开发环境，也可以直接注释掉之前的基地址

 这样就大功告成！两行代码解决跨域问题，也很简单！

 

总结以下：解决跨域的几种方式

1.用JSONP方式去发请求（很少用）

2.CORS（后端解决：比较推荐，自己省心）

3.代理（自行解决，还算简单^-^）