在github页面上确定页面已过时 [英] Determining a page is outdated on github pages

问题描述

Github页面设置非常积极的缓存标头（ Cache-Control：max-age = 86400 1天，过期提前1个月）。

如果您更新网页并推送到Github，人们重新浏览已经获得缓存副本的页面将不会获得新的页面，而不会实际清理浏览器缓存。

脚本如何运行页面确定它已过时并强制更新？

步骤可能是：
$ b $ ol

确定您正在github页面上运行： ，解析 window.location 为 github.com /

确定当前版本的页面： hard ，git不允许将sha1 嵌入提交页;没有RCS $ id $ 。那么你怎么知道你是什么版本？

获取github中的当前版本; hard ，github摆脱了未经认证的v2 API。推动github和github开始发布也有一段时间的断开。那么你怎么知道你可以得到什么版本？

确定你已经陈旧，如何使页面无效并强制重新加载？ ， window.location.reload（true）在Safari / Chrome中无效，例如...

所以它解决这些步骤;当然可能有另外一种方式？为了更好地控制网站的缓存，你可以使用HTML5缓存表现。请参阅：

• A HTML5 Rocks上使用应用程序缓存的新手指南


• 在Mozilla开发者网络上使用应用程序缓存


• 在HTML5中缓存清单
a> on Wikipedia

• 离线Web应用程序 W3C工作组注释


• 离线Web应用程序 WHATWG

您可以使用 window.applicationCache.swapCache（） 更新您网站的缓存版本需要手动重新加载页面。

这是 HTML5 Rocks 解释如何更新用户的代码示例到您网站的最新版本：

  //检查页面加载时是否有新的缓存可用。 
 window.addEventListener（'load'，function（e）{
 
 window.applicationCache.addEventListener（'updateready'，function（e）{
 if（window.applicationCache。状态== window.applicationCache.UPDATEREADY）{
 //浏览器下载了一个新的应用程序缓存
 //将其交换并重新加载页面以获得新的热度
 window.applicationCache。 swapCache（）; 
 if（confirm（'这个站点的新版本可用，加载它？'））{
 window.location.reload（）; 
} 
 } else {
 // Manifest没有改变，没有新到服务器。
} 
}，false）; 
 
}，false）; 
  

为了避免一些混淆，我将补充说GitHub为cache.manifest文件设置了正确的HTTP标头：

 内容类型：text / cache-manifest 
 Cache-Control：max-age = 0 
 Expires：[CURRENT TIME] 
  

所以你的浏览器知道它是一个缓存清单，它应该总是检查新版本。

Github pages sets very aggressive cache headers (Cache-Control: max-age=86400 1 day, Expires 1 month ahead) on all served content.

If you update your pages and push to github, people revisiting the pages who have already got cached copies will not get the new pages without actually cleaning their browser cache.

How can a script running in a page determine that it is stale and force an update?

The steps might be:

1. determine you are running on github pages: easy, parse window.location for github.com/
2. determine current version of page: hard, git doesn't let you embed the sha1 in a commited page; no RCS $id$. So how do you know what version you are?
3. get the current version in github; hard, github got rid of non-authenticated v2 API. And there's a time disconnect between pushing to github and github getting around to publishing too. So how do you know what version you could get?
4. having determined you're stale, how do invalidate a page and force reload? hard, window.location.reload(true) doesn't work in Safari/Chrome, for example...

So its solve-these-steps; of course there may be another way?

解决方案

To have a better control of the caching of your website you can use the HTML5 cache manifest. See:

• A Beginner's Guide to Using the Application Cache on HTML5 Rocks
• Using the application cache on Mozilla Developer Network
• Cache manifest in HTML5 on Wikipedia
• Offline Web Applications W3C Working Group Note
• Offline Web applications at WHATWG

You can use the window.applicationCache.swapCache() to update the cached version of your website without the need for manually reloading the page.

This is a code example from HTML5 Rocks explaining how to update users to the newest version of your site:

// 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);

To avoid some confusion I'll add that GitHub sets the correct HTTP headers for cache.manifest files:

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

so your browser knows that it's a cache manifest and that it should always be checked for new versions.

这篇关于在github页面上确定页面已过时的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！