井井客

搜索

Content Security Policy

之前html代码中被小伙伴加入了一行meta(关于Content-Security-Policy),原来接口JSONP已经解决跨域问题,然后也开始报错跨域,后来查看是因为这行代码,所以学习一下。

Content Security Policy

原文来自:http://www.ruanyifeng.com/blog/2016/09/csp.html

Content Security Policy(XSP)即网页安全政策的产生是为了解决跨域脚本攻击XSS。(备注:因为原来从src上可以引入外部资源而不受同源策略影响,所以可以用JSONP去解决跨域问题。而CSP可以防止外部注入,也包括src,安全性更高)

简介

CSP 的实质就是白名单制度,开发者明确告诉客户端,哪些外部资源可以加载和执行,等同于提供白名单。它的实现和执行全部由浏览器完成,开发者只需提供配置。

CSP 大大增强了网页的安全性。攻击者即使发现了漏洞,也没法注入脚本,除非还控制了一台列入了白名单的可信主机。

两种方法可以启用 CSP。

一种是通过 HTTP 头信息的Content-Security-Policy的字段。(备注:我没用过这个,感觉是在服务器上配置)

配置头信息字段:Content-Security-Policy。

Content-Security-Policy: script-src 'self'; object-src 'none'; style-src cdn.example.org third-party.org; child-src https:

另一种就是上面说的通过页面中meta标签设置。

<meta http-equiv="Content-Security-Policy" content="script-src 'self'; object-src 'none'; style-src cdn.example.org third-party.org; child-src https:">

上面代码中,CSP 做了如下配置。

脚本:只信任当前域名
<object>标签:不信任任何URL,即不加载任何资源
样式表:只信任cdn.example.org和third-party.org
框架(frame):必须使用HTTPS协议加载
其他资源:没有限制

启用后,不符合 CSP 的外部资源就会被阻止加载,否则就会报错。

限制选项

CSP 提供了很多限制选项,涉及安全的各个方面。

(1)资源加载限制,限制各类资源的加载

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 文件

(2)default-src 设置上面各个选项的默认值

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

上面代码限制所有的外部资源,都只能从当前域名加载。

如果同时设置某个单项限制(比如font-src)和default-src,前者会覆盖后者,即字体文件会采用font-src的值,其他资源依然采用default-src的值。

(3)URL限制 有时网页会跟其他URL发生联系,这时也可以加以限制

frame-ancestors:限制嵌入框架的网页
base-uri:限制<base#href>
form-action:限制<form#action>

(4)其他限制 其他一些安全相关的功能,也放在了 CSP 里面

block-all-mixed-content:HTTPS 网页不得加载 HTTP 资源(浏览器已经默认开启)
upgrade-insecure-requests:自动将网页上所有加载外部资源的 HTTP 链接换成 HTTPS 协议
plugin-types:限制可以使用的插件格式
sandbox:浏览器行为的限制,比如不能有弹出窗口等。

(5)report-uri 有时,我们不仅希望防止 XSS,还希望记录此类行为。report-uri就用来告诉浏览器,应该把注入行为报告给哪个网址。

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

上面代码指定,将注入行为报告给/my_amazing_csp_report_parser这个 URL。

浏览器会使用POST方法,发送一个JSON对象。

Content-Security-Policy-Report-Only

除了Content-Security-Policy,还有一个Content-Security-Policy-Report-Only字段,表示不执行限制选项,只是记录违反限制的行为。

它必须与report-uri选项配合使用。

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

原文中还有关于选项值的说明,以及注意事项,建议感觉兴趣的小伙伴点击上面的原文进行查看~

备注中理解有误的话,欢迎小伙伴拍砖~交流

文章TAG:HTML

作者:井井客整理来源:转载
本文标题:Content Security Policy
本文链接:/c/11336.html

上一篇:nginx简单使用
下一篇:我的Webstorm经常卡死的原因

文章分类

相关阅读

随便看看