为什么浏览器对 iframe 执行同源安全策略?

信息安全 网页浏览器 同源策略
2021-08-15 10:32:37

我今天在 Chrome (V37) 上做了一个小测试。我创建了一个小页面并将其加载到浏览器中:

<!DOCTYPE html>
<html>
<head>
    <title>Untitled Document</title>
</head>
<body>
    <p>Normal page</p>
    <iframe src="https://security.stackexchange.com/" />
</body>
</html>

检查控制台我发现了这个错误消息:

拒绝在框架中显示“ https://security.stackexchange.com/ ”,因为它将“X-Frame-Options”设置为“SAMEORIGIN”。

为什么浏览器需要对iframes强制执行同源策略

2个回答

点评:同源政策

首先,让我们澄清一下,这里观察到的行为(iframe 不呈现)比默认的同源策略要严格得多。如果您已经了解这一点,请跳至下面的“实际情况”。

回顾一下,同源策略会阻止脚本以编程方式访问跨源资源的内容。考虑同源策略如何应用于各种类型的资源:

  • 图像:标签<img>将向用户直观地显示跨域图像,但在加载到 a 时不允许脚本读取图像内容<canvas>(即,toDataURL如果画布包含任何跨域图像,则会失败)
  • 脚本:跨域脚本在<script>元素中引用时会运行,但页面只能运行脚本,不能读取其内容。
  • iframe:与图像一样,框架式跨域页面的内容对用户来说是可视的,但外部框架页面中的脚本不允许访问框架页面的内容。

同源策略适用于 iframe 的原因与它适用于所有其他类型的资源相同:使用来自资源自身来源的凭据获取框架网页(或显示的图像,或通过 Ajax 访问的资源) (例如,从中获取资源的 HTTP 请求google.com包括我的浏览器为 设置的 cookie google.com)。不应向发出请求的页面授予对使用来自不同来源的凭据获取的资源的读取访问权限。

实际发生了什么:X-Frame-Options

但是,您在此处看到的行为比同源策略更严格:框架页面根本不显示托管(可能)框架页面的跨域服务器通过发送X-Frame-Options响应标头来请求此阻塞行为,该响应标头指定允许如何框架页面。

  • DENY该页面不能在框架中显示,无论站点是否尝试这样做。
  • SAMEORIGIN页面只能显示在与页面本身同源的框架中。
  • ALLOW-FROM uri页面只能显示在指定原点的框架中。

在这里,站点发送X-Frame-Options: SAMEORIGIN,这意味着站点只能由与框架页面具有相同来源的页面构成。

从安全的角度来看,这样做是为了防止点击劫持(也称为“UI 补救”攻击)。在点击劫持攻击中,页面会在一个内部显示另一个站点的点击激活组件,<iframe>并诱使用户点击它(通常通过将目标组件分层放置在框架站点的明显可点击功能之上)。

举个简单的例子,一个网站可能会放置一个透明<iframe>的 ,http://security.stackexchange.com以便框架网站中的“注销”链接直接位于“单击此处索取免费资金”按钮的顶部。在查看框架页面时,用户试图索取免费资金,但突然发现自己退出了 Stack Exchange。http://security.stackexchange.com发送headerX-Frame-Options: SAMEORIGIN,恶意跨域页面只得到一个空页面<iframe>用户不会无意中单击注销链接,因为框架站点中的任何内容都没有进入呈现的页面。

OWASP 有一个页面详细介绍了针对点击劫持的防御措施

security.stackexchange.com的管理员已将该站点配置为不让其在其他站点上被陷害。这样做通常是为了防止点击劫持攻击,防止其他人将security.stackexchange.com嵌入到充满广告的页面中,并节省流量。您可以在此处阅读有关X-Frame-Options标头的更多信息

此保护默认关闭。