Обработчик ошибок Angular 6 - HttpErrorResponse имеет неопределенный статус

Question

У меня есть клиент Angular 6, использующий REST Api, разработанный с .Net Web Api.

Все работает, кроме обработки ошибок.Когда я пытаюсь обработать ошибку, чтобы по-разному реагировать на разные коды состояния (404, 403, 409, 500 ...), я просто не могу заставить ее работать.Объект HttpErrorResponse не имеет ни одного из полей, которые он должен (например, «status» или «error»).

Я сделал очень простой сервис, который воспроизводит проблему:

Запрос на service.ts

 public test(): Observable<any> {
    let url = this.templatesUrl + '/myMethod';
    console.log('GET myMethod ' + url);

    return this.http.get<any>(url)
                      .pipe(catchError(this.handleError));
  }

Обработчик ошибок (в значительной степени прямо из официальной документации):

 private handleError(error: HttpErrorResponse) {
    console.warn(error);

    if (error.error instanceof ErrorEvent) {
      // A client-side or network error occurred. Handle it accordingly.
      console.error('An error occurred:', error.error.message);
    } else {
      // The backend returned an unsuccessful response code.
      // The response body may contain clues as to what went wrong,
      console.error(
        `Backend returned code ${error.status}, ` +
        `body was: ${error.message}`);
    }
    // return an observable with a user-facing error message
    return throwError('Unexpected error');
  }

Сервис на стороне .Net:

[HttpGet]
[Route("myMethod")]
public IHttpActionResult myDotNetMethod()
{
    return InternalServerError(new Exception("Details about the issue"));
}

Служба вызывается и возвращает код состояния 500 вместе с объектом json:

Статус ответа:

Заголовок ответа, это json:

Объект json:

И что показывает журнал: нет статуса и почти пустой объект:

Loosk, как HttpErrorResponse, в значительной степенипустой.Но ответ от API был в порядке, код состояния там и объект json тоже.

Что мне не хватает?

Обновление: На случай, если вам интересночто скрывается за «внутренней ошибкой сервера», которая отображается в журнале (это просто стек вызовов, сгенерированный Chrome):

Обновление2: Вот объект ошибки под микроскопом.Это просто «Внутренняя ошибка сервера».Нет следов статуса или сообщения.

Answer 1

Я думаю, что ваша проблема в том, как вы выдаете ошибку в .Net.Попробуйте это:

var statusCode = HttpStatusCode.InternalServerError;

var response = new HttpResponseMessage(statusCode)
{
    Content = new ObjectContent<object>(
        new
        {
            Message = "Error Message",
            ExceptionMessage = "StackTrace"
        },
        new JsonMediaTypeFormatter())
};

throw new HttpResponseException(response);

Или, если это не работает, попробуйте это: https://stackoverflow.com/a/28589333/8758483

Еще одна хорошая идея - централизовать обработку ошибок путем реализации ErrorHandler в Angular.

import { ErrorHandler } from '@angular/core';

@Injectable()
export class GlobalErrorHandler implements ErrorHandler {  
  handleError(error) {
    // your custom error handling logic    
  }
}

Затем вы говорите Angular, что хотите использовать этот класс вместо класса по умолчанию, предоставляя его в своем NgModule:

@NgModule({   
  providers: [{provide: ErrorHandler, useClass: GlobalErrorHandler}]
})

Если вы хотите больше подробностей, вы можете прочитать эту статью:

• Ожидание неожиданного - Лучшие практики по обработке ошибок в Angular

Answer 2

Решено ... объект был пуст из-за перехватчика.Так что, если что-то подобное происходит с вами, проверьте это.

Извините, что потратил время всех впустую, я не знал о существовании этого конкретного перехватчика.

Answer 3

В ответе свойство называется «Сообщение», а не «сообщение».