Блог

Главная - Вопросы по программированию - Как остановить подписку в случае ошибки http

Как остановить подписку в случае ошибки http

#angular #typescript

#angular #typescript

Вопрос:

Я ищу идею, как прекратить подписку в любом методе, когда перехватчик выдает HTTPError . В моем приложении Angular есть несколько компонентов, которые загружают данные из серверной части, используя что-то вроде этого:

     getItems(){
this.isProcessing = true;
this.itemsService.getItems().subscribe((x) => {
this.itemList = x;
this.isProcessing = false;
});
}

Когда начинается запрос данных, для isProcessing устанавливается значение true, и счетчик начинает вращаться. После получения данных он останавливается. Каждый отдельный http-запрос проходит через HttpInterceptor, который добавляет токен к запросу и имеет обработчик ошибок в случае любой ошибки http.
Когда у пользователя нет разрешения на загрузку некоторых данных, ошибка 403 поступает из серверной части. То, что я пытаюсь сделать, это показать modal с некоторой информацией, прекратить подписку в методе в любом компоненте, который отправил этот запрос, и установить для isSpinning значение false, как будто ничего не произошло.
Должен ли я создать некоторый наблюдаемый в перехватчике и использовать его в каждом методе, чтобы указать, следует ли останавливать subscribe или нет?

Комментарии:

1. если вы просто хотите остановить метод подписки, просто добавьте метод ngdestory в компонент, а затем отпишите его

Ответ №1:

вам нужно использовать обратный вызов ошибки, но это работает только в том случае, если вы не фиксируете ошибку в своем перехватчике

 getItems(){
  this.isProcessing = true;
  this.itemsService.getItems().subscribe(
    (x) => {
      this.itemList = x;
      this.isProcessing = false;
    },
    (error) => { this.isProcessing = false; }
   }
  );
}

таким образом, вы либо фиксируете ошибку в своем перехватчике (для целей ведения журнала или любой другой логики) и отбрасываете ее обратно, либо не фиксируете ее вообще.

Комментарии:

1. Но если я удалю обработчик 403 из перехватчика и вставлю его в каждый метод, не будет ли он дублироваться слишком много раз? Основная цель поместить обработчик в перехватчик состояла в том, чтобы записать его только один раз, а затем использовать во всем приложении.

2. вы должны решить, использовать ли централизованный подход для обработки ваших внутренних ошибок с помощью interceptor (также будет здорово обрабатывать счетчик глобально). Или вы обрабатываете это в каждом компоненте. Я рекомендую первый подход.

3. Или вы можете в случае 403, 401 показать какое-либо сообщение об ошибке или перенаправить на какой-либо маршрут (/login или /unauthorized … И т.д.) глобально в вашем перехватчике. и в другом случае throw возвращает ошибку обратно компоненту для ее обработки.

4. «работает только в том случае, если вы не фиксируете ошибку в своем перехватчике» — это не совсем верно. Вы можете перехватить ошибку и использовать throwError RxJS для возврата наблюдаемой ошибки. Вот рабочий пример: stackblitz.com/edit/rxjs-ytkucd?file=index.ts

5. Это то, что я объяснил в конце своего ответа

Ответ №2:

Вы можете использовать error обратный subscribe() вызов метода следующим образом:

 getItems(){
  this.isProcessing = true;
  this.itemsService.getItems().subscribe(
    (x) => {
      this.itemList = x;
      this.isProcessing = false;
    },
    (error) => {
      // Create your modal here
      this.isProcessing = false;
    }
  );
}

Для справки: https://rxjs-dev.firebaseapp.com/guide/observable

Ответ №3:

Попробуйте это

 getItems(){
    this.isProcessing = true;
    this.itemsService.getItems().subscribe((x) => {
    if(x !=null || x != undefined) {
      this.itemList = x;
       this.isProcessing = false;
    } 
  else {
    this.isProcessing = false;
  }
  });
Метки: