How to convert a Fetch API response to RxJS Observable

Question

Can you tell me with the help of cod and an example How to convert a Fetch API response to RxJS Observable?

Answer 1

To convert a Fetch API response into an RxJS Observable, use from or defer from rxjs.

Using from

import { from, Observable } from 'rxjs';

function fetchData(): Observable<Response> {

  return from(fetch('https://api.example.com/data'));

}

fetchData().subscribe(response => {

  console.log(response);

});

Using defer (Recommended for fresh execution on subscription)

import { defer, from, Observable } from 'rxjs';

function fetchData(): Observable<any> {

  return defer(() => from(fetch('https://api.example.com/data').then(res => res.json())));

}

fetchData().subscribe(data => {

  console.log(data);

});