Наличие запросов как побочных эффектов другого запроса в rxjs

У меня есть следующий сценарий: Я запускаю HTTP-запрос (используя Observables). Теперь, во время этого HTTP-запроса, я хочу запустить еще два запроса в качестве побочного эффекта. Последние два запроса зависят от первого запроса (они должны запускаться только после успешного выполнения первого запроса). Кроме того, меня не волнует, когда вернутся эти два запроса, они должны просто работать в фоновом режиме.

Я придумал следующий код:

performRequests(): Observable<any> {
  const firstRequestUrl = 'https://api.example.com/firstRequest';
  const secondRequestUrl = 'https://api.example.com/secondRequest';
  const thirdRequestUrl = 'https://api.example.com/thirdRequest';

  return this.http.get(firstRequestUrl).pipe(
    tap(() => {
      // The following requests will run in the background without
      // affecting the output of the main request.
      this.http.get(secondRequestUrl).subscribe();
      this.http.get(thirdRequestUrl).subscribe();
    }),
  );
}

Это работает. Однако, насколько я знаю, это анти-шаблон для запуска запросов в качестве побочного эффекта в операторе pipe(). Нам лучше их как-то связать. Но concat() или merge() не помогут, потому что они ждут, пока все запросы вернутся.

Итак, мой вопрос:

  1. Правомерен ли мой подход?
  2. Есть ли лучший способ выполнить то, что я хочу сделать?

Если вас не волнуют результаты этих запросов, почему бы просто не поместить 2 строки кода перед оператором return?

Cuzy 12.04.2023 11:53

Хорошая точка зрения. Но я неправильно написал в теме. На самом деле два других запроса следует вызывать только в случае успешного выполнения первого, поэтому они не являются полностью независимыми. Я изменил это в теме выше.

dave0688 12.04.2023 13:14
Тестирование функциональных 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
2
2
54
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вам понадобится switchMap:

of(1).pipe(
  switchMap(response1 =>
    forkJoin([of(2), of(3)])
      .pipe(map((result) => ({ first: response1, second: result[0], third: result[1] })))))
  .subscribe((e) => console.info(e));

просто замените of(1), of(2), of(3) вашими наблюдаемыми. Кроме того, подписка на наблюдаемое является антипаттерном.

Да, именно так я это реализовал сейчас. Хорошее решение, спасибо!

dave0688 12.04.2023 13:53

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