CSP（内容安全策略）常用场景

telephant
1,123 阅读4分钟

一个开头

第一次尝试着写blog，就当作把自己学习的笔记分享出来，欢迎批评指正👏 ;)

Content-Security-Policy：内容安全策略

CSP是什么

  • 是一种指定页面能够加载哪些资源的HTTP头
  • 能够有效帮助防止XSS攻击、数据注入攻击等
  • 也可以用<meta>进行配置

CSP有什么作用

  • 预防减少XSS攻击
  • 预防减少应用层数据包嗅探攻击
  • 对页面进行全面的https升级
  • http到https的跳转
  • 控制XMLHttpRequest、<a>等的访问

预防减少XSS攻击

背景：XSS攻击是基于浏览器对服务器/用户输入的内容的信任，使得恶意代码在页面执行。

CSP可以通过script-src指定脚本资源白名单（允许加载的脚本资源），忽略其他脚本，包括内联脚本（javascript:...）和HMTL的事件处理属性。

// script脚本，只能从  example.com 及其 子域名下面获取，其他脚本一概忽略

// 1. meta标签设置
<meta
  http-equiv="Content-Security-Policy"
  content="default-src: 'self'; script-src: *.example.com;"
/>

// 2. http 头设置
Content-Security-Policy: default-src: 'self'; script-src: *.example.com

预防减少应用层数据包嗅探攻击

背景：在应用层的嗅探攻击主要是发生在使用HTTP传输时，攻击者获取到数据包中的信息。

CSP可以通过default-src中的一些配置（https、blob...）使用协议来指定，页面加载资源所用的到的协议，不符合的会被忽略

// 只能从  访问https的资源，其他一概忽略

// 1. meta标签设置
<meta
  http-equiv="Content-Security-Policy"
  content="default-src: 'self' https"
/>

// 2. http 头设置
Content-Security-Policy: default-src: 'self' https

对页面进行全面的https升级

CSP通过使用upgrade-insecure-requests对页面访问的url全部都升级成为https

// 只能从  访问https的资源，其他一概忽略

// 1. meta标签设置
<meta
  http-equiv="Content-Security-Policy"
  content="upgrade-insecurity-requests"
/>

// 2. http 头设置
Content-Security-Policy: upgrade-insecure-requests

http到https的跳转

背景：访问一些网站时，服务器会在nginx设置一个HTTP自动跳转到HTTPS的配置，支持用户从HTTP 的url跳转到HTTPS，而这个过程也有被中间人攻击的风险，攻击者可以试图拦截到HTTP请求进行攻击操作。

CSP可以通过设置strict-transport-security，进行一个配置，当浏览器第一次使用https访问到服务器时，会在Response Header里加上strict-transport-security头，进行配置，当下一次再次访问这个url时，浏览器会自动将http转化为https。

配置：

  • *max-age：过期属性，单位为秒

  • includeSubDomains：如果被设置，说明此规则也适用于子域名

  • preload：查看 谷歌维护的一个预加载详情

// http header
strict-transport-security: max-age=63072000

控制XMLHttpRequest、<a>等的访问

通过connect-src可以指定以下链接地址的白名单：

  • <a>
  • fetch
  • XMLHttpRequest
  • WebSocket
  • EventSource：服务器推送的一个网络事件接口（单向的）

违规行为报告

当不满足Content-Security-Policy配置的“白名单”时，可以通过Content-Security-Policy-Report-Only或者Content-Security-Policy和配置响应report-uri进行违规报告检测上传

  • Content-Security-Policy-Report-Only ：只做违规行为上报，不做行为限制
  • 没有配置report-uri 则不会进行上报
// 访问 除了example.com下的script，都视作违规行为 并 上报

// 1. Content-Security-Policy-Report-Only
// meta
<meta
  http-equiv="Content-Security-Policy-Report-Only"
  content="script-src: example.com; report-uri: http://example.com/report"
/>
// header
Content-Security-Policy-Report-Only: script-src: example.com;report-uri: http://example.com/report

// 2. report-uri
<meta
  http-equiv="Content-Security-Policy"
  content="script-src: example.com; report-uri: http://example.com/report"
/>
// header
Content-Security-Policy: script-src: example.com;report-uri: http://example.com/report

CSP的常用属性概览

  • default-src：兜底src

  • style-src：限制层叠样式表文件源

  • script-src：限制JavaScript的源地址

  • img-src: 限制图片和图标的源地址

  • connect-src：限制能通过脚本接口加载的URL

    • <a>
    • Fetch
    • XMLHttpRequest
    • WebSocket
    • EventSource

  • media-src：限制通过、或标签加载的媒体文件的源地址

  • child-src：为 web workers 和其他内嵌浏览器内容（例如用和加载到页面的内容）定义合法的源地址

  • font-src：设置允许通过@font-face加载的字体源地址

  • manifest-src ： 限制应用声明文件的源地址

  • object-src：限制、、标签的源地址

  • prefetch-src：指定预加载或预渲染的允许源地址

    • 到此，结束，希望多多指正;)

    reference：Content-Security-Policy - HTTP | MDN

avatar
文章
阅读
粉丝