据我所知,一旦你点击"添加到主屏幕"在PWA的网站上,浏览器使用提供的清单文件和来源生成.apk,并将其安装为普通应用程序。
我注意到,当我更新网站时,应用程序还会显示更新的内容,这表明应用程序只是访问网站的包装器。我还注意到网站的更新没有立即显示,我认为这是由于内部缓存。
我的问题是,我的假设是否正确?或者更一般地说,PWA何时以及如何更新,是否有办法在客户机上强制更新?
答案 0 :(得分:14)
无缓存方案(无服务工作者):只有在使用Service Worker时才会缓存PWA应用程序。 Manifest.json将帮助您将网络应用程序添加到主屏幕,并带有图标并打开,不带地址栏。如果您没有服务人员或浏览器不支持,则每次都会重新加载网页。没有缓存。
缓存方案(使用服务工作者):假设您已配置服务工作者,服务工作者可以通过延迟加载或预取为缓存配置的文件进行缓存(您可以包含或排除缓存从html,CSS,图像到JSON / XML API响应的任何内容。
初始缓存后,服务工作人员将使用缓存根据您从下面实施的cache approach提供的应用网络请求。
由于性能优势,大多数应用选择precache并在加载时查找新文件,如果发现任何更改将在下一个会话中加载或提示用户刷新。使用此解决方案,每个文件将为服务工作者缓存的每个文件都有一个长哈希字符串。在加载每个应用程序时,将获取来自服务器的哈希代码以匹配并找到需要更新的文件,并且将在单独的服务工作线程中更新相同的文件。您可以在网络标签中注意到这一点 - > chrome开发者工具中的服务工作者响应。
如果选择网络拳头方法,则可以避免在初始加载时显示旧内容,但缓存带来的显着性能优势。
答案 1 :(得分:6)
本质上,只有两个事件会自动触发 PWA 更新:
manifest.json
的变化;例如更改的图标文件或更改的 scope
或 start_url
。service-worker.js
中的一个字符更改。因此,如果您将版本号存储在此文件的 const
中并对其进行更改,则会触发 PWA 的更新。当检测到更改时,新版本通常只会在下一次 PWA 加载时激活。因此,总的来说,需要两次重新加载才能看到变化。
最终如何处理更新最终由 service-worker.js
决定。可以根据 PWA 资产的规模和波动性定义不同的更新策略。也可以立即激活新服务。
但是,有一个重要警告。请确保您的资产服务器的 .htaccess
文件设置的浏览器缓存到期指令设置为持续时间非常短(例如hours
)甚至到none。
如果不这样做,将导致浏览器在 manifest.json
和 service-worker.js
中的未来几天都看不到任何变化。
有关 Service Worker 行为的更多详细信息,请访问 Google Web Fundamentals。