vue[Access to XMLHttpRequest at xxx by CORS]跨域问题前端解决方式

访问第三方接口：http://123.456.789.123:8081/abc?id=1

修改配置文件config/index.js

位置在module.exports —— dev下：

proxyTable: {//用代理的方式实现跨域访问
        '/': {    
          target: 'http://123.456.789.123:8081/abc',    //设置你调用的接口域名和端口号
          changeOrigin: true,    //true表示允许跨域，有人说false也可以，我没试过
          pathRewrite: {
              '/def': ''   //请求接口时直接用/def = http://123.456.789.123:8081/abc
          }
      }
    }

添加完如下：

module.exports = {
  dev: {

    // Paths
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    proxyTable: {
      '/': {
          target: 'http://123.456.789.123:8081/abc',
          changeOrigin: true,
          pathRewrite: {
              '/def': ''
          }
      }
    },
……………………

配置完之后记得重启一下服务

接下来就可以使用了

this.$axios({
        method: 'post',
        url: '/def',  
        params:{
          id: 1
        }
      })
        ……………………

一开始我用的是this.$axios.post，一直400，后台获取不到参数。

后来改成this.$axios({method:'post'……})就成功了。具体啥原因我也不是很清楚。