Как обращаться с кодами статуса http, отличными от 200 в Angular 2
Прямо сейчас, как я делаю http-запросы (заимствованные из этого ответа ), это:
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() } } }); } Это прекрасно работает, за исключением того, что angular2 не будет работать, если возвращаемый код состояния – это что-то другое, чем 200. Например, если пользователь хочет что-то публиковать, а сервер возвращает 400, угловое 2 выдает исключение:
неперехваченное исключение: [object Object]
Как я могу избежать этого? Я бы хотел обработать эти коды состояния в своем приложении, чтобы улучшить пользовательский интерфейс (показать ошибки и т. Д.),
- Лучший способ импортировать Observable из rxjs
- Невозможно связать с 'formGroup', поскольку это не известное свойство 'form'
- Angular2 - Обмен данными между компонентами с использованием сервисов
- Что эквивалентно ngShow и ngHide в Angular?
- angular2 bootstrap с данными из ajax call (s)
- Цепочка RxJS Наблюдаемые данные http в Angular2 с использованием TypeScript
- Angular 2 2.0.0-rc.1 Свойство 'map' не существует в типе 'Observable ' не совпадает с сообщением о выпуске
- Угловой 2 пользовательских ввода формы
Да, вы можете обращаться с оператором catch таким образом и показывать предупреждение, как хотите, но во-первых, вам нужно импортировать Rxjs же, как этот путь
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)); } }); }
также вы можете передать ошибку (с блоком err), которая выбрасывается блоком catch в то время как функция .map ,
как это –
... .subscribe(res=>{....} err => {//handel here});
Обновить
как требуется для любого состояния без проверки участника, вы можете попробовать следующее:
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)} );