工作中vue项目前后端分离，调用后端本地接口出现跨域问题的完美解决

在我们实际开发中，选择不错的前端框架可以为我们省掉很多时间，当然，有时我们也会遇到很多坑。

最近在做vue项目时就遇到了跨域问题，一般来说，出现跨域我们第一反应使用jsonp，但是这个只支持get请求。在这就是让后端加上响应头，允许我们跨域请求。

但是在做vue项目时，虽然后端给我加了请求头，依然出现了跨域，于是乎我就开始找各路大神的博客，终于给解决了。

 

如果谁用vue-cli脚手架搭建的项目，出现跨域后，我的解决办法是利用反向代理将我们的请求源给代理一下，

具体代码

在config文件夹中的index.js里将

'/api': {  //使用"/api"来代替"http://f.apiplus.c" 
          //target: 'http://192.168.0.102:8080', //源地址 
          target: 'http://47.99.54.35:8081', //源地址 
          changeOrigin: true, //改变源 
          pathRewrite: { 
            '^/api': '' //路径重写 
            } 
        } 

放到

proxyTable: {}

里面

然后，我们在组件中请求数据时

就这样，请求成功了。