颤振（腹板）-如何重新加载颤振PWA

Question

这是一个类似的问题（标题错误）:Flutter Web-如何重新加载当前活动页面

作为PWA运行Flutter web应用程序，我需要允许用户启动刷新，从而更新（web）应用程序。

不幸的是，当web和移动本机应用程序具有相同的代码库时，不再允许将“dart:html”导入为HTML；。因此下面的代码不是选项:

  RaisedButton(
    child: Text("Update me"),
    onPressed: () {
      if (kIsWeb) html.window.location.reload();
    },
  ),

正确的做法是什么？

编辑:我已经设法在pwa和mobile使用条件导入的相同代码库中使用'dart:js'。这意味着我可以从Flutter代码中调用JavaScript。不幸的是，location.reload（true）；不会重新加载PWA。

理想情况下，我将使用Flutter方法来实现PWA重新加载/更新或JavaScript变通方法。

编辑2:整个问题都在刷新按钮/窗口重新加载的PWA处理范围内。

不幸的是，只能从服务工作者内部调用服务工作者的skipWaiting（）(https://developers.google.com/web/juditals/primers/service-workers/lifecycle#skip_the_waiting_phase)

正确的方法是将skipWaiting消息发送到服务工作者的新实例。

然而，某些浏览器（iOS？）还不完全支持skipWaiting所以更安全的方法是取消工作人员的注册。。。

最后我使用following来停止worker并重新加载。

if ('serviceWorker' in navigator) {
   navigator.serviceWorker.getRegistration().then(swr => {swr.unregister().then(
     () => {location.reload(true)}
   )});
} else {location.reload(true)}

相关:

Access service worker skipWaiting从使用WebPack+Workbox的App build内生成

https://medium.com/@nekrtemplar/self-destroying-serviceworker-73D62921D717

https://redfin.engineering/How-to-fix-the-refresh-button-when-using-service-workers-A8E27AF6DF68

https://deanhume.com/display-a-new-version-available-progressive-web-app/

Answer 1

一旦网页/浏览器关闭并重新打开，PWA将得到更新！

Answer 2

一个解决办法是导航到您的应用程序入口点路由'/'

`Navigator.of(context).pushNamedAndRemoveUntil(
              '/,
              (Route<dynamic> route) => false
            );`