Vue axios跨域请求问题

Question

1.vue axios跨域请求,后台已配置允许跨域,代理访问的时候还报错跨域

2.配置了代理访问地址还是localhost

axios.defaults.headers.common['Access-Control-Allow-Origin'] = "*";

axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';

proxyTable: {

  '/apis': {

    target: 'http://192.168.1.109/xxx/aa', 

    changeOrigin: true,

    pathRewrite: {

      '^/apis': '' 

      }

  }

}

this.$http.post('/apis/bbb/cccc', {

  json:JSON.stringify({})

})

.then(function (response) {

  console.log(response);

})

.catch(function (error) {

  console.log(error);

});

3.请求结果报错

Request header field Access-Control-Allow-Origin is not allowed by Access-Control-Allow-Headers in preflight response.

Error: Request failed with status code 404

at createError (createError.js?16d0:16)

at settle (settle.js?db52:18)

at XMLHttpRequest.handleLoad (xhr.js?ec6c:77)

Answer 1

你这个报错是因为你的请求中除了安全的头部字段额外加了Access-Control-Allow-Origin，后台并不允许这个字段解决办法后台配置响应头Access-Control-Allow-Headers中加上Access-Control-Allow-Origin