vue2+webpack使用axios跨域请求数据的设置

初次使用vue搭建项目，在进行交互请求数据时候报了经常会出现的错误，

Failed to load http://localhost:3000/add: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.

解决办法：

使用vue init webpack pro(项目名称)创建的项目是基于webpack的项目，了解webpack的都应该知道它是一个JavaScript 应用程序的静态模块打包器，项目所用到的插件，npm包等都通过它导入使用，跨域设置也通过它设置。

项目目录如图所示，我们要修改的是webpack的配置文件 config/index.js

将原来的

proxyTable: {}修改为

proxyTable: {

'/api': {

target: 'http://localhost:3000/', //是你要请求后台的域名和端口

changeOrigin: true,

pathRewrite: {

'^/api': '/'

}

}

}

然后再使用axios请求的时候就不会报跨域的错误了！！