S3 で静的 Web サイトをホストしており、Cloudfront を使用してファイルをキャッシュしています。基本的に、次のヘッダーを持つ 3 つのファイルがあります。
- index.html (キャッシュ制御: キャッシュなし)
- app.js (キャッシュ制御: max-age=63072000、公開)
- style.css (Cache-Control: max-age=63072000, public)
私の html ファイルは、css または js ファイルを更新するたびに更新されるクエリ文字列パラメーターを使用しています。これらのパラメーターを渡すように s3 を構成し、キャッシュされたリソースを無効にするように機能することを確認しました。私の index.html ファイルは次のようになります。
<html>
<head>
...
<link rel="stylesheet" href="app.css?v=14113e2c764">
</head>
<body>
...
<script src="app.js?v=14113e2c764"></script>
</body>
</html>
一日中更新をプッシュしているのでうまく機能しているようですが、翌朝来て次の変更をプッシュすると、index.html ファイルが古くなっています。正しい ?v= パラメータではなく、古いパラメータが使用されています! これを修正する唯一の方法は、html ファイルを手動で無効にすることです。その後、すべてがその日の残りの部分で機能します。翌日、私は再び同じ問題を抱えています。
何が起きてる？