I have the following situation.
From an application located in https://subdomain.mydomain.com I am trying to get the html of a page located in https://mydomain.com/page.aspx
I’m doing this with the jquery $.ajax method.
$.ajax({
url: url,
type: 'GET',
contentType: 'application/x-www-form-urlencoded',
success: function (data, status, xhr) {
console.info("success");
},
error: function (xhr, status, error) {
console.error(error);
}
});
The aspx page is actually called and executed.
IE (through XDomainRequest) and Firefox have the same behavior: from the inspectors (IE dev tools and Firebug) I see that the response status is 200 OK and it has the expected size (80KB) but the response content is empty.
The jQuery error is not so useful:
readyState: 0,
responseText: ""
status: 0,
statusText: "error"
I guess it’s something involving the Same Origin Policy. I see people solving this kind of issues with YQL (but i don’t want to use additional libraries) and JSONP (but I’m working with plain HTML).
In a moment of desperation I have tried also tricks like
document.domain = 'mydomain.com';
jQuery.support.cors = true;
No success. Any tip?
The problem was due to the Access-Control-Allow-Origin that must be enabled on the called application. In my case, it was an asp.net application in IIS7 hosting. I had to add these lines in the web.config:
<?xml version="1.0" encoding="utf-8"?>
<configuration>
<system.webServer>
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
</customHeaders>
</httpProtocol>
</system.webServer>
</configuration>
The following website reports many configuration to enable CORS on many server types
In order to use IE’s or FF’s cross-origin requests you need to tune up your server side to send
Access-Control-Allow-Originheader with the response. And if you want to usedocument.domainit must be set not only at the requesting side, but in the response too. So you can use iframe to send such a request or use SCRIPT or JSONP since they have no cross-origin limitations.