什么是CSP

CSP全称Content Security Policy ,可以直接翻译为内容安全策略,说白了,就是为了页面内容安全而制定的一系列防护策略. 通过CSP所约束的的规责指定可信的内容来源(这里的内容可以指脚本、图片、iframe、fton、style等等可能的远程的资源)。通过CSP协定,让WEB处于一个安全的运行环境中。

有什么用?

我们知道前端有个很著名的”同源策略”,简而言之,就是说一个页面的资源只能从与之同源的服务器获取,而不允许跨域获取.这样可以避免页面被注入恶意代码,影响安全.但是这个策略是个双刃剑,挡住恶意代码的同时也限制了前端的灵活性,那有没有一种方法既可以让我们可以跨域获取资源,又能防止恶意代码呢?

答案是当然有了,这就是csp,通过csp我们可以制定一系列的策略,从而只允许我们页面向我们允许的域名发起跨域请求,而不符合我们策略的恶意攻击则被挡在门外.从而实现

需要说明的一点是,目前主流的浏览器都已支持csp.所以我们可以放心大胆的用了.

指令说明

指令就是csp中用来定义策略的基本单位,我们可以使用单个或者多个指令来组合作用,功能防护我们的网站.

以下是常用的指令说明:

指令名

demo

说明

default-src

'self' cdn.example.com

默认策略,可以应用于js文件/图片/css/ajax请求等所有访问

script-src

'self' js.example.com

定义js文件的过滤策略

style-src

'self' css.example.com

定义css文件的过滤策略

img-src

'self' img.example.com

定义图片文件的过滤策略

connect-src

'self'

定义请求连接文件的过滤策略

font-src

font.example.com

定义字体文件的过滤策略

object-src

'self'

定义页面插件的过滤策略,如 <object>, <embed> 或者<applet>等元素

media-src

media.example.com

定义媒体的过滤策略,如 HTML6的 <audio>, <video>等元素

frame-src

'self'

定义加载子frmae的策略

sandbox

allow-forms allow-scripts

沙盒模式,会阻止页面弹窗/js执行等,你可以通过添加allow-forms allow-same-origin allow-scripts allow-popups, allow-modals, allow-orientation-lock, allow-pointer-lock, allow-presentation, allow-popups-to-escape-sandbox, and allow-top-navigation 策略来放开相应的操作

report-uri

/some-report-uri

 

指令值

所有以-src结尾的指令都可以用一下的值来定义过滤规则,多个规则之间可以用空格来隔开

demo

说明

*

img-src *

允许任意地址的url,但是不包括 blob: filesystem: schemes.

'none'

object-src 'none'

所有地址的咨询都不允许加载

'self'

script-src 'self'

同源策略,即允许同域名同端口下,同协议下的请求

data:

img-src 'self' data:

允许通过data来请求咨询 (比如用Base64 编码过的图片).

domain.example.com

img-src domain.example.com

允许特性的域名请求资源

*.example.com

img-src *.example.com

允许从 example.com下的任意子域名加载资源

https://cdn.com

img-src https://cdn.com

仅仅允许通过https协议来从指定域名下加载资源

https:

img-src https:

只允许通过https协议加载资源

'unsafe-inline'

script-src 'unsafe-inline'

允许行内代码执行

'unsafe-eval'

script-src 'unsafe-eval'

允许不安全的动态代码执行,比如 JavaScript的 eval()方法

示例

default-src 'self';

只允许同源下的资源

script-src 'self';

只允许同源下的js

script-src 'self' www.google-analytics.com ajax.googleapis.com;

允许同源以及两个地址下的js加载

default-src 'none'; script-src 'self'; connect-src 'self'; img-src 'self'; style-src 'self';

多个资源时,后面的会覆盖前面的

服务器端配置

  • Apache服务

在VirtualHost的httpd.conf文件或者.htaccess文件中加入以下代码

Header set Content-Security-Policy "default-src 'self';"

  • Nginx

在 server {}对象块中添加如下代码

add_header Content-Security-Policy "default-src 'self';";

  • IIS

web.config:中添加

<system.webServer>

<httpProtocol>

<customHeaders>

<add name="Content-Security-Policy" value="default-src 'self';" />

</customHeaders>

</httpProtocol>

</system.webServer>

参考链接:

https://www.zhihu.com/question/21979782

https://content-security-policy.com/

