typescript - para - Cómo lidiar con códigos de estado de HTTP que no sean 200 en Angular 2

http error 302 solucion

Question

En este momento, la forma en que hago las solicitudes http (tomadas de esta respuesta ) es esta:

POST(url, data) {
var headers = new Headers(), authtoken = localStorage.getItem(''authtoken'');
headers.append("Content-Type", ''application/json'');
if (authtoken) {
headers.append("Authorization", ''Token '' + authtoken)
}
headers.append("Accept", ''application/json'');
var requestoptions = new RequestOptions({
method: RequestMethod.Post,
url: this.apiURL + url,
headers: headers,
body: JSON.stringify(data)
})
return this.http.request(new Request(requestoptions))
.map((res: Response) => {
if (res) {
return { status: res.status, json: res.json() }
}
});
}

Esto funciona bien, excepto por el hecho de que angular2 fallará si el código de estado devuelto es algo más que 200. Por ejemplo, si un usuario desea publicar algo y el servidor devuelve 400, angular 2 emitirá la excepción:

excepción no detectada: [object Object]

¿Cómo puedo evitar esto? Me gustaría manejar estos códigos de estado en mi aplicación para mejorar la experiencia del usuario (mostrar errores, etc.)

Answer 1

Sí, puedes manejarlo con el operador catch de esta manera y mostrar la alerta como quieras, pero primero tienes que importar Rxjs para lo mismo de esta manera

import {Observable} from ''rxjs/Rx'';
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));
}
});
}

también se puede generar un error (con el bloque err) que es throw by catch block mientras la función .map ,

Me gusta esto -

...
.subscribe(res=>{....}
err => {//handel here});

Actualizar

como se requiere para cualquier estado sin verificarlo en particular, puedes probar esto: -

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 < 400 || error.status ===500) {
return Observable.throw(new Error(error.status));
}
})
.subscribe(res => {...},
err => {console.log(err)} );