EventSource SSE 数据同步与断线重连实践

概述SSE 提供只读推送通道。本文给出连接与持久化示例。连接与持久化function openDB(name) { return new Promise((resolve, reject) => { const r = indexedDB.open(name, 1); r.onupgradeneeded = () => { const db = r.result; if (!db.objectStoreNames.contains('sse')) db.createObjectStore('sse', { autoIncrement: true }); }; r.onsuccess = () => resolve(r.result); r.onerror = () => reject(r.error); }); }

function connectSSE(url) {

const es = new EventSource(url);

es.onmessage = async e => { const db = await openDB('sse'); const tx = db.transaction('sse','readwrite'); tx.objectStore('sse').add({ data: e.data, ts: Date.now() }); await new Promise((res, rej) => { tx.oncomplete = res; tx.onerror = () => rej(tx.error); }); db.close(); };

es.onerror = () => setTimeout(() => connectSSE(url), 3000);

return es;

}