How to add a Content-Security-Policy (and avoid unsafe-inline)

Lock down which scripts can run so a single injection can't take over your page.

What it is

Content-Security-Policy is a response header that whitelists the sources a browser may load scripts, styles, and other resources from.

Why it matters

CSP is the main defense against cross-site scripting (XSS). Without it — or with a script policy that allows `unsafe-inline`/`unsafe-eval` — an injected script runs with full access to your page and users' sessions.

How to fix it

1. 1Start in report-only mode: `Content-Security-Policy-Report-Only` with a `report-uri`/`report-to` to see what would break.
2. 2Set a strict script policy: `script-src 'self'` plus specific trusted hosts; avoid `unsafe-inline` and `unsafe-eval` for scripts.
3. 3For frameworks that need inline scripts, use per-request nonces (`'nonce-...'`) or hashes plus `'strict-dynamic'` rather than `unsafe-inline`.
4. 4Add `object-src 'none'`, `base-uri 'self'`, and `frame-ancestors 'none'` (or your allowed embedders).
5. 5Move from report-only to enforcing once the reports are clean, then re-scan.