個人開発をしていてキャッシュで詰まった話
API Routes を使ってDBにデータを登録・削除した後に、キャッシュからデータが返ってきてしまい、古いデータが表示されてしまう。。
で、キャッシュについて調べながらいろいろやってみた
ディベロッパーツールのネットワークタブでどこからキャッシュが返ってきているのか調べられるということを知って調べてみると、どうやらVercelらしかった（X-Vercel-Cache: HIT とあった）
Vercel ドキュメント見たり Zen など見ながらあれこれしてみたが、なかなかうまくいかない、、
↑に書いてある{ cache: 'no-store' }とかも試したけどうまくいかず、、
export const fetchCache = 'force-no-store';
をキャッシュさせたくない API Routes のファイルに書いてあげればOKでした
他のファイルに書いてしまっていてうまくいってなかったみたいです
ちなみに GitHub リポジトリとかでコードを検索してみたりしたのですが、 fetchCache の記述はあっても呼び出しとかはしてなさそうで、なんで？？と思ったのでGPTに聞いてみました↓
Vercel の fetchCache オプションを設定する場合、実際には特定の API ルートや他のサーバーサイドのコード内でこの設定を「呼び出す」というよりは、その設定を export する形で定義します。この定義によって Vercel のプラットフォームが自動的にその設定を認識し、適用します。つまり、この設定はコード内で直接使用されるものではなく、Vercel の内部処理によって参照されるものです。
書くだけで認識してくれるみたいですね
毎日とりかかれたわけじゃないですが、２週間くらい詰まっていたのでスッキリです
キャッシュされずに呼び出し回数が増えてしまうので、状態管理とかでなんかいい感じにしたいですね