Content Security Policy for beginners
A Content Security Policy (CSP) is a response header that tells the browser which sources of scripts, styles, images and connections your site allows. If an attacker manages to inject a script, the CSP can stop it from running.
Start in report-only mode
A strict policy can break your site, so begin with a header that only reports:
Content-Security-Policy-Report-Only: default-src 'self'; img-src 'self' data: https:; style-src 'self' 'unsafe-inline'Open your site with DevTools → Console. Each violation tells you which source it would have blocked.
Allow what you actually use
Add the domains you rely on, such as your analytics, fonts, payment provider and API:
script-src 'self' https://js.stripe.com;
connect-src 'self' https://api.yourbackend.com;
font-src https://fonts.gstatic.com;Then enforce it
Once the console is clean, rename the header to Content-Security-Policy. Add frame-ancestors 'none' to also block clickjacking.