53

Create a web service on http://www.a.com/service.asmx and send a cross-domain ajax request to it from http://www.b.com. Check the headers in Firebug, or in Live HTTP Headers, or any other plugin you wish.

There is no trace of the X-Requested-With HTTP Header field among request headers.

However, if you send an ajax request to the same service from the same domain (say for example http://www.a.com/about), you will see that header field.

Why is the X-Requested-With header field omitted for cross-domain ajax requests?

Update: I know that JSONP calls are not AJAX calls in nature. Thus you won't see any X-Requested-With header field, in JSONP calls.

Saeed Neamati
  • 35,341
  • 41
  • 136
  • 188

1 Answers1

87

If you are using jQuery to do your ajax request, it will not send the header X-Requested-With (HTTP_X_REQUESTED_WITH) = XMLHttpRequest, because it is cross domain. But there are 2 ways to fix this and send the header:

Option 1) Manually set the header in the ajax call: 

$.ajax({
     url: "http://your-url...",
 headers: {'X-Requested-With': 'XMLHttpRequest'}
});

Option 2) Tell jQuery not to use cross domain defaults, so it will keep the X-Requested-With header in the ajax request: 

$.ajax({
  url: "http://your-url...",
 crossDomain: false
});

But with this, the server must allow those headers, then the server needs to print those headers: 

print "Access-Control-Allow-Origin: *\n";
print "Access-Control-Allow-Headers: X-Requested-With, Content-Type\n";

The first line above will avoid the error "Origin is not allowed by Access-Control-Allow-Origin."
The second line will avoid the error "Request header field X-Requested-With is not allowed by Access-Control-Allow-Headers."

Rodrigo De Almeida Siqueira
  • 1,762
  • 17
  • 13
  • 20
    The first line also allows everyone to do cross domain requests to your server which is not a good idea in general. The "Access-Control-Allow-Origin" header should be set dynamically by checking the "Origin" header against a whitelist. – LJᛃ Jun 26 '14 at 00:48