Security 了解第三方iframes安全性？

Facebook和其他网站提供了一些iframe小插件，我可以把它们放在我的网站上。 例如：

<iframe src="http://www.facebook.com/widgets/like.php?href=http://example.com"
        scrolling="no" frameborder="0"
        style="border:none; width:450px; height:80px"></iframe>

我想知道的是，如果我把这段代码放在我这边，他们加载到我页面中的代码能访问我页面的DOM吗？我看到一些安全问题，如果是这样的话

同样，facebook允许我在他们的网站上放置iframe，这就是facebook应用程序的工作方式。 然后我可以从包含iframe的任何页面中挖掘任何数据吗

请注意，我在这里以facebook为例，但许多公司都做同样的事情，所以这个问题在任何方面都不是facebook特有的，所以我不会这样标记它

---

父页面也可以访问iframe的DOM吗？

我知道父页面可以访问iframe的DOM。最近，我们有一个项目在工作中，我们有一个网站，需要是508兼容。iframe不是，尽管屏幕阅读器处理iframe的效果要好得多，但此iframe中的内容不符合要求。我们将jquery库加载到我们的站点中，然后还将代码加载到我们的站点中，以操作iframe（仅在加载之后），并在此时将iframes内容混搭在一起以供访问

下面是jquery的一个示例，让您了解我们是如何做到这一点的。（使用了大量的查找和替换，但如果你有了想法，你可以做其他事情。）

$（'iframe'）.load（函数（）{
var f=$（this.contents（）；
f、 查找（“#sysverb_back”）.remove（）；
f、 查找（'a.column\u head'）。每个（函数（）{
$（this.attr（'title'，$（this.text（））；
});         
f、 查找（'img[title]：not（[alt]））。每个（函数（）{
$（this.attr（'alt'，$（this.attr（'title'））；
}); 
f、 查找（'input'）。筛选器（函数（）{
返回此.id.match（/sys\u readonly\..+\124; ni\..+/）；
}).each（函数（{
$（this.before（“”+this.id+“”）；
});
});

}))

---

虽然我不知道您是否可以从iframe访问父DOM。

实际上有特定的规则。这是同一原产地政策的一部分，我强烈建议阅读整个谷歌浏览器Sec手册

我假设跨域iFrame，因为如果您自己控制它，风险可能会更低

我一直想自己弄明白

• 如果您的站点包含在iframe中，那么Clickjacking/XSS是一个问题
• 受损的iFrame可能会显示恶意内容（假设iFrame显示的是登录框而不是广告）
• 包含的iframe可以进行某些JS调用，如alert和prompt，这可能会激怒用户
• 包含的iframe可以通过location.href重定向（yikes，想象一个3p帧将客户从bankofamerica.com重定向到bankofamerica.fake.com）
• 3p框架内的恶意软件（java/flash/activeX）可能会感染您的用户

---

请注意，如果您的浏览器支持html5“沙盒”属性，它可以解决很多问题，您可以通过X-FRAME-OPTIONS阻止您的站点作为iFrame包含。

访问parnet DOM是我看到安全问题的地方，我同意应该允许访问子iFrame内容。@Winforms否，不应该，因为这样一来，当你访问他们的网站时，攻击者可以将

放在gmail上并阅读你的电子邮件。

$('iframe').load(function() {
    var f = $(this).contents();
    f.find('#sysverb_back').remove();
    f.find('a.column_head').each(function(){
        $(this).attr('title', $(this).text());
    });         
    f.find('img[title]:not([alt])').each(function(){
        $(this).attr('alt',$(this).attr('title')); 
    }); 
    f.find('input').filter(function() {
        return this.id.match(/sys_readonly\..+|ni\..+/);
    }).each(function() {
        $(this).before('<label for="'+this.id+'" style="display:none;">'+this.id+'</label>');
    });

});