RxJSとajaxのGETを組み合わせた処理がIEで動かなかった問題と対処


事の発端

IE8-IE11で、RxJSのfromPromiseの定期的なGETを起点にした処理が1度しか実行されなかった。
IE11では、何故か開発者ツールを開いているときだけ正しく動作し、閉じていると動作しなかった。

原因

Internet Explorerは、AjaxのGETをキャッシュし、リクエストURLが同じならば2度目以降はAPIリクエストせずキャッシュを返す。
また、開発者ツールを開いている際はキャッシュが無効になる(ようだ)。

解決策

ajaxで送るデータのプロパティに次を追加する。

cache: false

罠だったところ

ajax単体で使って変数にデータを代入するだけなら、キャッシュが利用されていても値が1回目と同じになるだけで済む。
しかし、RxJsのfromPromiseを用いている場合、キャッシュが利用されていると、定期的にGETしてもストリームに2度目以降の値が流れてこない(completeもerrorも起きない)。そこを処理の起点にしていたので、それ以後の処理も走らないという結果になっていた。

また、IEで「開発者ツールを開いている時だけ動作する」よくある原因として、Consoleオブジェクトを使っていることが多く挙がっていたので、しばらくその線で調査していたが、全然関係なかった。

参考文献