JavaScript access from parent domain to subdomain?

Question

I've read that setting document.domain = "example.com" lets me access the parent domain from a subdomain.

Will the same work the other way around?

Let's say my main site is running under http://example.com. All API functions that I want to access via AJAX (GET & POST) are hosted on http://api.example.com.

Will I be able to access api.example.com from example.com?

EDIT: Looking at document.domain again, I don't think that this will solve the problem. The result from calls to api.example.com are not necessary HTML, but output from a PHP script running on the API server. It can be JSON, plain text, etc. so there's no way to set document.domain for that (since it's not an iframe).

Ernestinaernestine

Simply configure your server so that all resources from api.example.com return this HTTP header: Access-control-allow-origin: http://example.com – Margay

Which is called Cross Origin Resource Sharing, or CORS for short. – Nudibranch

Just a warning: CORS is not completely cross-browser yet, so you might be better off with JSONP for now. – Kalakalaazar

@Casey Yes, IE6 and IE7. I hope OP doesn't have to support those... – Margay

Answer 1

You need to set document.domain on BOTH pages

Alternatively set CORS headers on your server:

http://hacks.mozilla.org/2009/07/cross-site-xmlhttprequest-with-cors/

A Quick Overview of CORS

Firefox 3.5 and Safari 4 implement the CORS specification, using XMLHttpRequest as an “API container” that sends and receives the appropriate headers on behalf of the web developer, thus allowing cross-site requests. IE8 implements part of the CORS specification, using XDomainRequest as a similar “API container” for CORS, enabling simple cross-site GET and POST requests. Notably, these browsers send the ORIGIN header, which provides the scheme (http:// or https://) and the domain of the page that is making the cross-site request. Server developers have to ensure that they send the right headers back, notably the Access-Control-Allow-Origin header for the ORIGIN in question (or ” * ” for all domains, if the resource is public) .

The CORS standard works by adding new HTTP headers that allow servers to serve resources to permitted origin domains. Browsers support these headers and enforce the restrictions they establish. Additionally, for HTTP request methods that can cause side-effects on user data (in particular, for HTTP methods other than GET, or for POST usage with certain MIME types), the specification mandates that browsers “preflight” the request, soliciting supported methods from the server with an HTTP OPTIONS request header, and then, upon “approval” from the server, sending the actual request with the actual HTTP request method. Servers can also notify clients whether “credentials” (including Cookies and HTTP Authentication data) should be sent with requests.

Nudibranch

What if the page on api.example.com is not an HTML page, but text data returned from a PHP script? – Ernestinaernestine

IE 8 and later can do XDomainRequest(), too. – Mojave

Yes, see the text: "IE8 implements part of the CORS specification, using XDomainRequest " – Nudibranch

Guess you are not supporting IE7 if you selected this as an answer with CORS? – Mesencephalon

Actually I believe IE7 might still be happy if you add the server url to trusted sites – Nudibranch

Should be noted that IE8 and IE9 do not send the cookies not even if credentials -> true . – Cordellcorder