2

我正在学习本教程并在我的 iPad 上进行尝试。教程说：

您可以等待应用程序缓存自动更新或使用 JavaScript 触发更新。仅当清单文件更改时，应用程序缓存才会自动更新。如果清单文件中列出的资源发生更改，它不会自动更新。如果清单文件逐字节相同，则认为清单文件未更改；因此，更改清单文件的修改日期也不会触发更新。如果这对您的应用程序来说还不够，您可以使用 JavaScript 显式更新应用程序缓存。

因此，我一直在尝试强制更新是更改清单文件中包含版本号的注释。EG，我改变这一行：

# Cache Manifest Version: 1.6

我的 html 标头如下所示：

<!DOCTYPE html>
<html lang="en" manifest="cache.manifest">
<head>
    <meta charset="UTF-8"/>
    <title>Canvas tutorial</title>

    <link rel="stylesheet" type="text/css" href="app.css">
    <meta name="viewport" content="width=640; user-scalable=no;"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>

我在 iPad Safari 中获得了我的网站渲染版本，并将其添加到我的主页。如果我进行更改，例如将一些文本添加到我的应用程序的 html 中，则：

  1. 我必须在 Safari 中刷新两次才能看到变化。
  2. 我必须在“添加到主页版本”中刷新两次才能看到更改。
  3. 即使我在桌面上尝试使用 Firefox，也需要两次刷新才能看到我的更改。

为什么会这样？为什么它在第一次刷新时不起作用？

iOS 7“添加到主页”更新

我发现此文档不适用于 iOS 7 中的“添加到主页应用程序”。缓存决定定期刷新，据我所知，您无法控制（也许您使用 javascript，但我没有尝试过）。

幸运的是，我找到了解决方法。见这里：https ://stackoverflow.com/a/19674061/61624

4

1 回答 1

1

通过观察跟踪（在 Chrome 上）我看到浏览器不等待应用程序缓存刷新结束来显示来自现有应用程序缓存的请求页面

然后浏览器显示以前的版本。

我想一个解决方案可以是：检测页面中的应用程序缓存刷新完成事件，然后以编程方式重新加载（HTML5 功能）。

我在 http://www.html5rocks.com/en/tutorials/appcache/beginner/找到

以下代码可能会对您有所帮助。（代码请求刷新权限，但在您的用例中，代码可能会更新以立即重新加载。）

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

希望有所帮助

于 2013-12-12T09:33:57.400 回答