I am trying to make an AJAX call from several domains to a single one which will handle the request. Enabling Cross domain in Firefox and Chrome was easy by setting the header on the handling server:
header("Access-Control-Allow-Origin: *");
But this doesn't help enabling it in Internet Explorer. When I try:
httpreq.send('');
it stops with error Access denied.
How can this be enabled in Internet Explorer?
Much has changed since I first posted my solution for CORS in IE7 and above. First of all the jQuery property $.support.cors is true by default, .NET frameworks 4.0 and above no longer support CORS as implemented in versions 3.5.1 and lower. When writing a web service with ASP.NET 4.0 I had install the Thinktecture.IdentityModel which is available as a NuGet package. Then, in the Application_Start method of the Global.asax file, add:
void Application_Start(object sender, EventArgs e)
{
Thinktecture.IdentityModel.Http.Cors.IIS.UrlBasedCorsConfiguration.Configuration
.ForResources("*")
.ForOrigins("http://localhost:80, http://mydomain")
.AllowAll()
.AllowMethods("GET", "POST");
}
Now add the httpProtocol element within system.webServer:
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="Content-Type, Accept, X-Requested-With, X-File-Name" />
<add name="Access-Control-Allow-Methods" value="GET, POST" />
</customHeaders>
</httpProtocol>
My $.ajax call is now:
$.ajax({
url: serviceUrl,
data: JSON.stringify(postData),
type: "POST",
cache: false,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: onSuccess,
error: onError
});
I don't believe you can do that directly in Internet Explorer. You have a couple of options:
Set up a proxy forwarding script on the server you do control that can forward the Ajax requests. Make sure that it only forwards to the appropriate destinations that you need so that you don't get turned into an anonymous relay.
Use the document.domain trick. Basically you need to create a set of iframes, one for each server you need to make Ajax calls to. Within each iframe set the document.domain property to exactly match the domain you need to send the Ajax requests to. As to how to populate the necessary data, use DOM manipulation prior to setting document.domain. Note that this trick requires the target servers to be in sub-domains of the original. More in this article, with examples.
I got IE8 and 9 working with just jQuery $.ajax (jQuery version 1.7.2)
jQuery.support.cors = true;
jQuery(function() {
$.ajax({
crossDomain : true,
dataType: 'html',
//...
});
});
For Internet Explorer 8, you need to do like for FF3, ie use the "Access-Control-Allow-Origin" header plus use XDomainRequest object instead of XMLHttpRequest. Everything is explaiend in detail here for IE8: http://msdn.microsoft.com/en-us/library/dd573303%28VS.85%29.aspx
Older flavours of IE don't support Cross Site Access Control nor XDomainRequest objects. However it's not over, you could resort to the IFrame trick for instance, ie creating an invisible IFrame that calls your functions as described here: http://softwareas.com/cross-domain-communication-with-iframes
Just adding to the Eric's answer , for Older version of IE , you can use Jquery 1.4.2's $.ajax method , that by default allows the cross domain requests, or for cross domain JSON , you can use
jQuery.getJSON( String url, Map data, Function callback ) returns XMLHttpRequest
An Excerpt from Jquery docs.
"jQuery now supports JSONP natively - if you attempt to load JSON (via $.getJSON or $.ajax) from a remote URL then an extra callback will be provided for the server to interpret."
