在项目开发过程中，先在本地运行项目以及对接的相关操作，待项目完成以后再修改正式服地址。那么在这个过程中如何能够在本地请求接口数据而不出现跨域警告呢？
此时我们需要用到proxy代理，是vue静态服务器做代理。

• Vue@2.x 版本
  项目启动：npm run dev
  

//在config文件下的index.js进行代理配置。配置如下：
    proxyTable: {
        '/api': {  //将www.exaple.com 印射为/apis
            target: '127.0.0.1', // 接口域名
            changeOrigin: true, //是否跨域
            pathRewrite: {
                '^/api': ''  //需要rewrite的,
            }
        }
},

为了避免修改域名后又重新打包的操作，可以在static文件夹中创建一个congif.js文件，内容为

Window.gloabledata={
apiUrl:’/api/’
}

在url.js(根据个人习惯)中写入以下内容：

const host = window.globalConfig.apiUrl;  // 域名（地址公共部分）

• Vue@3.x 版本
  项目启动：
  
  该版本中，少了build和config文件夹，所以配置的话，直接找到文件目录下创建vue.config.js 文件，然后配置以下内容：

module.exports = {
	// 公共路径(必须有的)
	publicPath: '',
	// 输出文件目录
     outputDir: "dist",
	  // 静态资源存放的文件夹(相对于ouputDir)
     assetsDir: "static",
	  // eslint-loader 是否在保存的时候检查(果断不用，这玩意儿我都没装)
    lintOnSave:false,
	  // 我用的only，打包后小些
    runtimeCompiler: false,
	productionSourceMap: false,
 	devServer: {
		host: '0.0.0.0',
		port: '8080',
open: false,  //是否自动打开浏览器
		proxy: {
			'/api': {  //将www.exaple.com 印射为/apis
	            target: '127.0.0.1', // 接口域名
	            changeOrigin: true, //是否跨域
	            pathRewrite: {
	                '^/api': ''  //需要rewrite的,
	            }
	        }
		}
	}
}

为了避免修改域名后又重新打包的操作，可以在public文件夹(该文件不会被打包)中创建一个congif.js文件，内容为：

Window.gloabledata={
apiUrl:’/api/’
}

在url.js(根据个人习惯)中写入以下内容：

const host = window.globalConfig.apiUrl;  // 域名（地址公共部分）；

• Next
  在vue.config.js文件夹中进行代理配置

    // 代理的配置项
    proxy: {
        '/api': {
            target: '需要代理的api地址',
            pathRewrite: {
            '^/api': '/'
            }
        }
    },

这里理解成用‘/api’代替target里面的地址，后面组件中我们掉接口时直接用api代替 比如我要调用’http://127.0.0.0:8080/xxx/duty?time=2017-07-07 14:57:22’，直接写‘/api/xxx/duty?time=2017-07-07 14:57:22’即可。