Angularjs $http send OPTIONS instead PUT

Question

I know that the browser first send an OPTIONS to the server. But I'm facing this thing in Angularjs 1.5. I'm trying to send a PUT request and it is sending an OPTIONS. Why is this weird?, because I'm using an application to test all my urls and the url works fines using PUT.

let fd = new FormData()
let d
for (d in $scope.uploadAutos) {
  fd.append(d, $scope.uploadAutos[d])
}

$http({
     method: 'PUT',
    url: `http://sitio.api.com/vehiculo/${parseInt($routeParams.id, 10)}`,
    data: fd,
    headers: { 'Content-Type': 'undefined' }
   }).then(success => {
     console.log(success)
   }, error => {
     console.log(error)
  }
)

this is, so far, the way I've been working doing GET and POST request, which works fine...but with PUT...mmm something is not working. The backend is right for what a said above, that using a rest api application to test all my url, the PUT url works fine. Any help would be great :). thanks

Answer 1

Ideally you would see two requests - the OPTIONS request i.e. the pre-flight request. This is to verify your Cross Origin request headers.

Once this is verified, your client will be able to make the actual POST/PUT request. If your pre-flight request is failing that means that your CORS request headers aren't set properly on your server.

The following headers need to be set:

Access-Control-Allow-Origin
Access-Control-Allow-Methods ("GET, POST, PUT, DELETE, OPTIONS")
Access-Control-Allow-Headers
Access-Control-Max-Age