前端安全配置之Content-Security-Policy(csp)的更多相关文章

  1. Content Security Policy (CSP) 介绍

    当我不经意间在 Twitter 页面 view source 后,发现了惊喜. <!DOCTYPE html> <html lang="en"> <h ...

  2. Content Security Policy (CSP)内容安全策略

    CSP简介 Content Security Policy(CSP),内容(网页)安全策略,为了缓解潜在的跨站脚本问题(XSS攻击),浏览器的扩展程序系统引入了内容安全策略(CSP)这个概念. CSP ...

  3. Content Security Policy (CSP)内容安全策略总结

    跨域脚本攻击 XSS 是最常见.危害最大的网页安全漏洞. 为了防止它们,要采取很多编程措施,非常麻烦.很多人提出,能不能根本上解决问题,浏览器自动禁止外部注入恶意脚本?这就是"网页安全政策& ...

  4. DVWA 黑客攻防实战(十五) 绕过内容安全策略 Content Security Policy (CSP) Bypass

    看到标题,是否有点疑惑 CPS 是什么东东.简单介绍一下就是浏览器的安全策略,如果 标签,或者是服务器中返回 HTTP 头中有 Content-Security-Policy 标签 ,浏览器会根据标签 ...

  5. Refused to execute inline event handler because it violates the following Content Security Policy directive: "xxx". Either the 'unsafe-inline' keyword, a hash ('sha256-...'), or a nonce ('nonce-...')

    /********************************************************************************* * Refused to exec ...

  6. 网页安全政策"(Content Security Policy,缩写 CSP)

    作者:阿里聚安全链接:https://www.zhihu.com/question/21979782/answer/122682029来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载 ...

  7. Content Security Policy的学习理解

    以下内容转载自 http://www.cnblogs.com/alisecurity/p/5924023.html 跨域脚本攻击 XSS 是最常见.危害最大的网页安全漏洞. 为了防止它们,要采取很多编 ...

  8. react route使用HashRouter和BrowserRouter的区别-Content Security Policy img-src 404(Not found)

    踩坑经历 昨天看了篇关于react-route的文章,说BrowserRouter比HashRouter好一些,react也是推荐使用BrowserRouter,毕竟自己在前端方面来说,就是个小白,别 ...

  9. Content Security Policy减少劫持

    Content Security Policy减少劫持 什么是CSP? CSP是由单词 Content Security Policy 的首单词组成,是HTML5带给我们的一套全新主动防御的体系,旨在 ...

  10. Content Security Policy 入门教程

    阮一峰文章:Content Security Policy 入门教程

随机推荐

  1. MVC 教程汇总

    http://www.cnblogs.com/powertoolsteam/archive/2015/08/13/4667892.html

  2. JavaScript 富文本编辑器

    WEB项目中使用UEditor(富文本编辑器) UEditor - 完整示例 http://ueditor.baidu.com/website/onlinedemo.html UEditor注意事项: ...

  3. 浅谈JAVA设计模式

    没有万行的代码量,就不要想搞清楚设计模式.目前本人代码量大约在六千五百行,2016年需要继续努力,尽快完成万行之约. 工作之余需要,下面提前简单讨论一下设计模式. 创建型模式,共五种:工厂模式.抽象工 ...

  4. 冰球项目日志2-yjw

    我们小组在12.31号进行了讨论,确定了基本的任务及分工,后面是元旦放假,大家没有做很多的东西,我也是把自己分工的部分方案想了下. 后面在1.3号,我们会再进行一次小组讨论,确定下最终的方案,然后进行 ...

  5. 团队Git工作流总结

    为什么使用Git “svn用了这么多年都好好的,为啥折腾搞Git?” “Git一点都不好用,提交个代码都提交不上去!” “Git这么复杂,命令多到记不住,而且完全用不到.哪有svn简单好用?”   推 ...

  6. Android入门(六):Android控件布局属性全解

    第一类:属性值为true或falseandroid:layout_centerHrizontal 水平居中 (Hrizontal表示水平)android:layout_centerVertical 垂 ...

  7. Hint when use HTTPAgilityPack

    1- Read the usage policy of the website. I know this is the third time I mention that, but that tell ...

  8. win7 64 安装mysql-python:_mysql.c(42) : fatal error C1083: Cannot open include file: 'config-win.h': No such file or directory

    今天想在在win7 64位环境下使用python 操作mysql 在安装MySQL-python 时报错: _mysql.c _mysql.c(42) : fatal error C1083: Can ...

  9. [DEMO] 互联网广告RTB机制简介

    前言: 传统的互联网广告一般都是大流量网站在页面中留出一定空位,某些推广商家通过买位的方式来展示自己的广告. 我们这里引入一个案例:假设大访问量网站为博客园,想要广告推广的公司为阿里云平台. (场景为 ...

  10. xampp 80端口被占用解决办法

    很多朋友安装xampp之后,启用服务器或者数据库失败,发现端口已经被占用.因为每台电脑占用端口的软件不一样,要如何解决这个问题. 第一种解决方法: 检查软件安装路径中是否有中文,如下图: 解决方法: ...