PWA 服務工作者無法在沒有刷新頁面或 F5 的情況下更新

Question

下午好，我有一個 PWA 應用程序，有一個活躍的 service-worker 需要更新。 當我輸入 PWA 或執行 F5 時，它可以正常工作。 但問題是 PWA 屏幕之一是儀表板，客戶端可能會在其中停留數天（因此它不會執行 F5）並且應該在沒有 F5 的情況下進行更新。 我正在使用 setInterval () 進行測試，但在完成 F5 之前它不會捕獲更新。

代碼運行（我每 5 秒看到一次 console.log），但在我執行 F5 之前它找不到更新

我的 app.component:

initializeApp() {
    setInterval(() => { 
      console.log("cheking updates")
      if (this.swUpdate.available) {
        this.swUpdate.available.subscribe(() => {
          if (confirm("a new version si available."))
            window.location.reload();
          });
      }
    }, 5000)
}

Answer 1

我認為這就是它應該發生的方式。 這樣看，服務工作者（和您的應用程序）正在瀏覽器中運行。

當您部署應用更新時，該應用更新會訪問托管服務器，如果您的應用不與托管服務器通信，則它不會知道有可用更新。

我一直認為SwUpdate observable 更像是一種“緩存繞過”類型的更新，當您刷新時，它會獲取更新，並獨立於緩存中的數據加載新版本。