基础原理

什么是CSP？

内容安全策略(CSP) 是一个策略，该策略可以定义哪些资源可以被当前的web页面加载。

为什么要CSP？

CSP 的主要目标是减少和报告 XSS （Cross Site Scripting）攻击。一般同源策略只对网页的HTML文档做了限制，对加载的其他静态资源如javascript、css、图片等资源等还是可以加载。而XSS攻击则刚好利用了浏览器对于从服务器所获取的内容的信任。CSP则在此基础上加了一层白名单，只有在白名单里的内容才会被信任。

原理是什么？

就像上文所说XSS利用了浏览器对HTML其加载资源的信任，来执行一些不法操作。而CSP相当于给资源的访问加了一层白名单，只有在白名单里的资源才能被信任。

比如说，对于没有设置CSP的浏览器来说，HTML文档加载的静态资源都会被浏览器认为安全的。

而一旦这些资源里有恶意的脚本，浏览器无法识别哪些是恶意的脚本，还是认为都是安全可加载的，而导致悲剧的发生

当我们加了CSP配置，告诉浏览器哪些是安全可加载的，那么那些恶意脚本就会被过滤掉，达到了防止攻击的效果

那么这个白名单是在哪里配置并且以何种规则来告诉浏览器的哪些是可安全加载的呢？

CSP有以下两种方式可以配置：

Header

你可以使用Content-Security-Policy HTTP响应头来进行配置

Content-Security-Policy: default-src 'self'; script-src userscripts.example.com

CSP的规则都有哪些呢?

一般CSP的HTTP Header张这样

Content-Security-Policy: 
base-uri 'self';
object-src 'self';
script-src 'self' 'unsafe-eval' 'unsafe-inline' 'report-sample' *.xxx.com; 
frame-src 'self' *.xxx.com;
report-uri https://xxx.log.xxx.com

base-uri

用于控制base标签能加载的资源范围

'self' 只允许加载当前域下的资源，具体匹配规则详见文档 [Does url match expression in origin with redirect count?]

object-src

防止浏览器加载执行嵌入的插件资源，或标签。最常见的示例是防止Flash based xss

'self' 只允许加载当前域下的资源，具体匹配规则详见文档 [Does url match expression in origin with redirect count?]

script-src

用于控制浏览器加载页面脚本的范围，包括加载的url及内联脚本，还有其中

'self' 该指令指加载当前域下的js资源
'unsafe-inline' 该指令值允许内联脚本加载
'unsafe-eval' 该指令值允许页面加载eval()、new Founction()、定时器等JavaScript函数
'report-sample' 指外界尝试XSS攻击时或有脚本触发了违例，浏览器会异步将payload的前40个字节POST给 report-uri 对应的链接，可以用于定位XSS漏洞、CSP制定阶段排查内联脚本位置
'*.xxx.com' 允许这个域名下的js脚本加载，具体匹配规则详见文档 [Does url match expression in origin with redirect count?]

frame-src

用于控制浏览器加载iframe资源的范围，其中：

'self' 该指令指加载当前域下的js资源，具体匹配规则详见文档 [Does url match expression in origin with redirect count?]
'*.xxx.com' 允许这个域名下的iframe脚本加载，，具体匹配规则详见文档 [Does url match expression in origin with redirect count?]

report-uri

就像上文所说，用来定义上报的地址 www.w3.org/TR/CSP/#dir…

注意：以上仅仅为很粗略的规则介绍，CSP的规则很复杂，若遇到问题需要查阅文档www.w3.org/TR/CSP/#ind… （level 3）解决

CSP内容安全策略基础版