Signatur
Beschreibung
takeRecords() liefert die Berichte (Report-Objekte), die der Observer schon gesammelt, aber noch nicht an seine Callback-Funktion übergeben hat. Danach ist die interne Warteschlange leer. Der Callback bekommt diese Berichte also nicht mehr zu sehen.
Gebraucht wird die Methode vor allem, bevor man einen Observer mit disconnect() trennt. Der Callback wird asynchron und gebündelt aufgerufen. Wer direkt trennt, verliert Berichte, die noch in der Warteschlange liegen. Deshalb holt man sie vorher mit takeRecords() ab und verarbeitet sie selbst, zum Beispiel beim Verlassen der Seite im pagehide- oder visibilitychange-Handler.
Jeder Bericht hat die Eigenschaften type (z. B. "deprecation", "intervention", "crash"), url und body. Welche Felder body enthält, hängt vom Typ ab, etwa id, message, sourceFile und lineNumber.
Rückgabewert
[] zurück.Beispiele
Übrige Berichte vor disconnect() abholen
const observer = new ReportingObserver((reports) => {
reports.forEach((r) => console.log('Callback:', r.type, r.body?.message));
}, { types: ['deprecation', 'intervention'], buffered: true });
observer.observe();
// Später: Überwachung beenden, ohne Berichte zu verlieren
const rest = observer.takeRecords();
console.log(`Noch ${rest.length} Bericht(e) in der Warteschlange`);
rest.forEach((r) => console.log('Rest:', r.type, r.url));
observer.disconnect();Berichte beim Verlassen der Seite an den Server senden
const sammlung = [];
const observer = new ReportingObserver((reports) => {
sammlung.push(...reports.map((r) => r.toJSON()));
}, { buffered: true });
observer.observe();
document.addEventListener('visibilitychange', () => {
if (document.visibilityState !== 'hidden') return;
// Berichte übernehmen, die noch nicht beim Callback angekommen sind
sammlung.push(...observer.takeRecords().map((r) => r.toJSON()));
if (sammlung.length > 0) {
navigator.sendBeacon('/api/reports', JSON.stringify(sammlung));
sammlung.length = 0;
}
});Die Warteschlange ist nach dem Aufruf leer
const observer = new ReportingObserver(() => {}, { buffered: true });
observer.observe();
const erste = observer.takeRecords();
const zweite = observer.takeRecords();
console.log(Array.isArray(erste), zweite.length);// Wichtig · Fallstricke
- Leert die Warteschlange: Berichte, die
takeRecords()zurückgibt, erreichen den Callback nicht mehr. Man muss sie selbst verarbeiten. - Nur ausstehende Berichte: Berichte, die schon an den Callback gegangen sind, gibt die Methode nicht noch einmal zurück.
- Feature-Erkennung: Vor der Nutzung mit
if ('ReportingObserver' in window)prüfen. Die Browser unterstützen die API unterschiedlich stark. Chromium-Browser haben sie am vollständigsten, in Firefox und Safari kommen nicht alle Berichtstypen (z. B.intervention) an. - Serialisieren:
Report-Objekte lassen sich nicht direkt verschicken. Vor dem Versand mitreport.toJSON()oderJSON.stringify()umwandeln. - In Workern und auf Seiten mit Cross-Origin-Isolation stehen je nach Browser nur bestimmte Berichtstypen zur Verfügung.