管理するWebサイトがあり、そのファイル構造への完全なアクセス権があります。 何らかの理由で、このサイトはあなたに無関心ではありません。おそらく、あなたの分身を反映しているのか、政治的な声明のプラットフォームとして機能しているのか、単にビールのためにあなたのためにお金を稼いでいるのでしょう 何らかの方法で、便利なウィジェット、クールなアイコンセット、または便利なプラグインなど、コンピューターの前に座ってサイトに別の改善を加える必要性を時々感じます。
状況
ページテンプレートを根本的に再設計しました（ビートの整列、色の変更、背景画像の設定）。 本当にかっこいい！ サーバーに変更をアップロードします。 FTPクライアントを起動し、左パネルからgifsとcsssを右にドラッグアンドドロップし、好きなブラウザでWebサイトを開きます...
お母さん！ お母さん！ 母！」エコーは習慣からエコーしました。
なんだ？ すべてはどこに行ったのですか？ ブロックが互いの上に収まるのはなぜですか？ この青い縞はどこから来たのですか？ 間抜けなフォントとは？
私の頭の中で考えが爆発します。「まあ、この墓全体が今、全世界を見ている！ まあ、すべてではありませんが、少なくとも私のサイトに行く部分は！ あなたの母親、何をすべきか？！」
頑張って！ パニックなし。 ひどいことは何も起こりませんでした。 すべて順調です。
キャッシュから100年使用していない古いブラウザーをすべて取り出します。 Netshkafには何がありますか？ シマンカ？ 第八オペラ？ 関係ありません ウェブサイトを開きます。 まあ、安心？ すべてが本来あるべき姿に見えますか？ そうだね。 これは、すべての新規訪問者が今あなたのサイトを見る方法です。 そして、お気に入りのブラウザーの混乱は、CSSファイルの古いコンテンツがブラウザーのキャッシュに保存されたという事実によるものであり、過去2日間に積み上げてきたこれらすべてのスタイルはまだコンピューターに到達していません。 ところで、この問題をlecheの肺で修正するには、Ctrl + F5を押します。
別のことは、すべての訪問者がそれほど進んでいるわけではないことであり、一部の訪問者は、長い間到着した写真を熟考することを余儀なくされるでしょう。 ヒントを書くだけです。「サイトが曲がっているように見える市民は、Ctrl + F5を押してください。」
または、より良い方法がありますか？ ブラウザを強制的にキャッシュの更新を強制することは可能ですか？
先を見て、私はあなたを喜ばせることができます：そのような方法があります！ さらに、この方法は見苦しくシンプルで、100パーセント有効で、まったく問題ありません。 ただし、最初にまず最初に。 真剣に、それはより有益です。
分析
したがって、ブラウザとそのキャッシュ。 ブラウザが新しいコンテンツに行くか、古いコピーを取得するかを決定するものは何ですか？ 実際、多くの要因から。 ブラウザのタイプから。 バージョンから。 プラットフォームから。 ユーザー設定から。 サーバー静的からのHTTPヘッダーの提供元。 Webサーバーとコンピューターの間の経路上のプロキシの存在から。 要するに、何がたくさん。 この経済全体を管理する方法はありますか？ キャッシュでスコアを付けて、新しいコンテンツを急いで集めるためのすべてのコマンドをそれらに与えることは可能ですか？
短い答えはノーです。 しかし、オプションがあります。 これを今考えます。
1. HTTP Cache-Controlヘッダー
理論的には、サーバーから提供される静的リソースに次のようなヘッダーを付けることが可能です。
Cache-Control: no-cache
これにより、クライアントがサーバーファイルの現在のコンテンツを使用することが保証されます。 残念ながら、この方法には重大な欠点があります：ネットワークや他のリソースに過度の（そして不必要な）負荷を作成します：結局、すべてのページリクエストで、ブラウザーは付随する静的データ（スタイルファイル、JavaScriptスクリプト、グラフィックイメージ）をリロードする必要があります。 さらに、すべての人がHTTPヘッダーを管理できるとは限らず、また必ずしもそうとは限りません。
次のような別のヘッダー値を指定できます。
Cache-Control: max-age=86400
これは、ご存知のように、24時間キャッシュにコピーを保持するディレクティブですが、これは問題を解決しません：ユーザーがサイトにアクセスした場合（静的がキャッシュ内にあることが判明）、その後、ファイルを変更し、明日まで彼女はこれを知らず、移動したレイアウトの面付けを賞賛することを余儀なくされます。
2. Last-Modified HTTPヘッダー
原則として、ほとんどのサーバーは、静的リソースを返すときにこのヘッダーを自動的に登録します。 これにより、ファイルが実際に変更された場合にのみ、ブラウザは新しいコンテンツをアップロードできます。 これを行うには、GETリクエストとともに、ブラウザーがヘッダーを送信します。
If-Modified-Since: Tue, 23 Jun 2009 19:12:47 GMT
サーバーは、対応するファイルが変更された日付を確認し、何も変更されていない場合、ステータスコード304で応答します。この相互作用スキームは、ネットワークの負荷をいくらか軽減しますが、残念ながら、ブラウザーがこのファイルに関心を持つことを決定する保証はありません。
それで、彼からどのように必要な行動を得るのでしょうか？ これには根本的な救済策があります。
3.ファイルの名前を変更します
実際、HTMLドキュメントの本文で、たとえばstyle.cssではなくstyle1.cssなどの新しい名前でスタイルシートを参照する場合、ブラウザーの場合は完全に異なるリソースになり、サーバーから直接取得する必要があります。
やった！ 問題は解決しました！
ただし、急いで喜んではいけません。 ファイルの名前を変更すると、1つの問題が削除されますが、他にも多くの問題が発生します。 純粋に実用的な理由でさえ、プロジェクトにそのような「さまよう」ファイルがあるのは非常に不便ですが、私たちだけではありません！ 結局のところ、開発環境を設定し、バージョン管理システムがあります-そして、それらは絶えず名前が変更されたファイルで動作するように設計されていません。
しかし、ちょっと、もし... ...ファイルを変更しないとどうなりますか。 ユーレカ！
4. URLの名前を変更する
URLには、ファイル名に加えて、さまざまなコンポーネントが含まれることがあることに注意してください。 たとえば、クエリ文字列は疑問符の後に来る部分です。 これはフォーラムエンジンにのみ適していると考えました：/index.php?showthread=1234？ しかし、彼らは推測しませんでした。 誰でも利用したい。 たとえば、スタイルシート用です。 そのような行を登録するのはどうですか：
<link rel="stylesheet" href="/style.css?ver=123" type="text/css" />
きれいですか？ そして！ どうなるか見てみましょう。 ブラウザはページのHTMLコードをダウンロードします。 彼は、スタイルシートへのポインターを参照します。 URLを調べます：/style.css?ver=123。 キャッシュをチェックし、古いバージョン/style.css?ver=122を見つけます。 ブラウザの場合、これらは2つの完全に異なるアドレスであるため、新しいCSSファイルに対してGETリクエストを発行することをためらいません。
これで、Webサーバーが機能します。 彼はリソースのサーバーアドレスを分析し、静的なstyle.cssファイルを要求している場合、URLのドラムのテールを要求していると判断します。 したがって、彼はそれを受け取り、明確な良心をもって指定されたファイルの内容をクライアントに与えます-あなたがちょうど変更したものです。
テレマーケット！
実際、このアプローチは多くの変更で変更できます。たとえば、/ style.css？123という形式のさらに単純なアドレスを使用したり、ファイルの変更日を文字列に自動的に変換してシャンクに置き換えたりするサーバーコードを使用します。 しかし、それはすべての詳細です。 最も重要なことは、スタイルを変更した後に適切なページを表示する方法を知っていることです。
サイト構築に頑張ってください！
更新する
記事の議論中に、特別な言及に値する考慮事項が行われました。 特に：
1.一部のブラウザー（主にIE 6以降）は、変数を含むURLのページをキャッシュしません。
違います。 かなりのキャッシュです。 ログのキロメートルは、さまざまな構成のさまざまなサイトで監視されており、責任を持って宣言できます。一部のブラウザは、アドレスにすねがあるページを基本的にキャッシュしないため、気づかれませんでした。 インターネットに関する問題をさらに調査した結果、確実に、明示的に記述されたCache-Controlキャッシングディレクティブを使用して静的変数を指定することが望ましいことが示され、その後、質問はほぼ完全に削除されました。
2.変数ではなく、URLの定数部分を変更する方が適切ですが、mod_rewriteを使用して永続ファイルにリダイレクトします。
これについて私が言えることは、クライアントでのキャッシュに関するすべての問題を取り除く、絶対に機能するソリューションです。 mod-rewrite構成にアクセスできるすべての人に強くお勧めします。 ただし、Webサイトファイルへのアクセスのみが可能な状況では、このノートに記載されているURLの変数を使用した方法で十分に満足できます。
3.プロジェクトの自動アセンブリおよび展開プロセスの一部として、すべての名前変更を行います。
仲間たち！ この投稿は、Webソフトウェアのストリーミング開発に携わる人々を対象としています。 ボタンをクリックするだけでサイトがデプロイされるようなバンドルにすべてがある場合は、静的の名前を変更するなどのことが100ポンドでわかるはずです。
注：「ウェブトリック」はミニシリーズで、著者のプロジェクトである愚か者なしの英語を 5年以上サポートおよび開発してきたウェブマスターの経験を少し共有しています。