Yelp API Origin http: // localhost: 8888 not allowed Access-Control-Allow-Origin

Question

Using the following code, I get an error in the title of this question using the Chrome JavaScript developer console:

jQuery.getJSON("http://api.yelp.com/business_review_search?term=starbucks&location=Urbana%20IL&limit=3&ywsid=XXX", function(data){ jQuery.each(data, function(i,businesses){ jQuery("#yelpPreview").append(businesses.url); if ( i == (amount - 1) ) return false; }); }); 

Full error: XMLHttpRequest cannot load http://api.yelp.com/business_review_search?term=starbucks&location=Urbana%20IL&limit=3&ywsid=XXX . Origin http: // localhost: 8888 not allowed Access-Control-Allow-Origin.

I use MAMP as my local host.

Is this a problem when Yelp blocks API access to the local host or is there an error in my code?

Answer 1

It looks like you are using jQuery. The jsonp option for the data type provided by the jQuery ajax call is a more elegant solution for this, as a short example:

 $.ajax({ url : 'http://api.yelp.com/business_review_search', dataType : 'jsonp', data : {term : 'restaurant', lat : xxx, long : xxx}, // callback is not necessary success : function(data) { // data is a normal response shown on yelp API page } });