CSP Header Builder

Content-Security-Policy (CSP) is an HTTP response header that tells the browser which origins a page is allowed to load JavaScript, CSS and images from. Anything from an origin you did not declare is blocked by the browser. A script an attacker injects into the page will not run if its origin is not allowed. You write a directive name followed by space separated sources, as in default-src 'self', and separate directives with ;.

Keywords such as 'self', 'none' and 'unsafe-inline' are a single token including the single quotes. Drop the quotes and the value is read as a host name instead, which is not what you meant. This tool repairs bare input like self into 'self' for you. Scheme sources such as https:, data: and blob:, and host sources such as https://cdn.example.com, take no quotes.

default-src is the fallback for the fetch directives. Leave script-src out and default-src applies instead. But not everything falls back to it: base-uri, form-action and frame-ancestors do not inherit from default-src, so you have to write them out. This tool warns when any of those three is empty.

When a directive carries a nonce ('nonce-xxxx'), the browser ignores 'unsafe-inline' in that directive. The specification says so, which means adding a nonce silently disables the 'unsafe-inline' you kept for older browsers. That is the intended design, and it is also a common way to accidentally block every inline script on a page. A nonce has to change on every request, so this tool emits a {NONCE} placeholder. Replace it with a fresh random value server side and put the same value in <script nonce="...">.

Start in report only mode. Served as Content-Security-Policy-Report-Only, violations are reported but nothing is blocked. Watch real traffic to see what would break, then switch to the enforcing header. The "Report only" checkbox in this tool emits that form.

Prefer the HTTP header. Most directives do work through <meta http-equiv>, but frame-ancestors, report-uri and sandbox do not. A meta tag also only takes effect once HTML parsing reaches it, so anything loaded before that is not covered. Treat it as the fallback for environments where you cannot set headers.

No. Everything from input to assembly and copying runs inside your browser in JavaScript. Nothing you type is sent to a server.