CSPViolationReport.statusCode — Eigenschaft · JavaScript-Referenz

Signatur

CSPViolationReport.statusCode

Beschreibung

Die Eigenschaft statusCode gehört zum Dictionary CSPViolationReport. Dieses steckt im Feld body eines Report-Objekts vom Typ "csp-violation". Sie enthält den HTTP-Statuscode der Antwort, mit der das Dokument (Fenster) oder der Worker ausgeliefert wurde, dessen Content Security Policy verletzt wurde. Der Wert ist z. B. 200, 404 oder 500.

Nützlich ist das vor allem beim Auswerten von CSP-Berichten: Du kannst Verletzungen auf regulären Seiten (200) von solchen auf Fehlerseiten (404, 500) unterscheiden. Fehlerseiten nutzen oft eigene Vorlagen, Tracking-Skripte oder Inline-Styles und verursachen deshalb viele Berichte, die mit der eigentlichen Anwendung nichts zu tun haben. So kannst du solche Berichte filtern oder gezielt beheben.

Auf die Berichte kommst du auf zwei Wegen: im Browser über einen ReportingObserver mit types: ["csp-violation"] oder auf dem Server über einen Endpunkt, den der Header Reporting-Endpoints zusammen mit der CSP-Direktive report-to festlegt. Im zweiten Fall schickt der Browser die Berichte als JSON (application/reports+json), und statusCode steht unter body.statusCode.

Rückgabewert

Typ

number

Beschreibung

Der HTTP-Statuscode der Antwort des Dokuments oder Workers, in dem die Verletzung aufgetreten ist, als ganze Zahl (z. B. 200). Bei Dokumenten, die nicht über HTTP geladen wurden (z. B. about:blank, data:-URLs), ist der Wert 0.

Beispiele

CSP-Verletzungen im Browser mit ReportingObserver beobachten

// Beobachtet CSP-Verletzungen des aktuellen Dokuments
const observer = new ReportingObserver((reports) => {
  for (const report of reports) {
    const { statusCode, effectiveDirective, blockedURL } = report.body;
    console.log(`Status ${statusCode}: ${effectiveDirective} blockiert ${blockedURL}`);
  }
}, { types: ["csp-violation"], buffered: true });

observer.observe();

// Verletzung provozieren (bei CSP "img-src 'self'")
const img = new Image();
img.src = "https://tracker.example.com/pixel.gif";

Status 200: img-src blockiert https://tracker.example.com/pixel.gif

Berichte von Fehlerseiten auf dem Server herausfiltern (Node.js/Express)

import express from "express";

const app = express();

// CSP und Endpunkt für Berichte festlegen
app.use((req, res, next) => {
  res.set("Reporting-Endpoints", 'csp-endpoint="/csp-reports"');
  res.set("Content-Security-Policy", "script-src 'self'; report-to csp-endpoint");
  next();
});

app.post("/csp-reports", express.json({ type: "application/reports+json" }), (req, res) => {
  const reports = Array.isArray(req.body) ? req.body : [];
  for (const { type, body } of reports) {
    if (type !== "csp-violation") continue;
    // Verletzungen auf Fehlerseiten getrennt protokollieren
    if (body.statusCode >= 400) {
      console.warn(`[Fehlerseite ${body.statusCode}] ${body.documentURL}`);
    } else {
      console.log(`[CSP] ${body.effectiveDirective} -> ${body.blockedURL}`);
    }
  }
  res.sendStatus(204);
});

app.listen(3000);

[Fehlerseite 404] https://example.com/gibt-es-nicht

Berichte nach Statuscode gruppieren

const counts = new Map();

const observer = new ReportingObserver((reports) => {
  for (const { body } of reports) {
    counts.set(body.statusCode, (counts.get(body.statusCode) ?? 0) + 1);
  }
  console.log(Object.fromEntries(counts));
}, { types: ["csp-violation"] });

observer.observe();

{ "200": 3 }

// Wichtig · Fallstricke

Nicht der Status der blockierten Ressource: statusCode gehört zum Dokument bzw. Worker, in dem die Richtlinie gilt, und nicht zum blockierten Skript oder Bild. Blockierte Ressourcen werden gar nicht erst geladen und haben deshalb keinen Statuscode.
Wert 0: Tritt bei Dokumenten auf, die nicht über HTTP(S) geladen wurden, z. B. about:blank-iframes, data:- oder blob:-Inhalte. Diese Fälle solltest du bei der Auswertung berücksichtigen.
Altes Berichtsformat: Die veraltete Direktive report-uri schickt Berichte als application/csp-report, und dort heißt das Feld "status-code" (mit Bindestrich) unter "csp-report". Nur die Reporting API (report-to) verwendet body.statusCode. Wenn du beide Formate empfangen willst, muss dein Server beide Schreibweisen verarbeiten.
Browser-Kompatibilität: ReportingObserver und report-to werden in Chromium-basierten Browsern vollständig unterstützt, in Firefox und Safari aber nur teilweise oder erst in neueren Versionen. Prüfe vorher mit "ReportingObserver" in globalThis. Als Alternative bietet sich das Ereignis securitypolicyviolation an, das ebenfalls eine statusCode-Eigenschaft hat.
Datenschutz: Berichte können URLs mit Abfrageparametern enthalten. Speichere sie auf dem Server daher nur gekürzt oder anonymisiert.

Siehe auch

CSPViolationReport.effectiveDirective CSPViolationReport.sample CSPViolationReport.sourceFile CSPViolationReport.blockedURL CSPViolationReport.disposition