Axios.post有效,但jQuery.ajax给出Cross Origin错误

时间:2017-09-25 15:53:21

标签: javascript jquery ajax

解决:

原来content-type: false就是答案。 https://stackoverflow.com/a/8244082/1694116

问题,后人:

为了快速进行原型设计,我使用Axios将POST用于API,一切都很好,花花公子。由于客户端的要求,我不能在部署中使用Axios,我必须使用jQuery。这就是问题所在。

使用Axios,服务器会发送正确的标头作为响应: enter image description here

请求标题: enter image description here

然而,使用jQuery,我没有获得Access-Control-Allow-Origin标头: enter image description here

请求标题: enter image description here

有效负载完全相同,因为我同时发出请求(用于测试)。

当然,因为jQuery响应缺少正确的标头响应,所以我得到错误No 'Access-Control-Allow-Origin' header is present on the requested resource.

代码:

var formData = new FormData();
var input = this.$form.find('#image');

formData.append('image', input[0].files);
formData.append('action', 'upload_image');
formData.append('api_key', this.apiKey);

function successCb(data) {
    console.log(data);
}

// This is all that was required to get Axios to work
axios.post(apiEndpoint, formData)
    .then(successCb);

// jQuery Ajax request
$.ajax({
    type: 'POST',
    url: apiEndpoint,
    crossDomain: true,
    data: formData,
    success: successCb,
    processData: false,
    contentType: 'multipart/form-data'
});

注意事项:

如果我没有在jQuery中设置contentType,请求会执行飞行前请求,但会失败。我在这里错过了jQuery的东西吗?

如果我将jQuery中的dataType设置为'json',我仍然会收到错误消息。如果我将dataType设置为'jsonp',则请求甚至无法完成。

使用XMLHttpRequest()有效。

0 个答案:

没有答案