Web Periodic Background Synchronization API

概念與用法

Periodic Background Sync API 允許 Web 應用程式通知其 service worker，在固定的時間間隔內進行任何更新。用例包括在裝置連線到 Wi-Fi 時獲取最新內容，或允許應用程式進行後臺更新。

最小時間間隔在呼叫 API 時設定；然而，使用者代理也可能考慮其他影響 service worker 接收事件時間的因素。例如，之前的網站互動情況，或連線到已知網路。

PeriodicSyncManager 介面可透過 ServiceWorkerRegistration.periodicSync 訪問。一個唯一的標籤識別符號被設定為“名稱”同步事件，然後可以在 ServiceWorker 指令碼中監聽。一旦收到事件，您就可以執行任何可用的功能，例如更新快取或獲取新資源。

由於此 API 依賴於 service worker，因此此 API 提供功能僅在安全上下文中可用。

介面

PeriodicSyncManager Experimental

在網路連線時，在 service worker 中註冊以定期間隔執行的任務。這些任務被稱為週期性後臺同步請求。

PeriodicSyncEvent Experimental

表示一個同步事件，該事件傳送到 ServiceWorker 的 全域性作用域。它提供了一種在網路連線時在 service worker 中執行任務的方法。

其他介面的擴充套件

Periodic Background Sync 規範中指定了對 Service Worker API 的以下補充，為使用 Periodic Background Sync 提供了入口點。

ServiceWorkerRegistration.periodicSync Read only Experimental

返回一個指向 PeriodicSyncManager 介面的引用，用於註冊將在特定間隔執行的任務。

periodicsync 事件 Experimental

在註冊 PeriodicSyncManager 時指定的週期性間隔發生。

示例

以下示例展示瞭如何使用該介面。

請求週期性後臺同步

以下非同步函式將在瀏覽上下文中，以一天為最短間隔，註冊一次週期性後臺同步。

async function registerPeriodicNewsCheck() {
  const registration = await navigator.serviceWorker.ready;
  try {
    await registration.periodicSync.register("get-latest-news", {
      minInterval: 24 * 60 * 60 * 1000,
    });
  } catch {
    console.log("Periodic Sync could not be registered!");
  }
}

透過標籤驗證後臺週期性同步

此程式碼檢查是否已註冊帶有給定標籤的週期性後臺同步任務。

navigator.serviceWorker.ready.then((registration) => {
  registration.periodicSync.getTags().then((tags) => {
    if (tags.includes("get-latest-news")) skipDownloadingLatestNewsOnPageLoad();
  });
});

移除週期性後臺同步任務

以下程式碼移除一個週期性後臺同步任務，以停止在後臺同步文章。

navigator.serviceWorker.ready.then((registration) => {
  registration.periodicSync.unregister("get-latest-news");
});

在 Service Worker 中監聽週期性後臺同步

以下示例展示瞭如何在 service worker 中響應週期性同步事件。

self.addEventListener("periodicsync", (event) => {
  if (event.tag === "get-latest-news") {
    event.waitUntil(fetchAndCacheLatestNews());
  }
});

規範

瀏覽器相容性

api.PeriodicSyncManager

api.ServiceWorkerGlobalScope.periodicsync_event

另見

• 一篇關於使用週期性後臺同步的文章