CSP

What is CSP?

Content Security Policy

Content Security Policy (CSP) is a browser security feature delivered as an HTTP response header. It tells the browser which origins can provide scripts, styles, images, and other resources for your page. When an attacker injects a malicious script, CSP blocks it from executing because the script did not come from an allowed origin.

In more detail

CSP is the browser-level backstop against XSS — the single most common web vulnerability. Without CSP, any successful script injection runs with full access to the page. With CSP, scripts only run from origins you explicitly allow, so an injected `<script src="evil.com/steal">` is blocked even if the injection succeeds.

A basic policy looks like `default-src 'self'; script-src 'self' https://cdn.example.com`. You build it up based on which third-party origins your site actually loads from.

Baseline CSP header
Content-Security-Policy: default-src 'self'; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline'; img-src 'self' data: https:; frame-ancestors 'none';

Why this matters

Why builders care

AI-generated apps often paste user input into pages without escaping, which creates XSS vulnerabilities. CSP is the cheapest single header you can ship that stops most of those attacks from succeeding — even if your code has the underlying bug.

FAQ

Frequently asked questions

Can I just use `default-src *`?
That would allow everything, which defeats the point. Start with `default-src 'self'` and add specific origins as you need them.
Does CSP work in all browsers?
Yes, all modern browsers since 2015. CSP 3 features (like nonces and strict-dynamic) are widely supported as of 2023+.

See where your site stands

Paste a URL, get a score in 60 seconds. Free, no signup.