How to get 'getJSON' response header

Question

I need to access the size of response message I am getting from another machine (cross-domain request) using $.getJSON, although I can see the request and response in chrome console, it does not work. Here is my request code:

xhr=$.getJSON('http://192.168.1.102/server/server.php?callback=?',   
{data:array}, function(res){
alert(xhr.getAllResponseHeader());
}, 
type='json');

when running I get "Uncaught TypeError: Object # has no method 'getAllResponseHeader' " error. When I use

alert(xhr.getResponseHeader("Content-Length"));

I get "null".

Please consider that I am using cross-domain get.

For cross domain, it probably uses JSONP. and their doc says `However, since JSONP and cross-domain GET requests do not use XHR, in those cases the jqXHR and textStatus parameters passed to the success callback are undefined.` — HungryCoder, Mar 13 '13 at 12:39
1- @Andrei : thanks for "s" you are right, when I alert xhr.getAllResponseHeaders(); it returns nothing, not even null. — Espanta, Mar 13 '13 at 12:48
@HungryCoder Then what is the solution? Can we count bts by own in javascript and php? — Espanta, Mar 13 '13 at 12:49
@FAngel Yes, I am getting a sorted array of numbers sorted using a pHp file. — Espanta, Mar 13 '13 at 12:53
As far as I know, cross domain requests are done with `script` tag and it does not provide request headers info, at least I never heard about that. So, I'm afraid you just can't get Content-Length header in case of that request. — Viktor S., Mar 13 '13 at 13:13

score 4 · Answer 1 · edited May 23 '17 at 10:30

4

Do not use JSONP, it isn't really a cross domain request (JSONP explained), it's a hack that only works for GET requests, whereas AJAX allows any http method.

Try preparing your server to allow cross domain requests (more details) and doing this:

$.ajax({
type: "get",
url: "http://192.168.1.102/server/server.php",
crossDomain: true,
cache: false,
dataType: "json",
contentType: "application/json; charset=UTF-8",
data: array,
success: function(data, textStatus, xhr) {
    console.log(data);
    console.log(xhr.getResponseHeader("Content-Length"));
},
error: function (xhr, textStatus, errorThrown) {
    console.log(errorThrown);
}});

Thereby, the xhr object is set and you can access it's header.

edited May 23 '17 at 10:30

Community

1
1

answered Mar 13 '13 at 14:12

vhtc

790
6
12

thanks vhtc, I will try it soon. Can I do POST using this approach as well? I use Apache Tomcat, is it okay then? – Espanta Mar 14 '13 at 03:49
You can make http requests of any type. – vhtc Mar 14 '13 at 13:36
2

On the server side, you need to add the Access-Control-Allow-Origin header to the response. – vhtc Mar 14 '13 at 13:53
thank you very much Hopefully I will be able to do it tomottow. I will get back to you with results. I have already addedd Accecc-control-allow-origin to the php side. many thanks – Espanta Mar 14 '13 at 18:00
Hi vhtc, I tried & have difficulties. Here is the server code. header("Content-Type: application/json"); header("Access-Control-Allow-Origin :*"); header("Access-Control-Request-Method :GET, POST"); and in client I copied your code. But, in the console error is thrown. This is the error: OPTIONS http://192.168.1.102/server/server.ph…ed=&undefined=&undefined=&undefined=&undefined=&undefined=&_=1363329485854 send p.extend.ajax callJSON (anonymous function) p.event.dispatch g.handle.h errorThrown I kept ajax in callJSON() function to repeat it 30 times. So, where is wrong? Plz help tnx. – Espanta Mar 15 '13 at 06:54
Once contentType: "application/json; charset=UTF-8", the 'array' you are passing as parameter needs to be a json object. data: {foo : 'bar'} – vhtc Mar 15 '13 at 14:56
Nop I afraid. Since I am generating my array using javascript, I think making a json object becomes slightly tricky. I am now concern about that. Should I choose PhP instead? – Espanta Mar 19 '13 at 04:07

score 1 · Answer 2 · edited May 23 '17 at 10:30

1

Try this:

xhr=$.getJSON('http://192.168.1.102/server/server.php?callback=?',   
  {data:array}, function(res,status,xhr){
    alert(xhr.getAllResponseHeaders()); 
    // not getAllResponseHeader its only getResponseHeader
});

For cross domain use

$.ajax({
  url: 'http://192.168.1.102/server/server.php?callback=?',
  dataType: 'json',
  jsonpCallback: 'MyJSONPCallback', // specify the callback name if you're hard-coding it
  success: function(data){
    // we make a successful JSONP call!
  }
});

Refer this jQuery getJSON works locally, but not cross domain

Docs For getAllResponseHeaders, getResponseHeader and ajax http://api.jquery.com/jQuery.ajax/

edited May 23 '17 at 10:30

Community

1
1

answered Mar 13 '13 at 12:43

Rohan Kumar

40,431
11
76
106

thanks Rohan, I have an Indexed array of number to send th the server. Is is okay if I send data:array. When I do so, the request header becomes full of undefined=&...server/server.php?callback=callback&undefined=&undefined=&undefined=&undefined. I guess my data should be in a form of key/value, so I did data:{1:123} and sent, but I never receive any reply. – Espanta Mar 13 '13 at 13:21
The first code block is confusing: It uses `getAll...` but the comment says not to use it. – Aaron Digulla Oct 29 '14 at 09:01

score 0 · Accepted Answer · edited Feb 09 '16 at 13:24

I observed many visits to this question and thought it is good to provide the solution to this problem. Unfortunately none of the offered solutions worked and I did two things to solve the problem.

I verified that I have the following codes right after the <?php tag in my server side:

header("Content-Type: application/*");
header("Access-Control-Allow-Origin :*");
header("Access-Control-Allow-Methods: POST, GET, OPTIONS");
header("Access-Control-Max-Age: 1000");
header("Access-Control-Allow-Headers: Content-Type");

I slightly changed the way I do the call as follows and it always works for me.

function name(){
    $.ajax({
        type: 'POST',
        crossDomain: true,
        data: {
            data1: data
        },
        dataType: 'text',
        error: function (res, textStatus, errorThrown) {
            alert('Connection Terminated. Please try again');
        },
        success: function(res, textStatus, jqXHR) {
        //Process the result in res;
        },
    });//ajax
}//function name

How to get 'getJSON' response header

3 Answers3