sendBeacon 数据上报与容错实践

概述sendBeacon 可在页面卸载时可靠发送数据。本文给出能力检测、统一上报封装与降级策略。能力检测与封装const supportsBeacon = !!navigator.sendBeacon; function sendBeaconJSON(url, payload) { const data = new Blob([JSON.stringify(payload)], { type: 'application/json' }); if (supportsBeacon) return navigator.sendBeacon(url, data); return fetch(url, { method: 'POST', body: data, headers: { 'Content-Type': 'application/json' }, keepalive: true }).then(() => true).catch(() => false); } 页面卸载场景集成addEventListener('pagehide', () => { sendBeaconJSON('/metrics', { ts: Date.now(), event: 'pagehide' }); });