CSP Header Generator
Build Content-Security-Policy headers visually.
default-srcFallback for other directives
script-srcJavaScript sources
style-srcCSS sources
img-srcImage sources
font-srcFont sources
connect-srcXHR, WebSocket, fetch
media-srcAudio/video sources
object-srcPlugins (Flash, etc.)
frame-srciframe sources
base-uriBase element URLs
form-actionForm submission URLs
frame-ancestorsWho can embed this page
Content-Security-Policy: default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' data:; object-src 'none'
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' data:; object-src 'none'">
CSP Header Generator — What It Does
Key CSP Directives
CSP Deployment Strategy
Common Mistakes
Frequently Asked Questions
- What is Content-Security-Policy (CSP)?
- CSP is an HTTP response header that tells browsers which sources of content (scripts, styles, images, fonts, etc.) are allowed to load on a page. It is one of the most effective defenses against Cross-Site Scripting (XSS) attacks because it prevents execution of scripts from unauthorized origins.
- What does default-src do?
- default-src is the fallback directive. If a more specific directive (like script-src or style-src) is not defined, the browser uses the default-src value for that resource type. Setting default-src to 'self' and then overriding specific directives is a common pattern.
- Why does my page break after adding CSP?
- CSP blocks any resource not explicitly allowed. Common issues: inline scripts blocked (need 'unsafe-inline' or a nonce/hash), third-party scripts like Google Analytics blocked (add their domain to script-src), inline styles blocked (add 'unsafe-inline' to style-src or use nonces), and fonts from CDNs blocked (add the CDN to font-src).
- What is the difference between a nonce and a hash in CSP?
- A nonce is a random token generated per request and added to both the CSP header and the script tag. A hash is the SHA-256/384/512 digest of the script content. Nonces are easier for dynamic pages; hashes are better for static, known inline scripts.
- Should I use Content-Security-Policy or Content-Security-Policy-Report-Only?
- Start with Report-Only — it logs violations without blocking anything, so you can see what would break. Once your policy is clean, switch to the enforcing Content-Security-Policy header. You can use both simultaneously: enforce a baseline and report-only a stricter policy.