46

Github Pagesは、提供されるすべてのコンテンツに非常に積極的なキャッシュヘッダー(Cache-Control: max-age=864001日、Expires1か月先)を設定します。

ページを更新してgithubにプッシュすると、すでにキャッシュされたコピーを取得しているページに再度アクセスするユーザーは、実際にブラウザーのキャッシュをクリーンアップしない限り、新しいページを取得できません。

ページで実行されているスクリプトは、どのようにしてページが古くなっていると判断し、強制的に更新することができますか?

手順は次のとおりです。

  1. githubページで実行していることを確認します:簡単解析window.locationgithub.com/
  2. ページの現在のバージョンを判別します。hard 、gitでは、コミットされたページにsha1を埋め込むことはできません。RCSはありません$id$。では、自分がどのバージョンであるかをどうやって知るのでしょうか?
  3. githubで現在のバージョンを取得します。ハード、githubは認証されていないv2APIを取り除きました。また、githubにプッシュすることとgithubが公開に移行することの間には時間の隔たりがあります。では、どのバージョンを入手できるかをどうやって知るのでしょうか?
  4. 古くなっていると判断したら、ページを無効にして強制的にリロードするにはどうすればよいですか? ハードwindow.location.reload(true)たとえばSafari/Chromeでは機能しません...

したがって、その解決-これらのステップ; もちろん別の方法があるかもしれませんか?

4

1 に答える 1

39

Web サイトのキャッシュをより適切に制御するには、HTML5 キャッシュ マニフェストを使用できます。見る:

を使用するwindow.applicationCache.swapCache()と、手動でページをリロードしなくても、Web サイトのキャッシュ バージョンを更新できます。

これは、サイトの最新バージョンにユーザーを更新する方法を説明するHTML5 Rocksのコード例です。

// Check if a new cache is available on page load.
window.addEventListener('load', function(e) {

  window.applicationCache.addEventListener('updateready', function(e) {
    if (window.applicationCache.status == window.applicationCache.UPDATEREADY) {
      // Browser downloaded a new app cache.
      // Swap it in and reload the page to get the new hotness.
      window.applicationCache.swapCache();
      if (confirm('A new version of this site is available. Load it?')) {
        window.location.reload();
      }
    } else {
      // Manifest didn't changed. Nothing new to server.
    }
  }, false);

}, false);

混乱を避けるために、GitHub が cache.manifest ファイルに正しい HTTP ヘッダーを設定していることを追加します。

Content-Type: text/cache-manifest
Cache-Control: max-age=0
Expires: [CURRENT TIME]

そのため、ブラウザはそれがキャッシュ マニフェストであり、常に新しいバージョンをチェックする必要があることを認識します。

于 2012-10-28T06:54:51.147 に答える