【失敗談】ランキングが更新されない！？ブラウザキャッシュの罠とPHPヘッダーでの対策

こんにちは、Play Spot 開発担当です。
先日、ユーザーの方から「ハイスコアを出したのに、ランキングに自分の名前が載らない！」というお問い合わせをいただきました。
データベースを確認するとデータは保存されているのに、画面には古いランキングのまま…。
犯人は「ブラウザのキャッシュ」でした。

😱 iOS Safariの強力なキャッシュ仕様

Webサイトを高速表示するために、ブラウザは一度読み込んだデータを一時保存（キャッシュ）します。
通常、画像やCSSなどがキャッシュされるのは歓迎すべきことですが、今回のケースでは「ランキングAPI（JSONデータ）」までキャッシュされてしまっていたのです。

特にiPhoneのSafariはキャッシュの挙動が強力で、何度リロードしても「数分前の古いランキングデータ」を頑なに表示し続けることが判明しました。

🛠️ 解決策：PHPヘッダーで「キャッシュ禁止」を命令する

JavaScript側でURLにパラメータをつける（api.php?timestamp=123...）方法もありますが、今回はサーバー側（PHP）で根本的な対策を行いました。
APIのレスポンスヘッダーに、以下の呪文を追加します。

// ブラウザに「このデータは絶対に保存しないで！」と伝える設定
header('Content-Type: application/json; charset=utf-8');

// HTTP/1.1 用
header("Cache-Control: no-store, no-cache, must-revalidate, max-age=0");
header("Cache-Control: post-check=0, pre-check=0", false);

// HTTP/1.0 用（古いブラウザ対策）
header("Pragma: no-cache");

no-store は「保存するな」、must-revalidate は「使う前に必ずサーバーに確認しろ」という意味です。
ここまで徹底的に記述することで、ようやくiPhoneでもリアルタイムにランキングが更新されるようになりました。

💡 教訓

動的なデータ（API、チャット、通知など）を扱う際は、キャッシュ対策を忘れると痛い目を見ます。
「PCでは動くのにスマホでおかしい」という時は、まずキャッシュを疑ってみるのが良さそうです。