HTML Content Security Policy 内容安全策略

CSP内容安全策略：Content-Security-Policy HTTP头/default-src/script-src/style-src/img-src策略指令、nonce/hash随机数白名单、strict-dynamic、report-uri/report-to违规报告 · 难度：入门 · +10XP

HTML Content Security Policy —— 给网页加一层安全防护

假设你的网页被黑客注入了恶意script标签，CSP（内容安全策略）就是最后一道防线。

通过meta标签设置CSP

<meta http-equiv="Content-Security-Policy"
      content="default-src 'self';
               script-src 'self' https://cdn.example.com;
               style-src 'self' 'unsafe-inline';
               img-src 'self' data: https:">

常用指令

'self' = 只允许自己域名；'none' = 完全禁止。

动手练习

1. 基础练习：给页面加CSP meta标签，设置script-src 'self'，尝试注入script看是否拦截。
2. 进阶应用：用CSP的report-uri指令配置违规报告。
3. 项目实战：给一个使用Google Analytics和CDN的页面配置完整CSP策略。