在 android 上更新 PWA 图标答案

【问题标题】：Update PWA icon on android在 android 上更新 PWA 图标
【发布时间】：2018-05-31 16:34:18
【问题描述】：

我创建了一个 React PWA 应用程序，我想如果我已经添加了第一个版本，我的主屏幕上的图标将如何更新？我尝试更新清单，但没有任何改变。

有什么想法吗？

【问题讨论】：

您是否使用 chrome 开发工具配置文件以查看更改后的清单是否进入？默认情况下，您的更改将反映在您下次访问时。尝试从应用列表中关闭您的应用，然后再次打开。 Service Worker 会注意到 manifest 文件的 Hash 码发生了变化，它会下载，下次加载时应用。
当然，变化是在 Chrome 开发工具上的通知。你的意思是我必须删除 APK 然后从 Chrome Android 重新安装它？
没有。我并不是要删除并重新安装，因为如果我们有相同的场景，我们不能指望最终用户也这样做。当您将手机连接到桌面并打开 chrome 开发工具时，您可以对已安装的 PWA 进行远程调试（因为它只是在 chrome 中打开一个全屏网页）。关注这一点，让我们更深入地了解 Service Worker 更新、图标上发生的事情。 developers.google.com/web/tools/chrome-devtools/…
如果您可以分享网址，社区将更容易找到问题。
安装应用时，设备主屏幕图标的右下方是否有一个浏览器小图标？

【解决方案1】：

更改不会立即反映。在大多数情况下，更改应在 PWA 启动后的一两天内反映，在清单更新后。

启动 PWA 时，Chrome 会确定上次检查本地清单是否有更改的时间。如果在过去 24 小时内未检查清单，Chrome 将为清单安排网络请求，然后将其与本地副本进行比较。

如果清单中的select properties 已更改，Chrome 会将新清单排入队列，并且在 PWA 的所有窗口都已关闭、设备插入并连接到 WiFi 后，Chrome 会从服务器请求更新的 WebAPK。更新后，将使用新清单中的所有字段。

【讨论】：