CSP generator
Build a Content-Security-Policy from directives and source lists, get the response header, the report-only variant and the meta tag, with strict / relaxed / report-only presets plus warnings for unsafe-inline, unsafe-eval and wildcards.
Runs in your browserEvery computation happens in your browser — your data never leaves this device.
Preset and output format
Directive order, source grammar and the directives a meta tag ignores follow W3C CSP Level 3 and the MDN reference. The page makes no network requests.
Directives
Tick the directives to emit and separate multiple sources with spaces. 'none' must stand alone, and report-uri / report-to take a URL or a path starting with /.
Result
Content-Security-Policy: default-src 'self'; script-src 'self'; style-src 'self'; img-src 'self' data:; font-src 'self'; connect-src 'self'; media-src 'self'; object-src 'none'; frame-src 'self'; frame-ancestors 'self'; base-uri 'self'; form-action 'self'; manifest-src 'self'; worker-src 'self'; upgrade-insecure-requests
32215<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; style-src 'self'; img-src 'self' data:; font-src 'self'; connect-src 'self'; media-src 'self'; object-src 'none'; frame-src 'self'; base-uri 'self'; form-action 'self'; manifest-src 'self'; worker-src 'self'; upgrade-insecure-requests">
No 'unsafe-inline', 'unsafe-eval' or wildcard found.
What this tool does
- Add a security header without hand-writing a long directive list: tick default-src, script-src and friends, pick sources from the quick chips and copy the finished Content-Security-Policy value.
- Debug a page that broke after adding CSP: switch to report-only mode so the browser reports violations without blocking, point report-uri at your collector, then enforce once the reports are clean.
- Produce a meta http-equiv="Content-Security-Policy" tag for static sites that cannot set response headers — directives a meta tag ignores are removed for you.
- Review someone else's policy: paste the sources and check for unsafe-inline, unsafe-eval or wildcards that quietly cancel the protection.
Example
Input
Pick the "Strict" preset (default-src 'self', script-src 'self', style-src 'self', img-src 'self' data:, object-src 'none', upgrade-insecure-requests and more)
Output
default-src 'self'; script-src 'self'; style-src 'self'; img-src 'self' data:; font-src 'self'; connect-src 'self'; media-src 'self'; object-src 'none'; frame-src 'self'; frame-ancestors 'self'; base-uri 'self'; form-action 'self'; manifest-src 'self'; worker-src 'self'; upgrade-insecure-requests
The strict preset emits 15 directives. In the meta tag format frame-ancestors is dropped, because browsers ignore that directive inside a meta element, leaving 14.
Frequently asked questions
My page went blank after adding CSP — where do I start?
Switch to report-only mode first: the policy is identical but it travels in a Content-Security-Policy-Report-Only header, so the browser reports violations instead of blocking them and the site keeps working. Point report-uri at your collector, add the blocked origins to the allowlist, then enforce.
Why is unsafe-inline considered so bad?
unsafe-inline lets inline scripts run, and injected XSS payloads are exactly that, so you give away the most valuable part of CSP. If you truly need inline code, allow it with a nonce-… or sha256-… source: only script tags carrying the right nonce execute, and an injected script cannot guess the random value.
What is the difference between a meta tag and a response header?
The meta form is for static sites that cannot set headers, and browsers ignore frame-ancestors, sandbox, report-uri and report-to when they appear in a meta element (this tool strips them and tells you). The meta policy also takes effect later in the parsing pipeline, so some preloaded resources may already be on the wire — prefer the header when you control it.
Should I use report-uri or report-to?
report-uri is the older form: it takes a URL that receives a POST, and every browser supports it. report-to is the CSP3 replacement and needs a matching Report-To group, but it can carry richer fields. Writing both is fine — older browsers use report-uri while newer ones prefer report-to.
Does default-src conflict with script-src?
No. default-src is only the fallback for directives you did not specify, so once script-src is present it fully governs scripts and default-src no longer applies to them. The usual pattern is a tight default-src plus explicit loosening per directive.
Keywords：cspcontent security policycsp generatorsecurity headerunsafe-inlinexssCSP 生成内容安全策略安全响应头跨站脚本指令来源白名单