tags - instagram jquery ajax type="GET, can't get around CORS

Question

I have received this error

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

I am trying to make a $.ajax call to the instragram api. I am using the https://api.instagram.com/v1/tags/nofilter/media/recent?client_id=CLIENT-ID

end point. I have put in my client-ID and I get the CORS error. It can't find my localhost:3000, I don't know what to do. the endpoint works in postman when I tested. So I know it has something to do with CORS but I don't know who to set other options.

function getLooks(){

$.ajax({
  url: "https://api.instagram.com/v1/tags/ootd/media/recent?client_id=someidnumbersxxxxxxxxxxxxxx",
  type: "GET",
  crossDomain: true,
  success: function(data){
    console.log(data);
    _.each(data, function(look){
      console.log(look);

      //var $look = template(look);
      //$("#looks-container").append($look);
    });
  }
});

}

Any have this issues. Any help or link to other material will help.

Answer 1

You can use the dataType jsonp for GET requests.

$.ajax({
    url: "https://api.instagram.com/v1/tags/ootd/media/recent?client_id=someidnumbersxxxxxxxxxxxxxx",
    type: "GET",
    crossDomain: true,
    dataType: "jsonp",
    success: function(data){
        console.log(data);
        _.each(data, function(look){
            console.log(look);

            //var $look = template(look);
            //$("#looks-container").append($look);
        });
    }
});