HTTP-перехватчик получает статус 0 при неудачном запросе с использованием Angular 2,4,6,7,8,9 TypeScript

У меня есть следующая реализация HTTP-перехватчиков с Angular ^4.3.6.

import {Injectable} from "@angular/core";
import {
  HttpInterceptor,
  HttpHandler,
  HttpRequest,
  HttpEvent,
  HttpResponse,
  HttpErrorResponse
} from "@angular/common/http";
import {Observable} from "rxjs/Observable";
import "rxjs/add/operator/do";

@Injectable()
export class InterceptorService implements HttpInterceptor {

  intercept(
    req: HttpRequest<any>,
    next: HttpHandler
): Observable<HttpEvent<any>> {
    return next.handle(req).do(evt => {
      console.log(evt);//this logs the success message properly
      if (evt instanceof HttpResponse) {
        //Keep going
      }
    },err => {
    console.log(err);
    //this logs the error but don't have useful info in it.
    });

}
}

При успешном вызове http я получаю следующие члены evt, которые действительны в первом console.log.

ok:true
status:200
statusText:"OK"
type:4 

]

Но в случае сбоя у меня нет правильного кода состояния из блока err во втором console.log, но есть следующее сообщение в консоли DEV от ZONE.js

zone.js: 2263 ОПЦИИ http://localhost:7001/coreRobo/neuralProcess 404 (не найдено)

name:"HttpErrorResponse"
ok:false
status:0
statusText:"Unknown Error" 

Я не уверен, что мне здесь не хватает, но я хотел, чтобы этот статус давал мне что-то действительное, например, 404,403 или черт возьми 500, когда явно это то, что происходит.

Мне просто нужны эти значения, чтобы я мог показать правильное сообщение пользовательскому интерфейсу и помочь клиенту не паниковать в случае сбоя.

Любая помощь приветствуется. Заранее спасибо.


person Dinesh Devkota    schedule 27.11.2017    source источник
comment
А что выдает эту ошибку? Вы уверены, что действительно получаете ошибку 404, 403 или 500 от сервера? Если вы даже не можете отправить запрос на сервер (проблема с сетью, проблема с DNS и т. Д.), Вы не сможете получить код состояния HTTP.   -  person JB Nizet    schedule 27.11.2017
comment
@JBNizet кое-что понимает. У меня был тот же опыт, что и у вас, и это произошло из-за невозможности доступа к серверу. Если это что-то еще, то ошибка, скорее всего, возникла на стороне сервера, а не на стороне клиента.   -  person Aluan Haddad    schedule 27.11.2017
comment
Я вижу, что в консоли браузера появляется сообщение об ошибке 404, зарегистрированное из zone.js. Очевидно, это не проблема сервера. Разве мы не можем уловить эти коды состояния? Какой смысл перехватчику, если он не улавливает код состояния после вызова службы?   -  person Dinesh Devkota    schedule 27.11.2017
comment
Есть ошибка в консоли? Вы уверены, что ответ правильный? Например, содержит ли он недопустимый JSON, хотя тип содержимого установлен на JSON? Можете ли вы воспроизвести это в плункре?   -  person JB Nizet    schedule 27.11.2017
comment
Я выключил свой сервер и прошел консоль 404 в zone.js. Я хотел бы, чтобы перехватчик перехватил этот код состояния. Судя по всему, он просто возвращает 0. Не думаю, что смогу воспроизвести это в plunkr. :(   -  person Dinesh Devkota    schedule 27.11.2017
comment
Как видите, запрос, вызывающий ошибку 404, является запросом OPTIONS. Это не ваша настоящая просьба. Браузер отправляет предполетный запрос в соответствии со спецификациями CORS. Поскольку он не получает действительного ответа, ему не разрешается даже отправлять фактический запрос, и, следовательно, на ваш запрос нет ответа, отсюда и странный код состояния.   -  person JB Nizet    schedule 27.11.2017
comment
У меня такая же проблема, я получаю 404 с сервера (без CORS), а код состояния в моем перехватчике равен 0 (когда я хочу 404)   -  person Tonio    schedule 19.12.2017
comment
Вы решили эту проблему? Я тоже сталкиваюсь с тем же.   -  person Sonu Gupta    schedule 20.07.2020


Ответы (2)


Если вы используете CORS, вам следует установить флажок «Access-Control-Allow-Origin» в конфигурации вашего сервера.

Я решил это на своем сервере nginx, добавив:

add_header "Access-Control-Allow-Origin" * always;

Я пропустил параметр "всегда", из-за которого у меня возникла та же проблема, что и у вас.

Обратите внимание на значение заголовка «*» в моем примере.

Значение должно содержать список разрешенных источников.

person Amine Rebati    schedule 28.11.2017
comment
Я бы не согласился, что это лучший вариант конфигурации. Это делает ваш сайт уязвимым. Вы всегда должны вносить в белый список набор доменов вместо того, чтобы разрешать их всем - person eddyP23; 22.02.2019
comment
Что еще может быть? - person Sonu Gupta; 20.07.2020

Я выяснил, что было причиной проблемы. Это проблема на стороне сервера. Вам необходимо сначала установить промежуточное ПО CORS, а затем оставшееся промежуточное ПО API.

Обратите внимание, я работаю с Laravel 5.6 + Angular 5

Неверный код

'api' => [
            'throttle:60,1',
            'bindings',
            \Barryvdh\Cors\HandleCors::class,
        ],

Правильный код

'api' => [
            \Barryvdh\Cors\HandleCors::class,
            'throttle:60,1',
            'bindings'
        ],
person Rameez Rami    schedule 07.05.2018