解决Vue项目请求接口跨域的问题，配置Vue项目index.js代理请求服务器端接口

Access to XMLHttpRequest at 'http://xxx.com/api/login/token' from origin 'http://localhost' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

看到如下图的跨域请求被限制访问的提示，爽不？快哉不？搞半天都不一定能搞好

解决方案↓

在config\index.js修改如下位置

代码拷贝

// 反向代理配置
proxyTable: {
  '/api': {
    target: 'http://shuzhiqiang.com/api/',//必须是http或https开头的网址,否者接口报错500、404
    changeOrigin: true,
    pathRewrite: {
      '^/api': ''//注意这里后面是一根斜杠也可以是空''
    }
  }
},

说明：

当'^/api': ''的时候，请求/api/xxx就等于是请求http://shuzhiqiang.com/api/xxx

当'^/api': '/'的时候，请求/api/xxx就等于是请求http://shuzhiqiang.com/api//xxx

注意第二个末尾多了//两根这样就能理解''和'/'的区别了，说白了就是一个替代占位符的作用

也就是如果用'^/api': '/'，请求/apixxx就等于是请求http://shuzhiqiang.com/api/xxx

这样请求的时候直接用“/api”开头就可以跨域访问接口了