Html 为什么不是';我的缓存webapp是否在第一次尝试时刷新更改?

Html 为什么不是';我的缓存webapp是否在第一次尝试时刷新更改?,html,ios,firefox,caching,web,Html,Ios,Firefox,Caching,Web,我正在跟踪并在我的iPad上试用它。教程说: 您可以等待应用程序缓存自动更新,或者使用JavaScript触发更新。仅当清单文件更改时,应用程序缓存才会自动更新。如果清单文件中列出的资源发生更改,它不会自动更新。如果清单文件是逐字节相同的,则认为它没有更改;因此,更改清单文件的修改日期也不会触发更新。如果这对于应用程序来说还不够,那么可以使用JavaScript显式更新应用程序缓存 因此,我一直在尝试并强制更新的内容是更改清单文件中包含版本号的注释。例如,我改变这一行: # Cache Mani

我正在跟踪并在我的iPad上试用它。教程说:

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

因此,我一直在尝试并强制更新的内容是更改清单文件中包含版本号的注释。例如,我改变这一行:

# 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"/>

画布教程
我在iPadSafari中获得了一个版本的站点渲染,并将其添加到了我的主页中。如果我做了更改,比如在我的应用程序的html中添加一些文本,那么:

  • 我必须在safari中刷新两次才能看到更改
  • 我必须在“添加到主页版本”中刷新两次才能看到更改
  • 即使我在桌面上尝试firefox,也需要两次刷新才能看到我的更改
  • 为什么会发生这种情况?为什么它在第一次刷新时不起作用

    iOS 7“添加到主页”更新 我发现此文档不适用于iOS 7中的“添加到主页应用程序”。缓存决定定期刷新,据我所知,您对此没有控制权(可能您使用javascript,但我没有尝试过)

    幸运的是,我找到了一个解决办法。查看此处:

    通过观察痕迹(在铬上) 我发现浏览器不会等待应用程序缓存结束刷新来显示从现有应用程序缓存请求的页面

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

    我想解决方案可以是:检测页面中的应用程序缓存刷新完成事件,然后以编程方式重新加载(HTML5特性)

    我在

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

    希望能有所帮助

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