jquery ajax 代码工作得很好
$.ajax({
url: rumi_api_endpoint + rumi_params + "filter/show",
data: {"name":"ronak","country":"india"}, //return data
dataType: 'json',
type: 'POST',
async: true,
success: function (res) {
onComplete(res);
},
error: function () {
console.log('Save error.');
}
});
但是 native javascript XMLHttpRequest 会引发 CORS 错误。
if (window.XMLHttpRequest) {
xmlhttp=new XMLHttpRequest();
} else {
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
onComplete(res);
}
}
xmlhttp.open("POST",rumi_api_endpoint + rumi_params + "filter/show",true);
xmlhttp.setRequestHeader("Content-Type","application/json; charset=UTF-8");
var xyz = {
"config": {"name":"ronak","country":"india"},
"token": "abc"
}
xmlhttp.send(JSON.stringify(xyz));
当我将 Content-Type 设置为 x-www-form-urlencoded 时,它能够以字符串化 JSON 的形式发送请求。 当我不设置任何 header 时,它会返回 406 Not Acceptable 错误。 但是当我想发送 JSON 时,它给出了 CORS 错误。 使用 native javascript 方法有什么我遗漏的吗?
最佳答案
您发送的 jQuery ajax 请求被认为是“简单”的,因此不太严格地遵循 SOP(它不发送 OPTIONS 请求。)您发送的 native javascript ajax 请求不被认为是“简单”的,因为您添加了Content-Type header 。
要解决此问题,您当然需要删除内容类型 header ,然后由于您不再将内容类型 header 设置为 application/json
,因此您将拥有将数据格式化为有效的参数字符串。使用 jquery 它就像 $.param(xyz)
一样简单,但是,我假设您尝试在不使用 jQuery 的情况下执行此操作,因此您需要将数据格式化为
config%5Bname%5D=ronak&config%5Bcountry%5D=india&token=abc
关于javascript - XMLHttpRequest 在 $.ajax 工作的地方给出 CORS 错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29383684/