有没有办法在iOS上自动更新(或只是清除缓存)PWA? [英] Any way yet to auto-update (or just clear the cache on) a PWA on iOS?

问题描述

我一直在iOS上苦苦挣扎，试图在Android上轻松工作:让我的PWA在有新版本时自动更新.我完全不确定在iOS上是否有可能.我已经使用vue.js和Quasar构建了我的应用程序，并且一切在Android上都是开箱即用的.这是当前iOS版本上的情况(难看，糟糕):

I have been struggling on iOS with something that works easily on Android: Getting my PWA to auto-update when there is a new version. I am not at all sure this is even possible on iOS. I have used vue.js and Quasar to build my app, and everything works out of the box on Android. Here is the (ugly, terrible) way things stand currently on the iOS version:

1. 我可以检查自己的服务器的版本，并将其与存储在我的应用程序(在indexedDB中)中的当前服务器进行比较，并发出一个通知，指出有新版本.到目前为止一切顺利.
2. 除了让用户手动清除SAFARI CACHE(!!)之外，我无法弄清楚如何以编程方式从应用程序内清除PWA缓存或以其他方式强制上载.

所以在这一点上，我想我的问题是:

So at this point I guess my questions are:

1. 在有新版本可用时，任何人都能够在iOS(11.3或更高版本)上获取PWA来自动更新吗?
2. 是否可以从PWA中清除(野生动物园)应用程序缓存?

显然，要通知用户要进行更新，他们必须在应用程序外部执行几个步骤才能刷新它，这是一种令人难以置信的糟糕用户体验，但是除非我同意，否则这似乎是iOS目前所处的位置遗漏了什么.有人在任何地方做过这项工作吗?

Obviously it is an incredibly awful user experience to notify the user that in order to update they must perform several steps outside of the app to be able to refresh it, but it seems this is where iOS stands at the moment unless I am missing something. Has anyone anywhere made this work?

推荐答案

经过数周的搜索，我终于找到了解决方案:

After weeks and weeks of searching, I finally found a solution:

1. 我在服务器上添加了对版本字符串的检查，并如上所述将其返回到应用程序.

1. I add a check for versionstring on the server, and return it to the app as mentioned above.

我在localtstorage(IndexedDB)中寻找它，如果找不到，则添加它.如果确实找到它，就比较版本，如果服务器上有较新的版本，则会抛出一个对话框.

I look for it in localtstorage (IndexedDB) and if I don’t find it, I add it. If I do find it, I compare versions and if there is a newer one on the server, I throw up a dialog.

关闭此对话框(我的按钮标记为更新")运行window.location.reload(true)，然后将新的版本字符串存储在本地存储中

Dismissing this dialog (my button is labeled "update") runs window.location.reload(true) and then stores the new versionstring in localstorage

Voila！我的应用程序已更新！我不敢相信它可以归结为如此简单，在任何地方都找不到解决方案.希望这对其他人有帮助！

Voila! My app is updated! I can't believe it came down to something this simple, I could not find a solution anywhere. Hope this helps someone else!

更新2019年9月:

上述技术存在一些问题，尤其是它绕过了PWA服务工作者机制，有时重新加载不会立即加载新内容(因为当前的SW不会释放页面).现在，我有一个适用于所有平台的新解决方案:

There were a few problems with the technique above, notably that it was bypassing the PWA service worker mechanisms and that sometimes reload would not immediately load new content (because the current SW would not release the page). I have now a new solution to this that seems to work on all platforms:

forceSWupdate () {
  if ('serviceWorker' in navigator) {
    navigator.serviceWorker.getRegistrations().then(function (registrations) {
      for (let registration of registrations) {
        registration.update()
      }
    })
  }
}

现在，在我的服务人员内部，如果有更新，我会弹出对话框，然后从那里进行我的location.reload(true).这总是导致我的应用程序立即刷新(重要的警告是我在注册中添加了skipWaiting和clientsClaim指令).

And inside my serviceworker I now throw up the dialog if there is an update, and do my location.reload(true) from there. This always results in my app being refreshed immediately (with the important caveat that I have added skipWaiting and clientsClaim directives to my registration).

这在每个平台上都相同，并且我可以以编程方式检查更新或等待服务人员自己执行更新(尽管它的检查时间因平台，设备和其他不可知因素而相差很大.通常不是)超过24小时.)

This works on every platform the same, and I can programatically check for the update or wait for the service worker to do it by itself (although the times it checks vary greatly by platform, device, and other unknowable factors. Usually not more than 24 hours though.)

这篇关于有没有办法在iOS上自动更新(或只是清除缓存)PWA?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！