12

I have website that use XMLHttpRequest (jQuery, actually). I also have another site running on the same server, which serves a script file that makes XHR requests back to THAT site, ie.

http://mysite:50000/index.html includes

<script src="http://mysite:9000/otherscript.js"></script>

and http://mysite:9000/otherscript.js includes

$.ajax({
    url: 'http://mysite:9000/ajax/stuff'
});

The problem is - this doesn't work. The AJAX requests from the loaded script simply fail with no error message. From what I've been able to find this is the old same origin policy. Given that I control both sites, is there anything I can do to make this work? The "document.domain" trick doesn't seem to do a thing for XMLHttpRequest.

EMP
  • 59,148
  • 53
  • 164
  • 220
  • The request is actually made, it is "just" that your origin won't be able to read the response without [CORS](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS) being enabled. [`Cross-origin writes are typically allowed.`](https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy#Cross-origin_network_access) – SilverlightFox Oct 30 '20 at 15:07

3 Answers3

10

Nope- can't do this with XHR. Same-domain policy is very restrictive there- same host, same port, same protocol. Sorry! You'll have to resort to other tricks (iframes, title manipulation, etc) to get it to work.

nitzmahone
  • 13,720
  • 2
  • 36
  • 39
  • If you have signed javascript you can do this on FF. – bmargulies Nov 20 '09 at 00:13
  • 3
    See http://dannythorpe.com/2008/07/28/cross-domain-transport-with-windowname/ and http://orensol.com/2009/06/07/cross-domain-ajax-calls-and-iframe-communication-how-to/ for examples. There are jQuery and dojo addons that wrap this stuff up nicely. – nitzmahone Nov 20 '09 at 00:13
  • Here's a jQuery plugin that wraps it up- I've seen several others but can't lay my hands on them now: http://friedcellcollective.net/outbreak/jsjquerywindownameplugin/ – nitzmahone Nov 20 '09 at 00:17
  • The window.name plugin looked very promising, but unfortunately it also fails to work. :( – EMP Nov 20 '09 at 03:20
  • Since you control both sites, you could also do JSONP (see http://www.ibm.com/developerworks/library/wa-aj-jsonp1/?ca=dgr-jw64JSONP-jQuery&S_TACT=105AGY46&S_CMP=grsitejw64). jQuery supports this natively- you just have to get the server to spit JSONP (you didn't specify your server technology). – nitzmahone Nov 20 '09 at 04:51
  • as i mentioned above if you have proper headers you can do cors – nikoss Mar 12 '16 at 01:49
10

You can do this by adding Access-Control-Allow-Origin header.

If you are using PHP

header("Access-Control-Allow-Origin: http://example.com");

or in Node.js

response.writeHead(200, {'Access-Control-Allow-Origin':' http://example.com'});

This should do the trick for you. It always works for me.

CodeManX
  • 11,159
  • 5
  • 49
  • 70
nikoss
  • 3,254
  • 2
  • 26
  • 40
1

I just solved a similar issue with a PHP service I'm currently playing around with (not sure how relevant a PHP solution is to this directly, but...) by making a single line proxy PHP page, SimpleProxy.php:

<?php
echo file_get_contents('http://localhost:4567');
?>

And in my XMLHttpRequest I use 'SimpleProxy.php' in place of 'http://localhost:4567', which effectively puts the request on the same domain as my .js code.

HomerPlata
  • 1,687
  • 5
  • 22
  • 39