使用jQuery在AJAX請求中添加標頭

270

我想將自定義標頭添加到來自jQuery的AJAX POST請求中。使用jQuery在AJAX請求中添加標頭

我已經試過這樣：

$.ajax({ 
    type: 'POST', 
    url: url, 
    headers: { 
     "My-First-Header":"first value", 
     "My-Second-Header":"second value" 
    } 
    //OR 
    //beforeSend: function(xhr) { 
    // xhr.setRequestHeader("My-First-Header", "first value"); 
    // xhr.setRequestHeader("My-Second-Header", "second value"); 
    //} 
}).done(function(data) { 
    alert(data); 
});

當我發出這個請求，我看有螢火，我看到這個標題：

OPTIONS XXXX/YYYY HTTP/1.1
主持人：127.0 .0.1：6666
User-Agent：Mozilla/5.0（Windows NT 6.1; WOW64; rv：11.0）Gecko/20100101 Firefox/11.0
Accept：text/html，application/xhtml + xml，application/xml; q = 0.9，/; Q = 0.8
接受語言：FR，FR-FR; Q = 0.8，EN-US; Q = 0.5，連接; Q = 0.3
接受編碼：gzip，放氣
連接：保持-alive
來源：空
訪問控制請求-方法：POST
訪問控制請求報頭：我先頭，我-第二頭
雜注：無緩存
Cache-Control：no-cache

爲什麼我的自定義頁眉去Access-Control-Request-Headers：

訪問控制請求報頭：我先頭，我-第二頭

我期待這樣的標頭值：

我入先部首：第一值
我的 - 第二報頭：第二值

可能嗎？

來源

2012-04-10 fingerup

可能的重複[如何添加一個自定義的HTTP頭到js或jQuery的ajax請求？]（http://stackoverflow.com/questions/7686827/how-can-i-add-a-custom-http -jader-to-ajax-request-with-js-or-jquery） – Prestaul 2013-10-23 18:45:34

你在Firefox中看到的不是實際的請求;請注意，HTTP方法是OPTIONS，而不是POST。這實際上是「飛行前的要求是，瀏覽器發出來確定跨域AJAX請求是否應該被允許：

http://www.w3.org/TR/cors/

在飛行前的訪問控制請求，頭頭請求包含實際請求中的標題列表。然後希望服務器在瀏覽器提交實際請求之前報告在這種情況下是否支持這些頭文件。

來源

2012-09-10 03:44:33 karlgold

謝謝，從前端角度來看這真的很難看。 – antpaw 2015-03-05 15:18:41

329

下面是一個例子，如何設置請求頭中的一個jQuery AJAX調用：

$.ajax({ 
    type: "POST", 
    beforeSend: function(request) { 
    request.setRequestHeader("Authority", authorizationToken); 
    }, 
    url: "entities", 
    data: "json=" + escape(JSON.stringify(createRequestObject)), 
    processData: false, 
    success: function(msg) { 
    $("#results").append("The result =" + StringifyPretty(msg)); 
    } 
});

來源

2012-11-22 15:02:59 milkovsky

thx，我知道用自定義標題發送Ajax請求。我的問題是與不同的域..我所有的自定義頭被放入訪問控制請求頭。它只是瀏覽器中的安全性：跨域。 – fingerup 2012-11-23 17:36:24

是的，在瀏覽器中跨域請求會造成一些困難。你總是可以使用一些代理腳本來發送你的跨域請求 – milkovsky 2012-11-25 13:14:00

RequestHeader在Firefox中工作？ – kk1076 2013-02-22 05:40:31

下面這段代碼對我的作品。我總是隻使用單個括號，並且它工作正常。我建議你應該只使用單個括號或只使用雙括號，但不要混淆在一起。

$.ajax({ 
    url: 'YourRestEndPoint', 
    headers: { 
     'Authorization':'Basic xxxxxxxxxxxxx', 
     'X_CSRF_TOKEN':'xxxxxxxxxxxxxxxxxxxx', 
     'Content-Type':'application/json' 
    }, 
    method: 'POST', 
    dataType: 'json', 
    data: YourData, 
    success: function(data){ 
     console.log('succes: '+data); 
    } 
    });

希望這回答你的問題...

來源

2014-11-14 12:45:18

thx，我知道發送Ajax請求與自定義標題。我的問題是與不同的域..我所有的自定義頭被放入訪問控制請求頭。它只是瀏覽器中的安全性：跨域。 – fingerup 2014-11-14 13:53:12

謝謝，我偶然設置了標題：「授權：基本XXXXXX」，iOS 9/Safari 9在項目中引發了SyntaxError DOM 12。 – Mark 2015-10-01 15:00:58

你是指雙引號還是單引號？我不認爲任何人會使用雙括號。 – DBS 2016-06-01 08:47:09

這就是爲什麼你不能用Javascript創建一個bot，因爲你的選擇僅限於瀏覽器允許你做的事情。您不能僅僅訂購遵循大多數瀏覽器遵循的CORS策略的瀏覽器，將隨機請求發送到其他來源，並讓您獲得簡單的響應！

此外，如果您嘗試從瀏覽器附帶的開發人員工具手動編輯一些請求標頭，如origin-header，瀏覽器將拒絕您的編輯，並可能發送預檢OPTIONS請求。

來源

2016-05-03 10:31:52

-10

嘗試使用rack-cors寶石。並在您的ajax調用中添加標題字段。

來源

2016-07-06 23:30:41

使用jQuery在AJAX請求中添加標頭

回答

相關問題