CSP 内容安全策略

栏目: CSS · 发布时间: 6年前

内容简介：CSP(Content-Security-Policy)内容安全策略，官方解释：CSP是一个额外的完全层，用于检测并小若某些特定类型的攻击，包括跨站脚本攻击XSS和数据注入攻击等。1. 后端配置网络服务器返回Content-Security-Policy头部

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", // 原始策略
    }
}复制代码

以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，也希望大家多多支持码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络，本站转载出于传递更多信息之目的，版权归原作者或者来源机构所有，如转载稿涉及版权问题，请联系我们。

码农书籍

用户思维+：好产品让用户为自己尖叫

[美] Kathy Sierra / 石航 / 人民邮电出版社 / 2017-9 / 69.00元

畅销产品与普通产品的本质区别是什么？若没有巨额预算、不爱营销噱头、不开奢华的产品发布会，如何打造可持续成功的产品？本书针对上述问题提出了新颖的观点：用户并不关心产品本身有多棒，而是关心使用产品时自己有多棒。作者利用其多年的交互设计经验，生动阐释了这一观点背后的科学。可贵的是，本书并不止步于解释“为什么”，还清晰呈现了“怎么做”。本书风格活泼、图文并茂，其对话式内容既引人入胜，又引人深思，适......一起来看看《用户思维+：好产品让用户为自己尖叫》这本书的介绍吧!

码农工具

CSP 内容安全策略

用户思维+：好产品让用户为自己尖叫

HTML 编码/解码

RGB CMYK 转换工具

HSV CMYK 转换工具