This page demonstrates AffordaCalc's background sync capabilities using the standard web.dev pattern for PWA validation. It registers a background sync that will process data when the device comes online.
Background Sync Status
Initializing background sync...
Event Log
Background Sync Implementation
// Check to make sure Sync is supported.
if ('serviceWorker' in navigator && 'SyncManager' in window) {
// Get our service worker registration.
const registration = await navigator.serviceWorker.registration;
try {
// This is where we request our sync.
// We give it a "tag" to allow for differing sync behavior.
await registration.sync.register('affordacalc-standard-sync');
} catch {
console.log("Background Sync failed.");
}
}
// Add an event listener for the `sync` event in the service worker.
self.addEventListener('sync', event => {
// Check for correct tag on the sync event.
if (event.tag === 'affordacalc-standard-sync') {
// Execute the desired behavior with waitUntil().
event.waitUntil(
syncOfflineData()
);
}
});