redux-observableでajaxの代わりにfetchを使用

Question

redux-observableにRx.DOM.ajaxの代わりにisomporphic-fetchを使用できますか？

Answer 1

（注：RX.DOM.ajaxはRxJS V4からであり、RxJS v5を必要redux-observableで動作しないV5で同等にRx.Observable.ajax又はimport { ajax } from 'rxjs/observable/ajax';である。）

任意ならびにfetch()を使用することが実際に可能ですその他のAJAX APIいくつかは他よりも容易に適合しますが！

fetch() APIはPromiseを返します。これはRxJS v5のにの組み込みサポートがあります。観測可能性を期待するほとんどの演算子は、そのままの約束を消費することができます（mergeMap、switchMapなど）。しかし、しばしば、Rx演算子をPromiseの残りの部分に渡す前にPromiseに適用したいので、しばしばObservable内にPromiseをラップしたいと思うことがあります。

あなたがここにObservable.from(promise)

で観察への約束をラップすることができますが、私は、ユーザーのためにフェッチJSONレスポンスを要求する例を示します、その後、観測可能で約束をラップ：

const api = { 
    fetchUser: id => { 
    const request = fetch(`https://jsonplaceholder.typicode.com/users/${id}`) 
     .then(response => response.json()); 
    return Observable.from(request); 
    } 
}; 

あなたはあなたのエピックでそれを消費し、あなたが望む演算子を適用することができます：

const fetchUserEpic = action$ => 
    action$.ofType(FETCH_USER) 
    .mergeMap(action => 
     api.fetchUser(action.payload) // This returns our Observable wrapping the Promise 
     .map(payload => ({ type: FETCH_USER_FULFILLED, payload })) 
    ); 

この実施例でJSBin：https://jsbin.com/fuwaguk/edit?js,output

---

あなたはAPIコードを管理している場合は約束をキャンセルすることができないので、理想的にあなたがObservable.ajax（またはその他の観察可能なベースのAJAXのutilsの）を使用します。 （この執筆時点）