consdata.com
Blog techniczny Blog biznesowy Dział HR
EN
rxjs

Czy wiesz, jak obsługiwać błędy w rxjs?

author Piotr Tatarski
26 lipca 2024

Biblioteka rxjs dostarcza kilka mechanizmów, które ułatwiają reagowanie na nieprzewidziane sytuacje występujące podczas procesowania strumienia danych w aplikacji.

Operator catchError

Jednym z najpopularniejszych jest operator catchError. Operator ten pozwala nam zareagować na sytuację, kiedy w strumieniu z jakiegoś powodu nagle wystąpi błąd. Zamiast brzydkiego błędu w konsoli możemy w catchError dostarczyć Observable, który będzie przetwarzany dalej w strumieniu.

Ważne, aby catchError znajdował się po operacji, w której wystąpi błąd. Inaczej nie nie zostanie przechwycony.

Przykładowy kod:

of(1, 2, 3, 4, 5)
  .pipe(
    catchError(() => of(99)), // Ten catchError nie obsłuży błędu występującego niżej
    map((num) => {
      if (num === 4) {
        throw new Error('test');
      }
      return num;
    }),
    catchError((error) => of(`Złapano błąd ${error}`))
  )
  .subscribe({
    next: console.log,
    error: (err) => console.log('error', err.message),
    complete: () => console.log('completed'),
  });
// 1
// 2
// 3
// Złapano błąd Error: test
// completed

Jak widać, błąd został złapany i nigdy nie wpadł w obsługę error observera.

Operator retry

Kolejnym operatorem pozwalającym na obsługę błędów jest operator retry. Jak sama nazwa wskazuje, operator ten pozwala na ponowienie operacji. Jest to przydatne, jeżeli zakładamy, że operacja w strumieniu może się zakończyć niepowodzeniem z przyczyn niezależnych od użytkownika, np. niedostępności usługi. retry ponowi wtedy obsługę, zaczynając od początku strumienia.

Retry nie tylko pozwala nam zdefiniować liczbę (count) ponownych wywołań, lecz także odstęp między nimi (delay). Parametr delay może przyjmować wartość w milisekundach między wywołaniami lub funkcję zwracającą strumień.

  • Jeżeli strumień w delay wyemituje wartość lub zakończy się bez emitowania wartości - retry ponowi operacje.
  • Jeżeli strumień w delay zakończy się błędem - retry przerwie ponawianie operacji.
of(1, 2, 3, 4, 5)
  .pipe(
    map((num) => {
      if (num === 4) {
        throw new Error('testowy error');
      }
      return num;
    }),
    retry({
      count: 3,
      delay: (error, retryCount) => {
        console.log(`delay ${1000 * retryCount}`);
        return timer(1000 * retryCount);
      },
    })
  )
  .subscribe({ error: (err) => console.log('error', err.message) });
    
// delay 1000
// delay 2000
// delay 3000
// error testowy error

W powyższym przykładzie nastąpiła trzykrotna próba ponowienia operacji, ale z każdą kolejną próbą odstęp między nimi jest zwiększany o sekundę.

Przydatne linki

  • Dokumentacja operatora retry: https://rxjs.dev/api/index/function/retry
  • Dokumentacja operatora catchError: https://rxjs.dev/api/index/function/catchError
  • Wykonywalne kody z przykładów: https://stackblitz.com/edit/rxjs-vmvukg?devtoolsheight=60&file=index.ts, https://stackblitz.com/edit/rxjs-mgmtg5?devtoolsheight=60&file=index.ts
Najnowsze wpisy

  • Czy wiesz, że w Jest można automatycznie testować dostępność (a11y)?
  • Dostępność w PDF - dokumenty bez barier
  • Czy wiesz, że z pomocą @starting-style można animować elementy z display: none za pomocą samego CSS?
Dołącz do nas

  • SENIOR FULLSTACK DEVELOPER (JAVA + ANGULAR) Poznań (hybrydowo) lub zdalnie UoP 14 900 - 20 590 PLN brutto
    B2B 19 680 - 27 220 PLN netto
  • REGULAR FULLSTACK DEVELOPER (JAVA + ANGULAR) Poznań (hybrydowo) lub zdalnie UoP 11 300 - 15 900 PLN brutto
    B2B 14 950 - 21 000 PLN netto
  • ZOBACZ WSZYSTKIE OGŁOSZENIA

newsletter

techniczny

Zapisz się

Podobne wpisy

post-image
wcag

Czy wiesz, że w Jest można automatycznie testować dostępność (a11y)?

author
Wojciech Stolarski 19 maj 2025
post-image
WCAG

Dostępność w PDF - dokumenty bez barier

author
Kacper Hoffman 28 kwi 2025
post-image
angular

Czy wiesz, że z pomocą @starting-style można animować elementy z display: none za pomocą samego CSS?

author
Piotr Tatarski 7 kwi 2025
Dołącz do nas

  • SENIOR FULLSTACK DEVELOPER (JAVA + ANGULAR) Poznań (hybrydowo) lub zdalnie UoP 14 900 - 20 590 PLN brutto
    B2B 19 680 - 27 220 PLN netto
  • REGULAR FULLSTACK DEVELOPER (JAVA + ANGULAR) Poznań (hybrydowo) lub zdalnie UoP 11 300 - 15 900 PLN brutto
    B2B 14 950 - 21 000 PLN netto
  • ZOBACZ WSZYSTKIE OGŁOSZENIA

Zapisz się na

newsletter

techniczny

consdata.com
  • Kontakt

    • sales@consdata.com
    • +48 61 41 51 000

  • Biuro

    • K9Office
      Krysiewicza 9/14
      61-825 Poznań
      Polska

  • Rozwiązania

    • Eximee
    • Kouncil
  • Blog Dołącz do nas
Copyright © 2024 Consdata. All rights reserved. Privacy Policy & Cookies
Chcemy używać plików cookie oraz skryptów podmiotów trzecich do polepszania funkcjonowania tej strony Zgadzam się