web-dev-qa-db-ja.com

jQueryおよびAJAX応答ヘッダー

したがって、このjQuery AJAX呼び出しがあり、応答は302リダイレクトの形式でサーバーから送信されます。このリダイレクトを取得してiframeにロードしたいのですが、javascriptアラートでヘッダー情報を表示しようとすると、firebugで正しく認識されていても、nullになります。

これが役立つ場合のコードは次のとおりです。

$j.ajax({
    type: 'POST',
    url:'url.do',
    data: formData,
    complete: function(resp){
        alert(resp.getAllResponseHeaders());
    }
});

URLを応答本文に移動するためにサーバー側のものに実際にアクセスすることはできません。これが最も簡単な解決策であることがわかっているので、ヘッダーの解析に関するヘルプは素晴らしいでしょう。

148
Shane

古いバージョンのjqueryを使用している場合、cballouのソリューションは機能します。新しいバージョンでは、次を試すこともできます:

  $.ajax({
   type: 'POST',
   url:'url.do',
   data: formData,
   success: function(data, textStatus, request){
        alert(request.getResponseHeader('some_header'));
   },
   error: function (request, textStatus, errorThrown) {
        alert(request.getResponseHeader('some_header'));
   }
  });

ドキュメントによる XMLHttpRequestオブジェクトはjQuery 1.4以降で利用可能です。

163
rovsen

これが CORSリクエスト の場合、デバッグツール(Chrome-> Inspect Element-> Networkなど)にすべてのヘッダーが表示される場合がありますが、xHRオブジェクトは(xhr.getResponseHeader('Header')を介して)ヘッダーのみを取得しますヘッダーは 単純な応答ヘッダー

  • Content-Type
  • Last-modified
  • Content-Language
  • Cache-Control
  • Expires
  • Pragma

このセットにない場合、サーバーによって返される Access-Control-Expose-Headers ヘッダーに存在する必要があります。

問題のケースについて、CORS要求の場合、以下のヘッダーが存在する場合にのみ、Locationオブジェクトを介してXMLHttpRequestヘッダーを取得できます。

Access-Control-Expose-Headers: Location

CORSリクエストでない場合、XMLHttpRequestを取得しても問題ありません。

127
acdcjunior
 var geturl;
  geturl = $.ajax({
    type: "GET",
    url: 'http://....',
    success: function () {
      alert("done!"+ geturl.getAllResponseHeaders());
    }
  });
29
keithics

AJAXおよび302リダイレクトに関する不幸な真実は、ブラウザーがヘッダーをXHRに提供しないため、戻りからヘッダーを取得できないことです。ブラウザに302が表示されると、リダイレクトが自動的に適用されます。この場合、ブラウザーがそれを取得したため、Firebugでヘッダーが表示されますが、ブラウザーがヘッダーを渡さなかったため、ajaxでは表示されません。これが、成功ハンドラとエラーハンドラが呼び出されない理由です。 completeハンドラーのみが呼び出されます。

http://www.checkupdown.com/status/E302.html

The 302 response from the Web server should always include an alternative URL to which redirection should occur. If it does, a Web browser will immediately retry the alternative URL. So you never actually see a 302 error in a Web browser

以下は、この件に関するstackoverflowの投稿です。一部の投稿では、この問題を回避するためのハッキングについて説明しています。

jQuery Ajax呼び出し後のリダイレクトリクエストの管理方法

JavaScriptで302 FOUNDをキャッチ

HTTPリダイレクト:301(永続)vs 302(一時)

17
DRaehal

JQueryによって使用される基礎となるXMLHttpRequestオブジェクト リダイレクトを常に黙って追跡します 302ステータスコードを返すのではなく。したがって、jQueryのAJAX要求機能を使用して、返されたURLを取得することはできません。代わりに、すべてのデータをフォームに入れ、iframeのtarget属性の値に name属性 を設定してフォームを送信する必要があります。

$('#myIframe').attr('name', 'myIframe');

var form = $('<form method="POST" action="url.do"></form>').attr('target', 'myIframe');
$('<input type="hidden" />').attr({name: 'search', value: 'test'}).appendTo(form);

form.appendTo(document.body);
form.submit();

サーバーのurl.doページはiframeにロードされますが、その302ステータスが到着すると、iframeは最終的な宛先にリダイレクトされます。

9
PleaseStand

これを試して:

type: "GET",
async: false,
complete: function (XMLHttpRequest, textStatus) {
    var headers = XMLHttpRequest.getAllResponseHeaders();
}
8
Corey Ballou

PleaseStandに+1します。こちらが私のもう1つのハックです。

検索して「クロスAjaxリクエスト」がXHRオブジェクトから応答ヘッダーを取得できないことがわかったため、私はあきらめました。代わりにiframeを使用します。

1. <iframe style="display:none"></iframe>
2. $("iframe").attr("src", "http://the_url_you_want_to_access")
//this is my aim!!!
3. $("iframe").contents().find('#someID').html()  

JQUERY 3以降のUPDATE 2018

私はこれが古い質問であることを知っていますが、上記の解決策のどれも私にとってはうまくいきませんでした。解決したソリューションは次のとおりです。

//I only created this function as I am making many ajax calls with different urls and appending the result to different divs
function makeAjaxCall(requestType, urlTo, resultAreaId){
        var jqxhr = $.ajax({
            type: requestType,
            url: urlTo
        });
        //this section is executed when the server responds with no error 
        jqxhr.done(function(){

        });
        //this section is executed when the server responds with error
        jqxhr.fail(function(){

        })
        //this section is always executed
        jqxhr.always(function(){
            console.log("getting header " + jqxhr.getResponseHeader('testHeader'));
        });
    }
1
sticky_elbows