Getting status code 0 angular HttpClient?

Question

I have a strange problem using the angular 4's HttpClient get method.

There are some custom error messages returned from the backend which I should handle and display to the user. However I get HttpErrorResponse in the console

HttpErrorResponse:
error: ProgressEvent {isTrusted: true, lengthComputable: false, loaded: 0, 
total: 0, type: "error", …}
headers: HttpHeaders {normalizedNames: Map(0), lazyUpdate: null, headers: 
Map(0)}
message: "Http failure response for (unknown url): 0 Unknown Error"
name: "HttpErrorResponse"
ok: false
status: 0
statusText: "Unknown Error"
url: null

I read about the problem here but none of the solutions helped me. In the network tab of the browser I'm able to observe the real response from the server:

"{\"StatusCode\":400,
  \"ExceptionMessage\":\"Internal Server Error\",
  \"Error\":\"Internal Server Error\",
  \"Errors\": 
  [{\"Code\":\"ValidationError\",\"Message\":\"Custom message here.\"}]}"

The request seems like this in the network tab:

General: 
Request URL: https://asdfhost:port/5c77a77101ae8643aeeb61e9
Request Method: GET
Status Code: 400 
Remote Address: address
Referrer Policy: no-referrer-when-downgrade

Response Headers:
cache-control: no-cache
content-type: application/json
date: Thu, 28 Feb 2019 09:42:22 GMT
expires: -1
pragma: no-cache
server: Kestrel
status: 400

Request Headers: 
x-correlation-id: 6if123
Provisional headers are shown
Accept: application/json, text/plain, */*
Authorization: Bearer asdfasdftoken
Origin: http://origin
Referer: http://origin/somewhere
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 
(KHTML, like Gecko) Chrome/72.0.3626.119 Safari/537.36

Is there a chance the custom errors to break the xhr request ? Any help will be highly appreciated. :)

Answer 1

Indeed it was a CORS problem. When an error occurred the back-end didn't set the Allow Origin header.

Answer 2

I had CORS enabled in my server and i was still getting the status 0, after digging the internet i find no solution then i tried some things and found out it was CORS issue however it was still returning status 0 because i had configured virtual host and virtual domain in hosts file and Angular Universal was calling actual domain not the loopback localhost domain. that is why it was getting invalid response from server.

according to my research so you will get status 0 in following conditions

1 - if Cross Origin Resource Sharing(CORS) headers are not set to * or requesting domain

2 - Sometimes CORS is enabled in normal request but not in PRE-FLIGHT request(options request) make sure you enable CORS on it as well.

3 - You are using invalid domain or domains which are forwarding the requests to other domain .