Essential CSP Directives
CSP directives control different types of content. Here are the most important ones you need to understand.
default-src
default-src 'self';The fallback directive for all other directives. If a specific directive isn't defined, the browser uses this one.
script-src
script-src 'self' 'nonce-{random}' https://trusted-cdn.com;Controls which JavaScript sources can be executed. This is one of the most important directives for preventing XSS.
style-src
style-src 'self' 'nonce-{random}' https://fonts.googleapis.com;Controls which CSS sources can be applied to your page.
img-src
img-src 'self' data: https:;Controls which image sources are allowed.