Start · Sprachen · JavaScript · Referenz · CrashReport

CrashReport

Schnittstelle

Das Dictionary <code>CrashReport</code> der Reporting API beschreibt einen Absturzbericht, den der Browser nach einem Absturz einer Seite an einen Endpunkt auf dem Server schickt.

seit JavaScript Experimentell: nur Chromium-basierte Browser (Chro Kategorie: webapi

Signatur

interface CrashReport

Beschreibung

CrashReport ist ein Dictionary der Reporting API. Es beschreibt einen Bericht vom Typ "crash". Der Browser erzeugt ihn, wenn ein Dokument abstürzt, etwa weil der Arbeitsspeicher voll ist (out of memory) oder weil die Seite nicht mehr reagiert (unresponsive). So erfahren Sie von Abstürzen bei echten Nutzern, die Sie sonst nie bemerken würden.

Anders als Berichte zu Deprecations oder Interventions lässt sich ein Absturzbericht nicht mit einem ReportingObserver in der Seite lesen. Wenn die Seite abgestürzt ist, läuft dort kein JavaScript mehr. Der Browser schickt den Bericht deshalb später per HTTP-POST an einen Endpunkt, den der Server vorher im Antwort-Header Reporting-Endpoints festgelegt hat. Der Content-Type ist dabei application/reports+json.

Ein Absturzbericht hat diese Felder:

  • type: immer "crash"
  • url: URL des abgestürzten Dokuments
  • age: Millisekunden zwischen dem Absturz und dem Versand
  • user_agent: User-Agent-String des Browsers
  • body: ein CrashReportBody mit Angaben wie reason ("oom" oder "unresponsive") und, je nach Browser-Version, weiteren Feldern wie is_top_level, visibility_state oder stack (JS-Aufrufstapel, nur mit Document-Policy include-js-call-stacks-in-crash-reports)

Absturzberichte gehen an den Endpunkt mit dem Namen default. Neuere Chrome-Versionen nehmen stattdessen einen Endpunkt namens crash-reporting, wenn er definiert ist. Absturzberichte sind vor allem für Monitoring, Qualitätssicherung und das Finden von Speicherlecks bei großen Web-Apps nützlich.

Parameter

Name Typ Default Beschreibung
$type Pflicht "crash" Art des Berichts. Bei Absturzberichten immer "crash".
$url Pflicht string URL des Dokuments, das abgestürzt ist.
$age number Zeit in Millisekunden zwischen dem Absturz und dem Versand des Berichts. Das Feld gibt es nur im gesendeten JSON.
$user_agent string User-Agent-String des Browsers, der den Bericht erzeugt hat.
$body Pflicht CrashReportBody Details zum Absturz, z. B. reason ("oom" | "unresponsive"). Optional kommen stack, is_top_level und visibility_state hinzu.

Rückgabewert

Typ
CrashReport
Beschreibung
Ein Berichtsobjekt, das der Browser als Teil eines JSON-Arrays an den festgelegten Endpunkt schickt. Im Seiten-JavaScript bekommen Sie es nicht.

Beispiele

Reporting-Endpunkt per Header festlegen (Node.js/Express)

import express from 'express';

const app = express();

// Jede HTML-Antwort legt fest, wohin Absturzberichte gehen
app.use((req, res, next) => {
  res.set(
    'Reporting-Endpoints',
    'default="https://example.com/reports", crash-reporting="https://example.com/reports/crash"'
  );
  // Optional: JS-Aufrufstapel bei hängenden Seiten mitschicken (Chromium)
  res.set('Document-Policy', 'include-js-call-stacks-in-crash-reports');
  next();
});

app.get('/', (req, res) => res.send('<h1>Hallo Welt</h1>'));
app.listen(3000, () => console.log('Server läuft auf Port 3000'));
Server läuft auf Port 3000

Absturzberichte auf dem Server empfangen und auswerten

import express from 'express';

const app = express();

// Berichte kommen als application/reports+json
app.use(express.json({ type: ['application/json', 'application/reports+json'] }));

app.post('/reports/crash', (req, res) => {
  const reports = Array.isArray(req.body) ? req.body : [req.body];

  for (const report of reports) {
    if (report.type !== 'crash') continue;
    const { reason = 'unbekannt', stack } = report.body ?? {};
    console.log(`Absturz auf ${report.url}: ${reason} (vor ${report.age} ms)`);
    if (stack) console.log('Aufrufstapel:', stack);
  }

  res.sendStatus(204);
});

app.listen(3000);
Absturz auf https://example.com/editor: oom (vor 1532 ms)

Beispiel-Nutzlast eines CrashReport typisiert verarbeiten

// So sieht ein gesendeter Bericht aus
const payload = [
  {
    type: 'crash',
    age: 42,
    url: 'https://example.com/dashboard',
    user_agent: 'Mozilla/5.0 (X11; Linux x86_64) Chrome/126.0',
    body: { reason: 'unresponsive', is_top_level: true, visibility_state: 'visible' }
  }
];

const summarize = (reports) =>
  reports
    .filter((r) => r.type === 'crash')
    .reduce((acc, { body }) => {
      const key = body?.reason ?? 'unbekannt';
      acc[key] = (acc[key] ?? 0) + 1;
      return acc;
    }, {});

console.log(summarize(payload));
{ unresponsive: 1 }

// Wichtig · Fallstricke

Kein ReportingObserver: Absturzberichte gehen nie an einen ReportingObserver. Sie kommen nur über HTTP an einen Endpunkt. new ReportingObserver(cb, { types: ['crash'] }) liefert deshalb nichts.

Kompatibilität: Die Funktion ist experimentell und nur in Chromium-basierten Browsern umgesetzt. Firefox und Safari schicken keine Absturzberichte. Welche Felder in body stehen (stack, is_top_level, visibility_state), hängt von der Browser-Version ab. Werten Sie diese Felder defensiv aus.

Endpunkt-Anforderungen: Die Endpunkt-URL muss HTTPS nutzen. Liegt sie auf einer anderen Origin, muss der Server CORS-Preflight-Anfragen (OPTIONS) beantworten. Der Browser versendet Berichte gebündelt und mit Verzögerung, manchmal erst beim nächsten Start.

Datenschutz und Sicherheit: Berichte können URLs mit Query-Parametern und Aufrufstapel enthalten. Speichern Sie keine sensiblen Daten ungefiltert. Prüfen Sie eingehende Daten auf dem Server, denn jeder kann an den Endpunkt posten.

Der ältere Header Report-To ist veraltet. Nutzen Sie Reporting-Endpoints.