Отменить http-запрос с помощью Angular 4

Как я могу отменить запрос после subscribe() в приложении Angular ???

Как обычно, я использую unsubscribe() или takeUntil() для отмены моих запросов нравится.

Но я понятия не имею, почему в этом случае не работает:

userSubscription$: Subscription;

loadUser(userId: number) {
  // Cancel request
  if (this.userSubscription$) { this.userSubscription$.unsubscribe(); }

  // Load user
  this.userSubscription$ = this.userService.getUser(userId).subscribe((user: User) => {
     // ...
  });
}

И getUser в службе с Http:

getUser() {
  const url = '...';
  return this.http.get(url)
}

Я пробовал с обычными решениями, но он только отменяет Observable (означает, что он ничего не делал после загрузки, но запросы все еще загружаются => Сделать мой сайт медленным).

Есть идеи, почему это происходит?

For more information, I'm using:

  • Angular 4.0.0
  • Using HttpModule for sending request (not HttpClientModule)

Спасибо за помощь!

Какой код в getUser?

David Walschots 12.10.2018 14:05

@DavidWalschots, я обновил свой вопрос выше. Это простой способ отправить запрос как обычно.

Kenyo Kai 15.10.2018 09:44

Я сам сделал небольшое приложение, которое правильно отменяет HTTP-запросы. Конечно, если запрос завершится до того, как вы его отмените, он не будет отменен. Может быть, loadUser вызывается очень быстро или запрос завершается очень быстро, потому что он находится на локальном хосте? Что произойдет, если вы установите в браузере более низкую скорость сети с помощью инструментов разработчика?

David Walschots 15.10.2018 13:27

Я понял твою идею. Но я отменил его до того, как запрос будет завершен (потому что запрос очень медленный).

Kenyo Kai 16.10.2018 09:10
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Angular и React для вашего проекта веб-разработки?
Angular и React для вашего проекта веб-разработки?
Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.
Угловой продивер
Угловой продивер
Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.
Мое недавнее углубление в Angular
Мое недавнее углубление в Angular
Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...
Освоение Observables и Subjects в Rxjs:
Освоение Observables и Subjects в Rxjs:
Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular
0
4
121
1

Ответы 1

После того, как HTTP-запрос вернул вам ответ, и вы хотите отказаться от подписки, лучше всего использовать оператор take, попробуйте следующее:

this.userService.getUser(userId).take(1) subscribe((user: User) => {
     // ...
  });

Импортируйте оператор take из rxjs в зависимости от вашей угловой версии.

Я хочу удалить старый запрос, прежде чем отправлять новый. Не ждать возврата HTTP-запроса.

Kenyo Kai 12.10.2018 04:05

Другие вопросы по теме