0

I am doing a cross-domain request from site1.com to site2.com (both maintained by me)

This is the jquery code on site1.com :

$.ajax({
        type: 'POST',
        url: 'http://site2.com/test/carrousel.cfm',
        cache: false,
        async: true,
        crossDomain: true, 
        dataType: "jsonp",
        success: function (data, status) {
           alert(data);}
        },
        error: function (xhr, textStatus, errorThrown) {
           alert('error');
        }
    });

I can see the request coming in with status 200 in the debugger. The response body also contains the string that I'm sending from the server. That string is: "okay"

Strange enough, the error handler is always fired and I can't access the data. I'm sending the Access-Control-Allow-Headers and Access-Control-Allow-Origin headers via the server too (I came across some posts asking to do this)

I also get a script error saying 'OKAY' is undefined. 'OKAY' is the string I get as a reply from the server. How come this is happening? And How can I get this cross domain request to succeed?

I'm using JQUERY 1.10.2 & IE 10

As you can see I'm also using jsonp & the right parameters as defined in the jquery documentation to perform cross domain requests

PoeHaH
  • 1,936
  • 3
  • 28
  • 52
  • 1
    you are saying the the response is of type `jsonp` but your response is a string `okay` which is invalid, `jsonp` response should be of format `somemethod(data)`. Since your server is sending `Access-Control-Allow-Origin` headers... change the datatype to `text` and try – Arun P Johny Oct 15 '13 at 15:05
  • 1
    *The response body also contains the string that I'm sending from the server. That string is: "okay"* `"okay"` is not valid jsonp. the cross-domain headers aren't needed for jsonp requests. – Kevin B Oct 15 '13 at 15:08
  • @ArunPJohny: setting the type to text still fires the errorhandle – PoeHaH Oct 15 '13 at 15:31
  • **I wrote an answer related to this question here: [Loading cross domain html page with jQuery AJAX](http://stackoverflow.com/questions/15005500/loading-cross-domain-html-page-with-jquery-ajax/17299796#17299796)** – _the last one, supports https_ – jherax Jun 26 '14 at 17:11

2 Answers2

1

You should try Ajax-cross-origin a jQuery plugin.

http://www.ajax-cross-origin.com/

$.ajax({
    crossOrigin: true,
    url: url,
    success: function(data) {
        console.log(data);
    }
});

You will be able to use ajax cross domain with no limitation!

Ninioe
  • 520
  • 1
  • 6
  • 6
0

Here's a simple JSONP excahnge:

  1. The client makes a <script src="target.js?arg=foo"> tag

  2. The server gets the request for target.js.

  3. The PHP server-side body of target.js is clientFunction("$_GET['arg']")

  4. The client gets back a script: clientFunction("foo")

  5. The client executes the script, which causes the client-side function clientFunction to run, with the argument "foo".

The obvious takeaway here is: JSONP responses are scripts. If your client asks for a JSONP response, it is asking for a script. The content "okay" is therefore being treated as a script, but okay hasn't been declared as a valid identifier in your client scripting environment, so it causes an error. (In my example above, we assume that clientFunction has been declared client-side before the exchange takes place.)

If you have control over the server and can serve CORS headers like Access-Control-Allow-Origin, then you don't need JSONP. Just make a normal Ajax request.

apsillers
  • 112,806
  • 17
  • 235
  • 239
  • Just keep in mind that if you want to support IE<10, you'll need to add support for CORS to jQuery so that it will work in IE8+. it will not work in IE7 regardless as it doesn't support CORS. – Kevin B Oct 15 '13 at 15:19
  • Namely, add IE8+ support by using a plugin: http://stackoverflow.com/questions/8688703/is-there-a-jquery-solution-that-uses-cors-when-available-and-falls-back-to-xdoma – apsillers Oct 15 '13 at 15:22
  • It's not letting me do normal ajax requests.. It still fires the error handle – PoeHaH Oct 15 '13 at 15:32
  • What I did now was format my string on the server like this: jsonpres = 'OKAY'; and on the client side, in the error handle, I can do console.log(jsonpres); But this is not a nice solution at all.. – PoeHaH Oct 15 '13 at 15:38