`title: 前端日志采集与批量持久化方案``categories: Web 开发/前端/数据管理``keywords: 日志,采集,批量,IndexedDB,Service Worker,Background Sync``description: 设计前端日志采集与批量持久化方案,使用 IndexedDB 存队列并由 Service Worker 批量上报,保障在线与离线可靠。`采集与入队function openLogDB() { return new Promise((resolve, reject) => { const req = indexedDB.open('log-db', 1); req.onupgradeneeded = () => { const db = req.result; if (!db.objectStoreNames.contains('logs')) db.createObjectStore('logs', { keyPath: 'id' }); }; req.onsuccess = () => resolve(req.result); req.onerror = () => reject(req.error); }); } async function enqueueLog(db, entry) { return new Promise((resolve, reject) => { const tx = db.transaction('logs', 'readwrite'); tx.objectStore('logs').put(entry); tx.oncomplete = () => resolve(); tx.onerror = () => reject(tx.error); }); } 批量上报使用 Background Sync 或前端定时器批量取出与上报;失败重试并保留最近窗口。

发表评论 取消回复