-1

Im attempting to make an AJAX request using this url http://api.adorable.io/avatars/285/sd I've set crossDomain to true but still the request fails each time with this error. 

No 'Access-Control-Allow-Origin' header is present on the requested resource.

It's not possible to make the request using http://www.api.adorable.io/avatars/285/sd. What am I dong wrong here? Please help

$(document).ready(function(){    
 $.ajax({
        url: "http://api.adorable.io/avatars/285/sd",
        type: "GET",
        crossDomain: true, // enable this
        success: function (data) {
           console.log(data);
        }
    });
});
Terrance
  • 275
  • 1
  • 3
  • 11

1 Answers1

1

It's not enough to set it in your Ajax call, the file you're calling (http://api.adorable.io/avatars/285/sd) needs the header to allow cross domain calling.

header('Access-Control-Allow-Origin: *');

Would be the code to add for PHP to allow all origins. Change the * to your domain if you only want to allow a specific domain.

Since you don't have control over that URL, you need a good workaround. What you can do is create a PHP file locally that you control that uses cURL to get the resource you're calling from adorable.io through their API, and use your Ajax request to call that local PHP script. Then you don't need to worry about cross domain issues in the Ajax, and everything will work. Adds a small amount of overhead to the process, but is an easy workaround.

Arielle Lewis
  • 540
  • 4
  • 14