Periodic Background Sync 定时离线任务调度实践

`title: Periodic Background Sync 定时离线任务调度实践``categories: Web 开发/前端/数据管理``keywords: Periodic Background Sync,Service Worker,离线,调度,同步``description: 使用 Periodic Background Sync 在支持的平台进行定时离线任务调度，结合 IndexedDB 队列与回退策略，提升前端数据同步可靠性。`注册与请求// 页面侧 async function registerPeriodic(tag = 'sync-messages', minInterval = 24 * 3600 * 1000) { const reg = await navigator.serviceWorker.ready; if ('periodicSync' in reg) { const status = await navigator.permissions.query({ name: 'periodic-background-sync' }); if (status.state === 'granted') { await reg.periodicSync.register(tag, { minInterval }); } } } SW 处理self.addEventListener('periodicsync', (e) => { if (e.tag === 'sync-messages') { e.waitUntil(flushQueue()); } }); 回退策略不支持时使用 `setInterval`/可见性事件在页面激活时批量同步。