relnote(108): support for 'effective-directive' and 'status-code' in violation reports

files/en-us/mozilla/firefox/releases/108/index.md

@@ -39,6 +39,8 @@ No notable changes
   A server can use these to specify valid sources for stylesheet `<style>` elements and `<link>` elements with `rel="stylesheet"`, and for styles applied to individual elements, respectively ({{bug(1529338)}}).
 - [`Content-Security-Policy`](/en-US/docs/Web/HTTP/Headers/Content-Security-Policy) HTTP header directives [`script-src-elem`](/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src-elem) and [`script-src-attr`](/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src-attr) are now supported.
   A server can use these to specify valid sources for JavaScript `<script>` elements, and for inline script event handlers like `onclick`, respectively ({{bug(1529337)}}).
+- [`Content-Security-Policy`](/en-US/docs/Web/HTTP/Headers/Content-Security-Policy) violation reports now include `effective-directive` and `status-code` properties.
+  For more information, see [Violation report syntax](/en-US/docs/Web/HTTP/CSP#violation_report_syntax) ({{bug(1192684)}}).
 
 ### APIs
 

files/en-us/web/http/csp/index.md

@@ -32,6 +32,8 @@ Alternatively, the {{HTMLElement("meta")}} element can be used to configure a po
   content="default-src 'self'; img-src https://*; child-src 'none';" />
 ```
 
+> **Note:** Some features, such as sending CSP violation reports, are only available when using the HTTP headers.
+
 ## Threats
 
 ### Mitigating cross-site scripting
@@ -152,17 +154,17 @@ The policy specified in `Content-Security-Policy` headers is enforced while the
 
 ## Enabling reporting
 
-By default, violation reports aren't sent. To enable violation reporting, you need to specify the {{CSP("report-uri")}} policy directive, providing at least one URI to which to deliver the reports:
+By default, violation reports aren't sent. To enable violation reporting, you need to specify the {{CSP("report-to")}} policy directive, providing at least one URI to which to deliver the reports:
 
 ```http
-Content-Security-Policy: default-src 'self'; report-uri http://reportcollector.example.com/collector.cgi
+Content-Security-Policy: default-src 'self'; report-to http://reportcollector.example.com/collector.cgi
 ```
 
 Then you need to set up your server to receive the reports; it can store or process them in whatever manner you determine is appropriate.
 
 ## Violation report syntax
 
-The report JSON object contains the following data:
+The report JSON object is sent with an `application/csp-report` {{HTTPHeader("Content-Type")}} and contains the following data:
 
 - `blocked-uri`
   - : The URI of the resource that was blocked from loading by the Content Security Policy.
@@ -183,16 +185,16 @@ The report JSON object contains the following data:
     Only applicable to `script-src*` and `style-src*` violations, when they contain the `'report-sample'`
 - `status-code`
   - : The HTTP status code of the resource on which the global object was instantiated.
-- `violated-directive`
-  - : The name of the policy section that was violated.
+- `violated-directive` {{deprecated_inline}}
+  - : The directive whose enforcement caused the violation. The `violated-directive` is a historic name for the `effective-directive` field and contains the same value.
 
 ## Sample violation report
 
 Let's consider a page located at `http://example.com/signup.html`.
 It uses the following policy, disallowing everything but stylesheets from `cdn.example.com`.
 
 ```http
-Content-Security-Policy: default-src 'none'; style-src cdn.example.com; report-uri /_/csp-reports
+Content-Security-Policy: default-src 'none'; style-src cdn.example.com; report-to /_/csp-reports
 ```
 
 The HTML of `signup.html` looks like this:
@@ -217,11 +219,14 @@ A browser capable of enforcing CSP would send the following violation report as
 ```json
 {
   "csp-report": {
+    "blocked-uri": "http://example.com/css/style.css",
+    "disposition": "report",
     "document-uri": "http://example.com/signup.html",
+    "effective-directive": "style-src-elem",
+    "original-policy": "default-src 'none'; style-src cdn.example.com; report-to /_/csp-reports",
     "referrer": "",
-    "blocked-uri": "http://example.com/css/style.css",
-    "violated-directive": "style-src cdn.example.com",
-    "original-policy": "default-src 'none'; style-src cdn.example.com; report-uri /_/csp-reports"
+    "status-code": 200,
+    "violated-directive": "style-src-elem"
   }
 }
 ```

files/en-us/web/http/headers/content-security-policy-report-only/index.md

@@ -46,25 +46,25 @@ Content-Security-Policy-Report-Only: <policy-directive>; <policy-directive>
 
 The directives of the {{HTTPHeader("Content-Security-Policy")}} header can also be applied to `Content-Security-Policy-Report-Only`.
 
-The CSP {{CSP("report-uri")}} directive should be used with this header, otherwise this header will be an expensive no-op machine.
+The CSP {{CSP("report-to")}} directive should be used with this header, otherwise this header will be an expensive no-op machine.
 
 ## Examples
 
 This header reports violations that would have occurred. You can use this to iteratively work on your content security policy. You observe how your site behaves, watching for violation reports, or [malware redirects](https://secure.wphackedhelp.com/blog/wordpress-malware-redirect-hack-cleanup/), then choose the desired policy enforced by the {{HTTPHeader("Content-Security-Policy")}} header.
 
 ```http
-Content-Security-Policy-Report-Only: default-src https:; report-uri /csp-violation-report-endpoint/
+Content-Security-Policy-Report-Only: default-src https:; report-to /csp-violation-report-endpoint/
 ```
 
-If you still want to receive reporting, but also want to enforce a policy, use the {{HTTPHeader("Content-Security-Policy")}} header with the {{CSP("report-uri")}} directive.
+If you still want to receive reporting, but also want to enforce a policy, use the {{HTTPHeader("Content-Security-Policy")}} header with the {{CSP("report-to")}} directive.
 
 ```http
-Content-Security-Policy: default-src https:; report-uri /csp-violation-report-endpoint/
+Content-Security-Policy: default-src https:; report-to /csp-violation-report-endpoint/
 ```
 
 ## Violation report syntax
 
-The report JSON object contains the following data:
+The report JSON object is sent with an `application/csp-report` {{HTTPHeader("Content-Type")}} and contains the following data:
 
 - `blocked-uri`
   - : The URI of the resource that was blocked from loading by the Content Security Policy. If the blocked URI is from a different origin than the document-uri, then the blocked URI is truncated to contain just the scheme, host, and port.
@@ -83,14 +83,14 @@ The report JSON object contains the following data:
 - `status-code`
   - : The HTTP status code of the resource on which the global object was instantiated.
 - `violated-directive`
-  - : The name of the policy section that was violated.
+  - : The directive whose enforcement caused the violation. The `violated-directive` is a historic name for the `effective-directive` field and contains the same value.
 
 ## Sample violation report
 
 Let's consider a page located at `http://example.com/signup.html`. It uses the following policy, disallowing everything but stylesheets from `cdn.example.com`.
 
 ```http
-Content-Security-Policy-Report-Only: default-src 'none'; style-src cdn.example.com; report-uri /_/csp-reports
+Content-Security-Policy-Report-Only: default-src 'none'; style-src cdn.example.com; report-to /_/csp-reports
 ```
 
 The HTML of `signup.html` looks like this:
@@ -109,22 +109,24 @@ The HTML of `signup.html` looks like this:
 </html>
 ```
 
-Can you spot the violation? Stylesheets are only allowed to be loaded from `cdn.example.com`, yet the website tries to load one from its own origin (`http://example.com`). A browser capable of enforcing CSP will send the following violation report as a POST request to `http://example.com/_/csp-reports`, when the document is visited:
+Can you spot the violation? Stylesheets are only allowed to be loaded from `cdn.example.com`, yet the website tries to load one from its own origin (`http://example.com`). A browser capable of reporting CSP violations will send the following report as an HTTP `POST` request to `http://example.com/_/csp-reports`, when the document is visited:
 
 ```json
 {
   "csp-report": {
+    "blocked-uri": "http://example.com/css/style.css",
+    "disposition": "report",
     "document-uri": "http://example.com/signup.html",
+    "effective-directive": "style-src-elem",
+    "original-policy": "default-src 'none'; style-src cdn.example.com; report-to /_/csp-reports",
     "referrer": "",
-    "blocked-uri": "http://example.com/css/style.css",
-    "violated-directive": "style-src cdn.example.com",
-    "original-policy": "default-src 'none'; style-src cdn.example.com; report-uri /_/csp-reports",
-    "disposition": "report"
+    "status-code": 200,
+    "violated-directive": "style-src-elem"
   }
 }
 ```
 
-As you can see, the report includes the full path to the violating resource in `blocked-uri`. This is not always the case. For example, when the `signup.html` would attempt to load CSS from `http://anothercdn.example.com/stylesheet.css`, the browser would _not_ include the full path but only the origin (`http://anothercdn.example.com`). This is done to prevent leaking sensitive information about cross-origin resources.
+The report includes the full path to the violating resource in `blocked-uri` which may not always the case. For example, when the `signup.html` would attempt to load CSS from `http://anothercdn.example.com/stylesheet.css`, the browser would _not_ include the full path but only the origin (`http://anothercdn.example.com`). This is done to prevent leaking sensitive information about cross-origin resources.
 
 ## Specifications
 
@@ -137,4 +139,5 @@ As you can see, the report includes the full path to the violating resource in `
 ## See also
 
 - {{HTTPHeader("Content-Security-Policy")}}
-- CSP {{CSP("report-uri")}} directive
+- CSP {{CSP("report-to")}} directive
+- CSP {{CSP("report-uri")}} directive {{deprecated_inline}}