代码之家  ›  专栏  ›  技术社区  ›  Basj

渐进式web应用程序是如何更新的?安装是否重新触发?

  •  0
  • Basj  · 技术社区  · 4 年前

    在这个回答中 When and how does a PWA update itself? 据解释,如果 manifest.json 链接将被更新,或者如果一个字符从 service-worker.js 文件

    但“更新”到底是什么意思?这意味着什么 这个 install 事件重新触发,并重新下载下面列出的所有文件 ?

    是否有文件证实Android和iOS上的所有浏览器都是如此?(我不知道后者使用PWA的方式是否与Android相同)

    下面是一个例子 服务人员。js 文件:

    self.addEventListener('install', (e) => {
      e.waitUntil(
        caches.open('myapp-store').then((cache) => cache.addAll([
          '/app/index.html',
          '/app/file1.jpg',   
          '/app/file2.mp3',   
          '/app/file3.png',   
        ])),
      );
    });
    
    self.addEventListener('fetch', (e) => {
      console.log(e.request.url);
      e.respondWith(
        caches.match(e.request).then((response) => response || fetch(e.request)),
      );
    });
    
    0 回复  |  直到 4 年前
        1
  •  1
  •   Jeff Posnick    4 年前

    服务工作者更新流独立于应用于web应用程序清单的任何更新检查。

    " The Service Worker Lifecycle “建议阅读,并解释了初始安装和更新流程。

    从那份文件中借用并回答你的问题,是的 install 一旦浏览器检测到更新,将执行更新的service worker文件的事件。如果更新的服务人员文件包含 cache.addAll() 然后将执行该操作,如果正在缓存的URL与之前缓存的相同URL相同,并且缓存名称相同,那么旧的缓存值将被在缓存期间获取的内容覆盖 安装 .

    许多人在他们的服务工作者文件中包含内联版本控制信息,以便他们可以通过更改该值来触发更新。它们还可以使用与版本控制信息关联的新缓存名称,这样就不会覆盖以前缓存的值,而是创建新的缓存条目。这往往更安全,因为在更新的service worker激活之前,旧的service worker将继续控制打开的页面,并且使用版本化的缓存名称意味着旧的service worker可以继续读取它期望的缓存值。