Vue前端配置代理实现跨域请求

跨域的解决方法：
        *设置让服务器允许跨域，使用nginx反向代理服务器实现

         

        *前端配置代理实现跨域请求

          

本文介绍前端配置代理实现跨域请求：

 在项目config文件夹下的index.js文件里设置代理配置表

// 代理配置表，在这里可以配置特定的请求代理到对应的API接口
    proxyTable: {
      '/api': { // 匹配所有以 '/api'开头的请求路径
        target: 'http://localhost:4000', // 代理目标的基础路径
        // secure: false,  // 如果是https接口，需要配置这个参数
        changeOrigin: true, // 支持跨域
        pathRewrite: { // 重写路径: 去掉路径中开头的'/api'
          '^/api': ''
        }
      }
    },

【注意】上面的target是你需要跨域到的目标，并不是前端服务器的地址！这么说吧，4000端口是服务器端口，一般前端服务器默认是8080端口！你现在因为端口不同需要跨域，所以要指定跨域的地址！

上述配置好之后，发送请求时，请求前缀不再是http://local:4000，而是/api。同时记得重启项目，因为项目配置文件改变了！