はじめに

今回は、rtkQueryを利用したAPIフェッチで、Postmanのモックサーバーから返却される値が、モックサーバーのレスポンスを編集したあとも編集前の値が返却されてしまう問題の解消法について書いていきたいと思います。

発生した環境

フロントエンド

モックサーバー

rtkQueryのヘッダーに"cache-control": "no-cache"(ないし"no-store")を追加する。

この場合においては"no-store"の方が適切かも。

蛇足 : この現象に遭った時の思考

rtkQueryのhookから返却されるdataが、Postmanで構築されたモックサーバーのレスポンスをどれだけいじっても編集前から変わらない。

Postmanのバグかと思い、curlなどで再現するかそう

curlで叩くとちゃんと編集後の値が返却される。

Postmanのバグではなさそう？ rtkQueryまたはシミュレーターの問題か？

アプリの再ビルド、シミュレーターの再起動を試しても編集前の値が返却される。

ここで本当に意味がわからなくなる(正直、今でもなぜ再ビルド・再起動してもそのままっだたのかわかってない)
仕方ないのでrtkQueryの設定を色々変えてみようかと思う

keepUnusedDataForなどのrtkQueryのキャッシュビヘイビアをいじっても何も変わらない。

rtkQueryだけいじっていても事態は好転しなさそうなので、axiosやfetch apiで試してみようと思い立つ

アプリ内でaxiosを用いて叩くとちゃんと編集後の値が返却される(その上、それ以降はrtkQueryで叩いてもしっかり編集後の値が返却される)

カッコ内の現象も相まってまさかの結果。シミュレーターやreact nativeの問題ではなさそうだったのでプロジェクト内のrtkQueryに関連するコードを見直す。
ヘッダーを設定する箇所があったので、まさかとは思いつつも"cache-control"を設定し解決に至る。