jQuery Ajax與XMLHttpRequest

Question

在這里，我有兩個相同的請求：jQuery ajax和XMLHttpRequest，但JQ ajax無法工作...所以想知道有什么區別：

JQ ajax：

var urlAjax = "http://www.agroagro.com/v1/register";

$.ajax({
type: "POST",
url: urlAjax,
contentType: "application/x-www-form-urlencoded",
data: {
                    name: "Mile3",
                    email: "new1@new.com",
                    password: "face1book"
                },
  crossDomain:true, 
  success: function(data) { console.log(data); },
error: function(data) {console.log(data); },
dataType: 'json',
beforeSend: function (xhr) {
            xhr.setRequestHeader("Access-Control-Allow-Origin", "*");
        },
        headers: {
            'Access-Control-Allow-Origin': '*'
        }
});


}); 
});

這個ajax請求不起作用...給我404錯誤...

XMLHttpRequest的：

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
  if (xhr.readyState == 4) {"done"}
}

xhr.open("POST","http://agroagro.com/v1/register",true);
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xhr.send("name=Henry&email=Ford@ford.com&password=1234");

這個請求工作正常，但是我需要知道有什么區別，兩者都調用POST url ...

我還需要更改JQ ajax請求才能工作嗎？

Answer 1

Access-Control-Allow-Origin是響應標頭，因此不應位於請求標頭列表中： https : //developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS#The_HTTP_response_headers

刪除以下內容：

beforeSend: function (xhr) {
    xhr.setRequestHeader("Access-Control-Allow-Origin", "*");
}

和

headers: {
    'Access-Control-Allow-Origin': '*'
}