Http Rest Call Error Handling

Ionic Framework ionic-v3
1

Hi Guys,
I need to manage my http rest errors. My service return HTTP Error 500 and I can’t handle the error.

My Code:

 myCall() {
         var response = this.http.post(url, data)
			.map(res => res.json())
			.catch(this.handleError);
        return response;
    }

    handleError(error) {
		...
    }

handleError never called. Why?

Regards

1 Like
2

Actually I have the same issue with you before. Please ensure that you already import the following rxjs:

import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';

Also we can do something complex error handling like below, I get it from this discussion.

return this.http.request(new Request(this.requestoptions))
            .map((res: Response) => {
                if (res) {
                    if (res.status === 201) {
                        return [{ status: res.status, json: res }]
                    }
                    else if (res.status === 200) {
                        return [{ status: res.status, json: res }]
                    }
                }
            }).catch((error: any) => {
                if (error.status === 500) {
                    return Observable.throw(new Error(error.status));
                }
                else if (error.status === 400) {
                    return Observable.throw(new Error(error.status));
                }
                else if (error.status === 409) {
                    return Observable.throw(new Error(error.status));
                }
                else if (error.status === 406) {
                    return Observable.throw(new Error(error.status));
                }
            });
    }

And another guide will help you is from angulardocs.
Hope it help.

2 Likes
3

thanks, but I need to parse my response when server return 500. My response payload includes several information that I need to show into alert. How can I parse my error response body?

Regards,
Luca

4

Typically error responses are structurally identical to success responses, so you can call the same json() method on them. If you want to be certain, check that the response instanceof Response.

5 
Service.ts
registerTeam(teamName, password) {
        var url = "...";
        return this.http.get(url)
            .map(res => res.json())
            .catch(error => error.json());
    }

Component.ts
this.service.registerTeam(teamName, password)
                .subscribe((response: any) => {
                    console.log(response);
                    ...
                },
                err => {
                    console.log(err);
                    ...
                })

Error:
TypeError: unknown type returned
at Object.subscribeToResult (subscribeToResult.js:69)
at CatchSubscriber.error (catch.js:60)
at MapSubscriber.Subscriber._error (Subscriber.js:128)
at MapSubscriber.Subscriber.error (Subscriber.js:102)
at XMLHttpRequest.onLoad (xhr_backend.js:77)
at t.invokeTask (polyfills.js:3)
at Object.onInvokeTask (ng_zone.js:227)
at t.invokeTask (polyfills.js:3)
at e.runTask (polyfills.js:3)
at XMLHttpRequest.invoke (polyfills.js:3)

2 Likes
6

You don’t seem to be returning an Observable out of catch. Does this work?

.catch(err => Observable.of(err.json()))
1 Like
7

Perfect. Thankssssss