CSP 内容安全策略

CSP(Content-Security-Policy)内容安全策略，官方解释：CSP是一个额外的完全层，用于检测并小若某些特定类型的攻击，包括跨站脚本攻击XSS和数据注入攻击等。

配置方法：

1. 后端配置网络服务器返回Content-Security-Policy头部

2. 前端通过<meta>标签进行配置

<meta http-equiv="Content-Security-Policy" content="default-src 'self';">

CSP使用目的

XSS攻击方面：CSP的主要用途是减少和上报XSS攻击，通过指定浏览器认可的可执行脚本的有效来源（将仅执行从白名单域获取到的脚本文件，忽略所有其他脚本，包括内联脚本和HTML的事件处理属性），使服务器管理者有能力减少或者消除XSS攻击所依赖的载体。

数据注入攻击方面：可指定所有内容必须通过HTTPS加载。

策略制定

配置相关策略，可以控制浏览器为该页面获取的资源。

Content-Security-Policy: default-src | script-src | style-src | img-src ....

script-src：外部脚本
style-src：样式表
img-src：图像
media-src：媒体文件（音频和视频）
font-src：字体文件
object-src：插件（比如 Flash）
child-src：框架
frame-ancestors：嵌入的外部资源（比如<frame>、<iframe>、<embed>和<applet>）
connect-src：HTTP 连接（通过 XHR、WebSockets、EventSource等）
worker-src：worker脚本
manifest-src：manifest 文件

常用安全策略方案：

1. 内容同源

Content-Security-Policy: default-src 'self'

2. 信任指定域资源

Content-Security-Policy: default-src 'self' *.example.com

3. 信任所有图片源，限制富媒体资源

Content-Security-Policy: default-src 'selc'; img-src *; media-src media1.com media2.com; srcipt-src *.example.com

默认的，各类资源允许从文档所在源获取，但以下内容除外：

图片资源不受限制
富媒体资源仅允许从media1.com, media2.com获取，且这类站点的不包括子域
可运行脚本仅允许*.example.com
若此处不设置script-src，仅允许javascript从原始服务器获取

4. 通过HTTPS加载

Content-Security-Policy: default-src https://some.trusted.com/

测试策略

Content-Security-Policy-Report-Only（报告模式），CSP策略不是强制性的，但任何违规行为都会上报到指定URI。

Content-Security-Policy和Content-Security-Policy-Report-Only，也可以同时使用，Content-Security-Policy带有策略强制性，而Content-Security-Policy-Report-Only中的策略只产生报告不具有强制性。

发送违规报告

启用发送违规报告，需要指定report-uri策略指令，并提供至少一个URI地址：

Content-Security-Policy: default-src 'self'; report-uri https://report.catch.com/collector.cpi

然后在服务器设置接收。

案例使用说明

假设一个 https://example.com/index.html 页面，CSP策略禁止任何资源的加载，除了cdn.example.com的资源样式表。

Content-Security-Policy: default-src 'none'; style-src cdn.example.com; report-uri /_/report-collect

index.html代码如下：

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="css/style.css">
    </head>
    <body>...</body>
</html>

由于CSP的设置，页面总link标签的css资源无法被正常加载，且还会发送一个违规报告到https://example.com/_/report-collect：

{
    "report-collect": {
        "document-uri":  https://example.com/index.html,   // 发生违规行为的文档的URI
        "referrer": "",  // 违规发生处的文档引用地址
        "blocked-uri": "https://example.com/css/style.css", // 被CSP阻止的资源
        "violated-directive": "style-src cdn.example.com",  // 违反的策略名称
        "original-policy": "default-src 'none'; style-src cdn.example.com;report-uri /_/report-collect", // 原始策略
    }
}