CSP 内容安全策略

CSP.md

CSP 内容安全策略

https://developers.google.com/web/fundamentals/security/csp/

CSP 基于白名单来源，因为此方法可明确指示浏览器将特定的资源集视为可接受的资源，并拒绝其余资源。

https://developers.google.com/web/fundamentals/security/csp/

TL;DR

• 使用白名单告诉客户端允许加载和不允许加载的内容。
• 了解可使用哪些指令。
• 了解这些指令接受哪些关键字。
• 内联代码和 eval() 被视为是有害的。
• 向服务器举报政策违规行为，以免执行这些行为。

    
<meta http-equiv="Content-Security-Policy" 
content="default-src https://cdn.example.net; child-src 'none'; object-src 'none'" />

https://github.com/xgqfrms-GitHub/webgeeker/blob/gh-pages/CSP/readme.md

new Function ([arg1[, arg2[, ...argN]],] functionBody)

CSP: https://developers.google.com/web/fundamentals/security/csp/#eval

https://davidwalsh.name/new-function
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function
https://docs.angularjs.org/api/ng/directive/ngCsp

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Function

Function 构造函数 创建一个新的Function对象。
在 JavaScript 中, 每个函数实际上都是一个Function对象。

句法
new Function ([arg1[, arg2[, ...argN]],] functionBody)
参数

arg1, arg2, ... argN
被函数使用的参数的名称必须是合法命名的。
参数名称是一个有效的JavaScript标识符的字符串，或者一个用逗号分隔的有效字符串的列表;例如“×”，“theValue”，或“A，B”。
functionBody
一个含有包括函数定义的JavaScript语句的 字符串。

demo

// 可以直接运行在 JavaScript 控制的代码例子

// 创建了一个能返回两个参数和的函数
const adder = new Function("a", "b", "return a + b");

// 调用函数
adder(2, 6);
//  8

报告

CSP 能够阻止不受信任的资源客户端，这对于您的用户来说是一个巨大的优势，而若能够向服务器返回某种通知以便您可以在第一时间发现和制止允许恶意注入的错误，更是很有帮助。因此，您可以指示浏览器将 JSON 格式的违规行为报告 POST 到在 report-uri 指令中指定的位置。

Content-Security-Policy: default-src 'self'; ...; report-uri /my_amazing_csp_report_parser;

报告类似如下：

{
  "csp-report": {
    "document-uri": "http://example.org/page.html",
    "referrer": "http://evil.example.com/",
    "blocked-uri": "http://evil.example.com/evil.js",
    "violated-directive": "script-src 'self' https://apis.google.com",
    "original-policy": "script-src 'self' https://apis.google.com; report-uri http://example.org/my_amazing_csp_report_parser"
  }
}

仅报告

如果您是刚刚开始使用 CSP，那么，在向您的用户部署严格的政策前，先评估您的应用的当前状态很重要。
作为完整部署的敲门砖，您可以要求浏览器监控某个政策，报告违规行为，但不强制执行限制。
发送 Content-Security-Policy-Report-Only 标头，而不是 Content-Security-Policy 标头。

Content-Security-Policy-Report-Only: default-src 'self'; ...; report-uri /my_amazing_csp_report_parser;

Content Security Policy Level 2

http://caniuse.com/#search=csp

Content Security Policy 1.0

http://caniuse.com/#feat=contentsecuritypolicy

CSP 1通过将允许的脚本，样式和其他资源来源列入白名单来减轻跨站点脚本攻击。

CSP 2增加了hash-source，nonce-source和五个新的指令

https://publish.twitter.com/#
https://blog.twitter.com/2011/improving-browser-security-with-csp
https://developers.facebook.com/docs/plugins/like-button
https://developers.google.com/+/web/+1button/

Content-Security-Policy: 
default-src 'none'; 
script-src https://cdn.mybank.net; style-src https://cdn.mybank.net;
img-src https://cdn.mybank.net; 
connect-src https://api.mybank.com; child-src 'self'

Content-Security-Policy: 
default-src https:; 
script-src https: 'unsafe-inline';
style-src https: 'unsafe-inline'

Content Security Policy Level 3

W3C Working Draft, 13 September 2016

https://www.w3.org/TR/CSP3/

Content Security Policy Level 2

W3C Recommendation, 15 December 2016

https://www.w3.org/TR/CSP2/

CORS & CSP

Fetch API get json data

https://gist.github.com/xgqfrms-GitHub/840fe27cecb9e7217fb4f0b09db19406

CSP & CORS

document.readyState & DOMContentLoaded

https://gist.github.com/xgqfrms-GitHub/b0da64ef34e0ba8072de09599aeb4cbf