4

サーバー上の css ファイルを更新すると、多くのクライアント ブラウザーは、キャッシュされた古い css ファイルを使用してページをかなりの時間ロードし続けます。

多くの投稿を検索し、さまざまなアイデアをまとめた後、最もシンプルで安価なアプローチと思われるものを思いつきました.

css ファイルがリンクされている場合はhref、次のように、ファイルの最終変更日のタイムスタンプを追加します。

<link rel="stylesheet" type="text/css" href="main.css?t=<?=filemtime('main.css')?>" />

私は CakePHP を使用しているので、レイアウト ファイルで行うことは次のとおりです。

  <? $t = filemtime(CSS . 'main.css'); ?>
  <?=$html->css("schedule.css?t={$t}") ?>

そのため、css ファイルへのリンクには最後に余分なタグがありますが、ファイルが変更されていない限り、同じままです。これは、ブラウザが通常どおりキャッシュできることを意味します。ただし、ファイルが変更されるとすぐにリンクが変更され、ブラウザーはすぐに動きます。

それでも、この方法では、意図しないものに何かを使用することに対して、少し汚れた感じが残ります. メッセージの内容が重要であるという意味で、その存在を識別する以外に、送信されている「メッセージ」は役に立ちません。

ここに私の質問があります：

  1. クライアントがブラウザーのキャッシュから古いスタイルシート (またはその件については JavaScript) を含む改訂された HTML を表示するリスクがあることを認めることができますか?
  2. これはハッキングですか、それとも正当な解決策ですか?
  3. より良い解決策はありますか？
4

2 に答える 2

4

CakePHPには、このための非常に使いやすいソリューションがあります。この行のコメントを外してください：

//Configure::write('Asset.timestamp', true);

からcore.php

そのファイルによると、これは

最終変更時刻のタイムスタンプを静的アセット（js、css、画像）に適用します。ファイルが変更された時刻を含むクエリ文字列パラメータを追加します。これは、ブラウザのキャッシュを無効にする場合に役立ちます。

これは非常に簡単に実行でき、ほとんどの場合機能しますが、絶対確実というわけではありません。ほとんどのプロキシは、「？」でリソースをキャッシュしません。URLに含まれているため、これらのケースを修正する場合は、phpdevが提案するようなより複雑なソリューションを実装する必要があります。

于 2012-05-15T22:10:06.517 に答える
4

あなたのやり方で問題ないと思います。より一般的には、これはキャッシュ無効化またはキャッシュ無効化と呼ばれます。

ただし、次のような URL を使用しているためhttp://site.com/assets/mystyle.css?29320202020、CDN に問題がある可能性があります。CDN はその GET パラメーターを見て、それが動的な要求であると考えるため、サーバーにファイルを要求します。これは、CDN にキャッシュされたコピーを持つ目的を無効にします。

なぜそうするかというと、ファイル名にキャッシュ無効化パラメータを含めるためです: http://site.com/assets/mystyle.2390202202.css. 私はこれを行うために優れたAssetic ライブラリを使用しており、簡単なコードをいくつか書いたので、テンプレートが必要mystyle.cssでmystyle.2390202202.cssあることを認識し、Assetic によってオンザフライで生成され、テンプレートに挿入されます。

このアプローチにより、CDN を適切に処理しながら、キャッシュ無効化機能が得られるはずです。

その他の可能な解決策:

  • ETags: ブラウザーは ETag (ファイルのハッシュと見なすことができます) を使用してサーバーに要求を送信し、ファイルが変更されていない場合、サーバーは変更されていないヘッダー応答で応答します。欠点: HTTP リクエストを行う必要があります。

  • 期限切れヘッダーを設定します。サーバーは、ファイルが特定の日付に期限切れになることをブラウザーに通知します。その日付がまだその日付でない場合、ブラウザーはサーバーからのコピーを要求せず、ローカルにキャッシュされたコピーを使用します。欠点: サーバー上のファイルが日付より前に変更された場合、ブラウザーのユーザーは手動でハード リフレッシュを行う必要があります。

これが、キャッシュ無効化パラメーターを使用することを好む理由です。ファイルの有効期限ヘッダーを 5 年で期限切れになるように設定できます。また、ファイルを更新してキャッシュ無効化パラメーターを変更しない限り、ブラウザーはそのファイルに対して http 要求を行うべきではありません。

于 2012-04-16T01:16:17.620 に答える