What it is
Content-Security-Policy (CSP) is a response header that tells the browser which sources of scripts, styles, images, and other resources are allowed to load. It reduces the impact of XSS and data injection by restricting where content can come from.
Why it matters
Without CSP, a single XSS or injected script can load and run any code. CSP limits the damage by blocking unauthorized scripts and inline code. A well-configured CSP is a strong defense-in-depth measure.
How it is exploited
An attacker finds a reflected XSS in your search box and injects a script tag pointing to attacker.example/payload.js. Without CSP the browser fetches and runs it, so the payload reads document.cookie and posts the session token to the attacker's collector. A correct script-src would refuse the off-origin load and the inline injection.
How to fix it
- Start with report-only (optional). Use Content-Security-Policy-Report-Only first to see what would be blocked without enforcing. Fix violations, then switch to enforcing CSP.
- Set default-src. default-src defines the fallback for most directives. Use 'self' to allow same-origin only, and add specific sources for scripts, styles, and images as needed.
- Restrict script-src. script-src controls where JavaScript can load from. Avoid 'unsafe-inline' and 'unsafe-eval' when possible; use nonces or hashes for inline scripts.
- Add frame-ancestors for clickjacking. frame-ancestors limits who can embed your site in an iframe. Use 'none' or 'self' to prevent clickjacking.
- Tighten beyond the baseline. style-src 'unsafe-inline' is a frequent finding in scanners; remove it once you have hashed or nonced your inline styles. Replace 'unsafe-inline' with nonces or hashes for any remaining inline styles. This is the most common scanner finding once default-src is in place.
- Deploy and verify. Deploy the header, test your site, and run a CSP checker or Barrion security scan to confirm the policy is present and effective.
Examples by platform
Nginx
add_header Content-Security-Policy "default-src 'self'; script-src 'self'; style-src 'self'; img-src 'self' data: https:; object-src 'none'; base-uri 'self'; frame-ancestors 'none'; upgrade-insecure-requests;" always;Apache
Header set Content-Security-Policy "default-src 'self'; script-src 'self'; style-src 'self'; img-src 'self' data: https:; object-src 'none'; base-uri 'self'; frame-ancestors 'none'; upgrade-insecure-requests;"Next.js (nonce + strict-dynamic)
// middleware.ts
import { NextResponse } from 'next/server';
import crypto from 'crypto';
export function middleware() {
const nonce = crypto.randomBytes(16).toString('base64');
const csp = `default-src 'self'; script-src 'self' 'nonce-${nonce}' 'strict-dynamic'; style-src 'self'; img-src 'self' data: https:; object-src 'none'; base-uri 'self'; frame-ancestors 'none'; upgrade-insecure-requests;`;
const res = NextResponse.next();
res.headers.set('Content-Security-Policy', csp);
res.headers.set('x-nonce', nonce);
return res;
}How to verify the fix
Confirm the Content-Security-Policy header is present in HTTPS responses:
curl -sI https://example.com | grep -i content-security-policy