Angular 8 Ответ отсутствует _body и заголовки - PullRequest
Новая
       7

Angular 8 Ответ отсутствует _body и заголовки

0 голосов
/ 26 марта 2020

Внутренний код C# in. NET для платформы 4.6.1. Внешний интерфейс был недавно обновлен с Angular 4 до Angular 8. Наряду с этим веб-пакет перешел с версии 2.3 на версию 4.41 и машинописный текст с 2.2 на 3.2.4.

Сам код не изменился .

C#: 

public override Task OnAuthorizationAsync(HttpActionContext actionContext, CancellationToken cancellationToken)
{
    var reject = false;
    var principal = actionContext.RequestContext.Principal as ClaimsPrincipal;

    if (principal == null || !principal.Identity.IsAuthenticated || reject) {
        actionContext.Response = actionContext.Request.CreateResponse(HttpStatusCode.Unauthorized,
            new { error = "Unauthorized request for Impersonate Mode" },
            actionContext.ControllerContext.Configuration.Formatters.JsonFormatter);
        return Task.FromResult<object>(null);
    }

    return Task.FromResult<object>(null);
}

Машинопись: 

actionErrorResponseHandler(response: Response) {
    if(response.status === 401){
        if(response.text().includes("Impersonate")){
            this.displayText = ImpersonateRejectText;
        }
        this.show();
    }
}

(РЕДАКТИРОВАТЬ) Вызывается так: 

setupPopUpModal(modalHeader: string, displayText: string){
    this.accountService.accountShowPopUpModal()
    .pipe(catchError((response: Response) => this.rejectModal.actionErrorResponseHandler(response)))
    .subscribe((result: string) => {
        if(result == "Done"){
            this.modalHeader = modalHeader;
            this.displayText = displayText;
            this.messageBoxModal.show();
        }            
    })
}

Ранее это работало хорошо. Теперь он генерирует ошибку, которая говорит, что «e.text не является функцией»

Если я посмотрю в инструментах разработчика Chrome, я вижу это до обновления:

Before

И это потом:

After

Функция .text () пытается вернуть тело как строка, но тело больше не существует. Сообщение, которое я пытаюсь найти, теперь находится в e.error, но в Angular / Typescript «response.error» не является допустимым кодом.

Я предполагаю, что мне нужно создать и / или проанализировать ответ иначе, но я не смог найти никакой документации по этому вопросу. Любая помощь будет высоко ценится.

1 Ответ

1 голос
/ 26 марта 2020

Я бы предположил, что старая версия Angular была до 4.3?

С 4.3 обычный HTTP-запрос изменился с "Http" на "HttpClient". Основное изменение заключается в том, что в результате вы получаете не ответ, а только тело ответа (json). И если запрос не был успешным (а 401 - не тот :-)), то он выдает ошибку.

Поэтому вы должны отловить ошибку и обработать ее. Это можно сделать несколькими способами. Я предполагаю, что вы используете Rx Js для обработки ответа. Тогда ваш код может выглядеть так: 

let response: SomeTyp;
this.httpClient.get<SomeTyp>('myBackendUrl').subscribe( (result) => response = result);

В результате, если ваш внутренний вызов возвращает 400, «обычная» подписка не будет выполнена. Поэтому response остается пустым.

Одним из решений может быть обработка ошибки в подписке 

let response: SomeTyp;
this.httpClient.get<SomeTyp>('myBackendUrl').subscribe( 
  (result) => response = result,
  (errorCase) => this.handleTheError(errorCase)
);

private handleTheError(errorCase:ttpErrorResponse):void {
  if(response.status === 401){
    if(response.text().includes("Impersonate")){
      this.displayText = ImpersonateRejectText;
      return
    }
  }
  throw Error('Unexpected Backend Response');
}

Вторым решением будет обработка ошибки в потоке 

let response: SomeTyp;
this.httpClient.get<SomeTyp>('myBackendUrl').pipe(
  catchError( (errorCase:ttpErrorResponse) => // Handle the error )
).subscribe( 
  (result) => response = result
);

Преимущество «catchError» состоит в том, что вы можете перехватить ошибку, и если это «ожидаемая» ошибка, которую вы можете обработать изящно, просто верните допустимое значение. Тогда это значение будет обрабатываться подпиской точно так же, как если бы вы получили действительный ответ бэкэнда.
Если ошибку невозможно обработать изящно, вы все равно можете выбросить ее снова 

return throwError(errorCase);

И затем обработайте это в подписке.

...