Content Security Policy (CSP) with Vue
CSP headers, nonce-based scripts, hash-based policies, Vite CSP configuration.
What is CSP
Content Security Policy is an HTTP response header that tells the browser which sources of scripts, styles, images, and connections are allowed. It is a strong second line of defense against XSS - even injected scripts are blocked if their source is not allowed.
The Header
CSP is delivered via the Content-Security-Policy response header. Each directive lists allowed sources for a resource type.
Content-Security-Policy: default-src 'self'; script-src 'self';All lessons in this course
- XSS Prevention in Vue
- Content Security Policy (CSP) with Vue
- CSRF Protection in Vue SPAs
- Secure Authentication Patterns