jQueryを使用したAJAXリクエストのヘッダーの追加

Question

jQueryのAJAX POSTリクエストにカスタムヘッダーを追加したいとします。

私はこの試みている：私はこの要求を送信し、私は放火犯で見るとき

$.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); 
}); 

を、私はこのヘッダを参照してください：127.0：XXXX/YYYY HTTP/1.1
ホスト

OPTIONSを.0.1：6666
ユーザエージェント：Mozilla/5.0（Windows NT 6.1; WOW64; rv：11.0）Gecko/20100101 Firefox/11.0
受け入れ：text/html、application/xhtml + xml、application/xml; q = 0.9,/; Q = 0.8
受け入れ言語：FR、FR-FR; EN-US Q = 0.8、; Q = 0.5、EN; Q = 0.3
受け入れエンコード：gzipで、
接続を収縮：保ちます-alive
起源：ヌル
アクセス制御リクエスト-方法：POST
アクセス制御リクエスト・ヘッダー：マイ・ファースト・ヘッダ、MY-第ヘッダ
プラグマ：ノーキャッシュ
キャッシュ制御：no-cache

はなぜカスタムヘッダーはAccess-Control-Request-Headersに行く：

アクセス制御リクエスト・ヘッダー：私の-最初のヘッダ、私-第二のヘッダ

私はこのようなヘッダー値を期待していました。

マイ・ファースト・ヘッダー：最初の値
マイ・セカンド・ヘッダ：秒値

可能ですか？

Answer 1

Firefoxで見たのは実際のリクエストではありませんでした。 HTTPメソッドはPOSTではなくOPTIONSであることに注意してください。これは、実際にブラウザがクロスドメインAJAX要求を許可するかどうかを決定することができる「飛行前の要求だった：

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

飛行前におけるアクセス制御 - 要求 - ヘッダヘッダリクエストには、実際のリクエスト内のヘッダーのリストが含まれます。サーバーは、ブラウザが実際の要求を送信する前に、これらのヘッダーがこのコンテキストでサポートされているかどうかを報告することが期待されます。ここで

Answer 2

は、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)); 
    } 
}); 

Answer 3

以下このコードは私のために動作します。私は常に単一のブラケットだけを使用し、それは正常に動作します。私はあなたが単一のかっこだけを使用するか、または二重括弧しか使用しないでくださいが、混同しないことをお勧めします。

$.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); 
    } 
    }); 

ご希望の質問にお答えください...

Answer 4

これは、Javascriptを使用してボットを作成できない理由です。これは、ブラウザのオプションに制限があるためです。ほとんどのブラウザーが従う、CORSポリシーに従ったブラウザーに、ランダムな要求を他の起点に送信し、単にその応答を得ることはできません。

さらに、ブラウザに付属のデベロッパーツールからorigin-headerなどのリクエストヘッダーを手動で編集しようとすると、ブラウザは編集を拒否し、プリフライトOPTIONSリクエストを送信することがあります。

Answer 5

rack-cors gemを使用してください。そして、あなたのajax呼び出しにヘッダーフィールドを追加します。