angularjs - Whenever a CORS $http request fails, the response returned is always 0

Question

this is a similar question to this post in SO.But the answer provided here cannot be applied in my case as i cannot change the response headers from server.

Suppose an http POST to a different origin. This implies CORS, including a CORS preflight exchange. Now suppose the OPTIONS request returns a 503 service unavailable error due to a server problem. In this case the error handler gives ""for data and 0 for status instead of giving me the status code 503 and the text:service not available. An example of this scenario is illustrated in the below image.

I am using angularjs $http and i know in the response there are no CORS header if such errors happen.and i cannot change it.

Is there any way i can receive the proper error code and the text in my rejection object.

Answer 1

This is not an issue of AngularJS / $http but it is the behavior of the browsers and their XMLHttpRequest object: If the CORS request fails, the browser does not give any information back to the caller.

Before I got this understanding, I also though it to be an AngularJS issue and I raised an open issue on github of Angular -> with the corresponding comment.

https://github.com/angular/angular.js/issues/13085#issuecomment-148047721

So I think there seems no other way to solve this as to add the Access-Control-Allow-Origin response header also on the proxy / load balancer in case of 503.

Edit: If your load balancer is a HAproxy, the following may help you too:
HAproxy: different 503 errorfile for OPTIONS and POST methods
It shows how to let HAproxy anwer the CORS requests autonomous.