fromFetch

Clase 31 de 36 • Curso de Programación Reactiva con RxJS

Clase anteriorSiguiente clase

Brandon Maciel

student•

Cómo puedo usar Múltiples suscripciones ?

Marcelo Arias

teacher•

¡Hola Brandom! Para usar múltiples suscripciones puedes usar el método subscribe() después del observable. Por ejemplo, usando el observable fromFetch de esta clase, quedaría así:

// Declaramos el observable
const obs$ = fromFetch(url);

// Realizamos las suscripciones
const subscription1 = obs$.subscribe((data) => console.log(data));
const subscription2 = obs$.subscribe((data) => console.log(data));
const subscription3 = obs$.subscribe((data) => console.log(data));

Luego si nos queremos desuscribir de algún observable, usamos el método unsubscribe() sobre la suscripción ya creada.

subscription1.unsubscribe();

Andrés Villarraga

student•

Muy buena forma de manejar el Abort en el request, si lo usa Netflix es por algo, hice la prueba y en el Network Tab no se recibe respuesta, igual que con AbortController pero más facil de usar.

SANTIAGO SIERRA HERRERA

student•

Por qué se usó MergeMap en vez de un map simple?

Marcelo Arias

teacher•

¡Hola Santiago! En este caso usamos mergeMap porque debemos combinar dos operadores en un único flujo.

SANTIAGO SIERRA HERRERA

student•

Hola Marcelo, pero es que no entiendo que se está combinando. Por ejemplo en el punto del siguiente código se utiliza pero no veo que dos flujos se combinan

 const url = "https://httpbin.org/delay/4";
 const ditto$ = fromFetch(url).pipe(
	mergeMap((response) => {
      return response.json();
  })
);

ditto$.subscribe(console.log);

David Trespalacios

student•

Perfecto, esto responde mi pregunta en el video anterior. Ahora podemos implementar palabras aleatorias a PlatziWordle desde una API

const urlWord =
  "https://clientes.api.greenborn.com.ar/public-random-word?c=1&l=5";

const getFetch$ = fromFetch(urlWord).pipe(
  mergeMap((response) => {
    return response.json();
  }),
  catchError((err) => of(err))
);

getFetch$.subscribe(console.log);

Marcelo Arias

teacher•

fromFetch es un operador para realizar peticiones HTTP que internamente utiliza Fetch API.