How do I add a Content Security Policy on Vercel?

The recommended way to add CSP on Vercel with Next.js is through middleware.ts, which allows you to set the header dynamically on every request. You can also use the headers configuration in next.config.js for static CSP values or vercel.json for non-Next.js projects. A proper CSP should restrict script-src, style-src, img-src, and connect-src to only the domains your application needs. Using nonces for inline scripts is the most secure approach and requires middleware to generate a unique nonce per request. UNPWNED analyzes your CSP policy for weaknesses like unsafe-inline, unsafe-eval, or overly broad wildcard domains.