静的リソース用バージョン番号一括生成ツール

サーバーが静的リソースに長期間のキャッシュを設定している(expires 7d)です。メリットは高速化ですが、代償として:CSSやJSを変更しても、ユーザーのブラウザは依然として古いものを使用している。「明明改了、线上没变化」(「確かに変更したのに、本番環境では反映されていない」)という症状です。唯一の解決策は、参照先にバージョンスタンプを付与することであり、変更ごとにバージョンが上がります。HTMLを貼り付けて、一度にすべて追加する。

無料・ ログイン不要 ローカル計算・ コンテンツはアップロードされません 障害対応・ 同じミスを3回繰り返しました

1HTML を貼り付けます

2バージョン設定

バージョンスタンプのフォーマット推奨例:YYYYMMDD + シーケンス文字:本日最初の変更版は a、同日に再度変更した場合は b。

結果処理統計

出力バージョン番号付きHTML

0 行
—

マニフェストこのページで使用されるリソース

この罠は私たちが既に経験済みです

1・同じ穴に3度ハマる。CSS を初めて変更しても、本番環境に変化が現れない。2度目も変化がない。3度目に JS のナビゲーションを変更しても依然として表示されない。これらの根本原因はすべて同じ:nginx が静的リソースに expires 7dが、ページ内の参照にはバージョン番号がありません。

2・ルールはシンプルだが、プロセスに組み込む必要がある。長期間のキャッシュを設定する場合は、必ずバージョンスタンプを併用してください。リソースを1回変更するごとに、バージョン番号を1つ上げてください。現在、これは私たちのリリースチェックリストにおける定例作業となっている。

3・バックエンドページは逆です。バックエンド/データ系ページは Cache-Control: no-store、長期間のキャッシュを設定しないこと。そうでないと、バックエンドを変更しても7日間待たなければならない。

4・1ページだけを修正しないでください。同一の CSS が9つのページから参照されている場合、そのうち数ページのみを変更すると、「一部のページは新しいが、他のページは古い」という不思議な現象が発生します。