Instagram API. XMLHttpRequest cannot load URL. Response for preflight has invalid HTTP status code 405

Question

I'm pretty new on using APIs and I am having a problem with Instagram's new api.

For a dislike function, the documentation states to use a delete method, but I keep getting an error: XMLHttpRequest cannot load URL. Response for preflight has invalid HTTP status code 405.

Funny thing is that when I try the exact same thing with curl, it works.

For example, this is a working method: curl -X DELETE https://api.instagram.com/v1/media/{media-id}/likes?access_token=ACCESS_TOKEN

But if I try to use it with javascript

if( user_has_liked ){
      $.ajax({
        crossDomain: true,
        url: "https://api.instagram.com/v1/media/"+ photoId +"/likes?access_token=" + ACCESS_TOKEN,
        method: 'DELETE',
        success: function(data){        
           response = data.data;
           document.getElementById(photoId).className = "fa fa-heart-o";
           document.getElementById(photoId).onClick = function(){
           subscribe(photoId, false);     
        }
      }
    });
  }

All I get is a 405 error.

I've tried enabling CORS but it seem to work either

I would be really grateful if anybody could give me a hand on this.

Many thanks!

Answer 1

I solved this issue sending a request utilizing the POST method and "delete" like a parameter. Then it is looking like this:

$.ajax({
    url: "https://api.instagram.com/v1/media/"+ photoId +"/likes?access_token=" + ACCESS_TOKEN,
    method: 'POST',
    data: {_method: 'delete'},

    success: function(data){         
       console.log(data);
  }
});

Font: http://laravel.io/forum/02-20-2014-sending-a-delete-request-via-ajax