Content Security Policy
是什么？
Content Security Policy (CSP) 是一个 HTTP 响应头，用来告诉现代浏览器允许加载的动态资源（js、css、图片等）。
为什么？
CSP 最初是为了防止 Cross Site Scripting (XSS) 攻击，后来也用来防止 Clickjacking （点击劫持）。
XSS 攻击：跨站脚本攻击，恶意代码混入用户访问的页面中，浏览器无法区分导致恶意代码被执行。
Clickjacking：点击劫持，用户访问页面中注入不可视元素，当用户点击页面时，触发恶意代码。
CSP 通过控制当前页面上可执行、加载的资源源来阻止以上攻击方式。
怎么设置？
CSP 有两种设置方式：
- HTML 的
<meta />标签设置 - HTTP 响应 header 中设置
Content-Security-Policy: ...
设置规则
CSP 规则由一个或多个指令（directives）构成，指令之间用 ;分隔。
常见指令与含义
| 指令 | 含义 | 备注 |
|---|---|---|
| default-src | 默认指令，其他指令的 fallback | base-uri |
| form-action | ||
| frame-ancestors | ||
| report-uri | ||
| sandbox | ||
| 这些指令不会 fallback | ||
| script-src | 可用的 js 资源 | |
| style-src | 可用的 css 资源 | |
| img-src | 可用的图片资源 | |
| content-src | 可用的 XMLHttpRequest、WebSocket、fetch、<a ping>、EventSource请求 |
如果不被允许，HTTP code 为 400 |
| font-src | 字体资源，通过 @font-face加载的 |
|
| object-src | 影响 <object> <embed> <applet> |
|
| media-src | <audio> <video> |
|
| frame-src | 等同 child-src | |
| sandbox | ||
| report-uri | deprecated | |
| child-src | 影响 web workers 和 <frame> <iframe> |
|
| form-action | <form> |
|
| frame-ancestors | 影响<frame> <iframe> <object> <embed> <applet> |
|
| plugin-types | 影响 <object> <embed> |
|
| base-uri | 影响 <base>标签的 src 属性 |
|
| report-to | ||
| worker-src | 影响 Worker、SharedWorker 、 ServiceWorker | |
| manifest-src | ||
| prefetch-src | 影响 prefetch 和 prerender | |
| navigate-to | ||
| upgrade-insecure-requests | 自动将 http 请求升级成 https 请求 | |
| block-all-mixed-content |
常见值
| 值 | 描述 | 例子 |
|---|---|---|
| * | 通配符 | img-src * |
| ‘none’ | 阻止所有 | object-src 'none' |
| ‘self’ | 允许同源 | script-src 'self' |
| data: | 允许 base64 | |
| domain.example.com | 允许特定域名 | |
| *.example.com | ||
https://cdn.com |
||
| https: | ||
| ‘unsafe-inline’ | html 上的事件或 inline 的 <script> 或 javascript: |
|
| ‘unsafe-eval’ | eval() |
|
| ‘sha256-‘ | 匹配 header 中的 hash | |
| ‘nonce-‘ | 匹配上script 标签中的 nonce 属性 | |
| ‘strict-dynamic’ | ||
| ‘unsafe-hashes’ |