Javascript和相同的起源iframe

时间:2010-04-22 10:31:12

标签: javascript iframe

是否可以使用页面上但在此框架之外的脚本来读取/编辑iframe内容(不仅仅是像src这样的属性)?我知道如果来源来自其他网站是不可能的,因为它会是一个很大的漏洞,但我只是问它是否适用于同一来源的其他内容。

5 个答案:

答案 0 :(得分:5)

添加已经说过的与从同一域加载的iframe进行交互的内容:

只要尝试进行互动的网页和您加载的网页具有相同的document.domain,浏览器就会允许您与iframe(或框架)进行互动。

您可以将document.domain设置为您加载的主机的后缀。例如如果你有一个从blog.fred.com加载的页面,并且它想与一些名为jsonservice.fred.com的服务进行交互,那么两个页面都必须这样做

document.domain = 'fred.com';

之前javascript中的一个将能够与另一个进行交互。

浏览器非常聪明,不允许您将document.domain设置为“.com”,以防您想知道......

答案 1 :(得分:4)

是的,如果iframe和父页面的位置属于同一主机(同一源策略),则可以执行此操作。

为确保浏览器允许您执行此操作,您可以使用

document.domain = "example.com" 

在父页面和iframe中。 (请注意,subdomain.example.com和example.com不同)

执行此操作的Dom方法(iframe的父页面):

document.getElementById("myiframe").contentWindow.document.getElementById("divinframe").innerHTML = "I'm on the inside.";

document.getElementById("myiframe").contentWindow.someFunctionInsideIframe();

contentWindow是答案,适用于大多数(如果不是全部)现代浏览器,当然还有chrome,ie7 +等。

转到其他方式(iframe到父页面):

top.document.getElementById("DivInTopParent")

答案 2 :(得分:0)

如果iframe内容来自同一个域,则可以使用frames.myiframe.getElement...

访问该域

答案 3 :(得分:0)

答案 4 :(得分:0)

这不完全是客户端/ javascript解决方案,但它帮助我解决了这个问题。

您需要移除X-Frame-Options标头(如果有),而是为iframe页面发送以下标头:

Content-Security-Policy: frame-ancestors 'self' example.com *.example.com

另外一个用于IE:

X-Content-Security-Policy: frame-ancestors 'self' example.com *.example.com