Why my error in subscirbe(()=>{},err=>{here}) is different from the error in browser console

Question

This is loadSize() function and it calls a getTotalNumberCampaigns() function in my campaignsService class.

 loadSize() {
    this.campaignsService.getTotalNumberCampaigns().subscribe(value => {//async call
        this.campaignSize = value;
    }, (err: any) => { console.log(err.status); console.log(err);}

    );
}

this is my getTotalNumberCampaigns()

 getTotalNumberCampaigns(): Observable<number> {
    return this.http.get(`${this.apiUrl}/Count`, { headers: this.headers })
        .map<any>(res => res.json())
}

I start up the backend api everything works fine, now I stop the api and refresh my page. It will fire the console.log(err.status); console.log(err); since it's connection failed. but I actually got 200 status while in my browser console it says it is a 502 error.

anyone tell me why?

Answer 1

In fact, in the case of a connection failure, the response object you receive in your error callback is an error one since the value of its type attribute is 3 (ERROR). What is a bit strange is that it seems that the preflighted request is executed and received a response. Could you give us its details from the Network tab in dev tools (by clicking on "OPTIONS http://localhost:...")?

See this question for more details:

• Get error message from Angular 2 http