CODEWITHSUNDEEP
jqueryajax
Eswar Rajesh Pinapala
Eswar Rajesh Pinapala

Reputation: 4911

jquery ajax post says xxx not allowed by Access-Control-Allow-Origin

I was trying to call eBay FindProducts API using AJAX (post request) but was stuck at the following error:

XMLHttpRequest cannot load http://open.api.ebay.com/shopping?callname=FindProducts. Origin http://localhost.com/test.php is not allowed by Access-Control-Allow-Origin.

My code:

$.ajax
({
    type: "POST",
    url: 'http://open.api.ebay.com/shopping?callname=FindProducts',
    dataType: ($.browser.msie) ? "text" : "xml",
    contentType: 'application/x-javascript',
    crossDomain : true,
    data: {
        'X-EBAY-API-APP-ID' : 'ebayAppId', 
        'X-EBAY-API-VERSION': '771', 
        'X-EBAY-API-SITEID': '0', 
        'X-EBAY-API-REQUEST-ENCODING': 'NV', 
        'X-EBAY-API-RESPONSE-ENCODING': 'json',
        'QueryKeywords' : '753759971632',
        'MaxEntries' : '3'
    },
    success: function (result) {
        alert('success');
        alert(result);
    },
    error: function (data) {
        alert((data));
    }
})

How can I get through this error.

I tried setting dataType : jsonp (I know XML is being retrieved, but to workaround the error I set it to jsonP). It works but jQuery was unable to parse the XML as the json response was expected.

Upvotes: 3

Views: 12404

Answers (3)

albinohrn
albinohrn

Reputation: 626

If you add &responseencoding=JSON to your URL you will get the response as JSON according to docs

UPDATE Working example. What I've done is that I changed to dataType:'jsonp' added jsonp:'callbackname'. Because jQuery by default calls the callback parameter callback, but eBay expect it to be called callbackname. What you have to do is add your parameters to the data map. Make sure you use the correct parameter names, check the docs and use the URL method not the header method. Hope this helps.

Upvotes: 8

Eswar Rajesh Pinapala
Eswar Rajesh Pinapala

Reputation: 4911

I finally got thi to work by doing 2 things, Thanks to Albin.

I changed to dataType:'jsonp' added jsonp:'callbackname'. Because jQuery by default calls the callback parameter callback, but eBay expect it to be called 'callbackname'. XML was not working due to CRO problem with eBay(need to confirm though.)

Used the chrome console to debug the object retreived, converetd to string using JSON.Stringify().

Hope this helps somebody!

Cheers, Rajesh

Upvotes: 0

Styxxy
Styxxy

Reputation: 7517

If you read the jQuery.ajax() documentation, you can use jsonp and still have a different return type to be parsed.

multiple, space-separated values: As of jQuery 1.5, jQuery can convert a dataType from what it received in the Content-Type header to what you require. For example, if you want a text response to be treated as XML, use "text xml" for the dataType. You can also make a JSONP request, have it received as text, and interpreted by jQuery as XML: "jsonp text xml." Similarly, a shorthand string such as "jsonp xml" will first attempt to convert from jsonp to xml, and, failing that, convert from jsonp to text, and then from text to xml.

So basically all you have to do is change your dataType line of code to this:

dataType: ($.browser.msie) ? "jsonp text xml" : "xml",

Or you can add a &responseencoding=JSON parameter to your URL, as stated in another answer.

Upvotes: 0

Related Questions