CSPViolationReport: documentURL-Eigenschaft

Baseline 2026

Neu verfügbar

Seit März 2026 funktioniert diese Funktion auf aktuellen Geräten und in aktuellen Browserversionen. Auf älteren Geräten oder in älteren Browsern funktioniert sie möglicherweise nicht.

Vollständige Kompatibilität anzeigen
Mehr erfahren

Die documentURL-Eigenschaft des CSPViolationReport-Wörterbuchs ist ein String, der die URL des Dokuments oder Workers darstellt, das die Content Security Policy (CSP) verletzt hat.

Wert

Ein String, der die URL des Dokuments oder Workers enthält, das die CSP verletzt hat.

Dieses Beispiel löst eine CSP-Verletzung mit einem Inline-Skript aus und meldet die Verletzung mit einem ReportingObserver. Wir navigieren von einer anderen Seite zur Seite und protokollieren den referrer, documentURL und blockedURL.

HTML

Zuerst definieren wir unsere Referrer-Seite /bounce/index.html. Diese Seite enthält lediglich einen Link zu einer anderen Seite ../report_sample/index.html.

html

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width" />
  </head>
  <body>
    <ul>
      <li><a href="../report_sample/">report sample</a></li>
    </ul>
  </body>
</html>

Die ../report_sample/index.html HTML-Datei wird unten definiert. Diese verwendet das <meta>-Element, um den Content-Security-Policy script-src-elem auf self zu setzen, was erlaubt, Skripte von derselben Domain zu laden, aber nicht erlaubt, Inline-Skripte auszuführen. Das Dokument enthält auch ein Inline-Skript, das eine CSP-Verletzung auslösen wird.

html

<!doctype html>
<!-- /report_sample/index.html -->
<html lang="en">
  <head>
    <meta
      http-equiv="Content-Security-Policy"
      content="script-src-elem 'self' 'report-sample'" />
    <script src="main.js"></script>
  </head>
  <body>
    <script>
      const int = 4;
    </script>
  </body>
</html>

JavaScript (main.js)

Das obige Berichtsmuster lädt auch das externe Skript main.js, das unten gezeigt wird. Da dies von derselben Domain wie das HTML geladen wird, wird es durch die CSP nicht blockiert.

Das Skript erstellt einen neuen ReportingObserver, um Inhaltsverletzungsberichte des Typs "csp-violation" zu beobachten. Jedes Mal, wenn die Callback-Funktion aufgerufen wird, erhalten wir den Rumpf des ersten Eintrags des Berichtsarrays und verwenden ihn, um die Verletzung documentURL, referrer und blockedURL in der Konsole zu protokollieren.

// main.js
const observer = new ReportingObserver(
  (reports, observer) => {
    console.log(`documentURL: ${reports[0].body.documentURL}`);
    console.log(`referrer: ${reports[0].body.referrer}`);
    console.log(`blockedURL: ${reports[0].body.blockedURL}`);
  },
  {
    types: ["csp-violation"],
    buffered: true,
  },
);

observer.observe();

Beachten Sie, dass, obwohl es möglicherweise mehrere Berichte im zurückgegebenen Array gibt, aus Gründen der Kürze nur die Werte des ersten Elements protokolliert werden.

Ergebnisse

Die Konsolenausgabe für den obigen Code könnte in etwa so aussehen (die Seite hängt davon ab, wie die Seiten bereitgestellt werden):

documentURL: http://127.0.0.1:9999/report_sample/
referrer: http://127.0.0.1:9999/bounce/
blockedURL: inline

Beachten Sie, dass referrer die Seite ist, von der wir navigiert sind, documentURL die Seite mit der CSP-Verletzung ist und blockedURL in diesem Fall keine URL ist, sondern ein Hinweis darauf, dass die Verletzung durch ein Inline-Skript verursacht wurde.