jQuery and AJAX response header

So I've got this jQuery AJAX call, and the response comes from the server in the form of a 302 redirect. I'd like to take this redirect and load it in an iframe, but when I try to view the header info with a javascript alert, it comes up null, even though firebug sees it correctly.

Here's the code, if it'll help:

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

I don't really have access to the server-side stuff in order to move the URL to the response body, which I know would be the easiest solution, so any help with the parsing of the header would be fantastic.

cballou's solution will work if you are using an old version of jquery. In newer versions you can also try:

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

According to docs the XMLHttpRequest object is available as of jQuery 1.4.

How to read/get response header from ajax/http/service/api call or , Let's say we want to read the on of the response header value. There are two ways to do that. Let's see the first approach.( For jQuery version  Using getResponseHeader with jQuery’s ajax method The Canvas API uses pagination for requests that return multiple items . The URL of the next result set is specified in an HTTP response header.

Using getResponseHeader with jQuery's ajax method – The , The URL of the next result set is specified in an HTTP response header. I know how to get the response body, but how do I get the response headers from a jQuery AJAX call? The jQuery ajax documentation indicates that the “[jqXHR] object returned by $. jQuery and AJAX response header - Stack Overflow So I've got this jQuery AJAX call, and the response comes from the server in the form of a 302 redirect. I'd like to take this redirect and load it in an iframe, but when I try to view the header i

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

Getting response headers data from an AJAX request with javascript, How to get data from the response headers in an AJAX request using plain javascript or jQuery. An example using the WordPress JSON API. Is it possible for jQuery to access the getResponseHeader or getAllResponseHeaders methods for a regular non-ajax request? I investigated the onReady and onLoad event but to no luck.

The unfortunate truth about AJAX and the 302 redirect is that you can't get the headers from the return because the browser never gives them to the XHR. When a browser sees a 302 it automatically applies the redirect. In this case, you would see the header in firebug because the browser got it, but you would not see it in ajax, because the browser did not pass it. This is why the success and the error handlers never get called. Only the complete handler is called.

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

Here are some stackoverflow posts on the subject. Some of the posts describe hacks to get around this issue.

How to manage a redirect request after a jQuery Ajax call

Catching 302 FOUND in JavaScript

HTTP redirect: 301 (permanent) vs. 302 (temporary)

Pass request headers in a jQuery AJAX GET call, setting can be overwritten from within the beforeSend function. jQuery and AJAX response header (6) +1 to PleaseStand and here is my other hack: after searching and found that the "cross ajax request" could not get response headers from XHR object, I gave up. and use iframe instead.

The underlying XMLHttpRequest object used by jQuery will always silently follow redirects rather than return a 302 status code. Therefore, you can't use jQuery's AJAX request functionality to get the returned URL. Instead, you need to put all the data into a form and submit the form with the target attribute set to the value of the name attribute of the iframe:

$('#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();

The server's url.do page will be loaded in the iframe, but when its 302 status arrives, the iframe will be redirected to the final destination.

jQuery: Return data after ajax call success, is a JavaScript framework that makes life easier for people who want to program for the browser. Stack Overflow Public questions and Here is an example how to set a request header in a jQuery Ajax call: to send random requests to other origins and allow

JavaScript, JQuery, Ajax: Are They The Same Or Different? -, This header tells the server what kind of response it will accept in return. For example, the following defines a custom type mycustomtype to be sent with the  The jQuery XMLHttpRequest (jqXHR) object returned by $.ajax() as of jQuery 1.5 is a superset of the browser's native XMLHttpRequest object. For example, it contains responseText and responseXML properties, as well as a getResponseHeader() method.

jQuery.ajax(), REST / Ajax querie are part of our day as a web developer. Recently, we had to handle response headers (when communicating with  jQuery made the setting of custom ajax headers extremely easy using the headers property and beforeSend callback function both part of jQuery.ajax() interface. headers - a plain javascript object consisted of key/value pairs to sent along with ajax request.

How to get response headers on all jquery ajax requests , The getResponseHeader() method returns specific header information from the server response. Example. var xhttp = new XMLHttpRequest(); xhttp. You can use code below - CODE SAMPLE 1 [code ]$.ajax({ url: 'YourRestEndPoint', headers: { 'Authorization':'Basic xxxxxxxxxxxxx', 'X_CSRF_TOKEN&#039;:&#039

Comments
  • if you're visiting this question in 2017 or later, please don't waste time with most of the existing answers. If your problem is same as OP, you've two options: 1) set up a proxy server which will post the original server and extract target-data and front-end JS will request this proxy-server for the target-data. Or, 2) change server's code to allow CORS.
  • As of jQuery >= 1.5, it should be called jqXHR, which is a superset of an XHR object.
  • @acdcjunior thank you it helped me also, after I have invested some time into finding out why there was no output in header response
  • does not work for me. maybe I am doing the request to another site? ( cross site request using ajax)
  • For people who couldn't have it work like me. It's probably because you are doing a cross domain access which jquery does not use XHR. api.jquery.com/jQuery.get
  • Woked like a charm.. +1
  • Hmm. Thanks so much for the response, but that's still returning null. Any other ideas?
  • maybe you are using an old version of jquery.