CSPViolationReportBody: documentURL-Eigenschaft

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Die documentURL-Eigenschaft des CSPViolationReportBody-Interfaces ist eine schreibgeschützte Zeichenkette, die die URL des Dokuments oder Workers darstellt, das gegen die Content Security Policy (CSP) verstoßen hat.

Wert

Eine Zeichenkette, die die URL des Dokuments oder Workers enthält, das gegen die CSP verstoßen hat.

Beispiele

CSP Inline-Skript-Verstoß mit Referrer

Dieses Beispiel erzeugt einen CSP-Verstoß durch ein Inline-Skript und meldet den Verstoß unter Verwendung eines ReportingObserver. Wir navigieren von einer anderen Seite zu der Seite und protokollieren den referrer, die documentURL und die blockedURL.

HTML

Zuerst definieren wir unsere Referrer-Seite /bounce/index.html. Diese Seite enthält einfach 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, initial-scale=1.0" />
  </head>
  <body>
    <ul>
      <li><a href="../report_sample/">report sample</a></li>
    </ul>
  </body>
</html>

Die ../report_sample/index.html HTML-Datei ist unten definiert. Diese verwendet das <meta>-Element, um die Content-Security-Policy script-src-elem auf self zu setzen, was erlaubt, Skripte von derselben Domäne zu laden, aber Inline-Skripte nicht auszuführen. Das Dokument enthält auch ein Inline-Skript, das einen CSP-Verstoß 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 Beispiel lädt auch das externe Skript main.js, das unten gezeigt wird. Da es von derselben Domäne wie das HTML geladen wird, wird es nicht durch die CSP blockiert.

Das Skript erstellt einen neuen ReportingObserver, um Inhaltsverstoßberichte des Typs "csp-violation" zu beobachten. Jedes Mal, wenn die Callback-Funktion aufgerufen wird, erhalten wir den Körper des ersten Eintrags im Berichtsarray und verwenden ihn, um die Verstöße documentURL, referrer und blockedURL in der Konsole zu protokollieren.

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

observer.observe();

Beachten Sie, dass es mehrere Berichte im zurückgegebenen Array geben kann; der Kürze halber protokollieren wir jedoch nur die Werte des ersten Elements.

Ergebnisse

Die Konsolenausgabe für den obigen Code sieht etwa wie folgt aus (die Website 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 haben, documentURL die Seite ist, bei der es den CSP-Verstoß gab, und blockedURL in diesem Fall keine URL ist, sondern ein Hinweis darauf, dass der Verstoß durch ein Inline-Skript verursacht wurde.

Spezifikationen

Specification
Content Security Policy Level 3 # dom-cspviolationreportbody-documenturl

Browser-Kompatibilität

Siehe auch

SecurityPolicyViolationEvent.documentURI