如何理解Uncaught SecurityError: Failed to read the 'contentDocument' property from 'HTMLIFrameElement': Blocked a frame with origin “https://localhost”?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (307)

我在尝试捕获G +关注按钮的点击事件时面临以下问题。

Uncaught SecurityError: Failed to read the 'contentDocument' property from 'HTMLIFrameElement': Blocked a frame with origin "https://localhost" from accessing a frame with origin "https://apis.google.com".

协议,域和端口必须匹配。

提问于
用户回答回答于

我的解决方案重建了iframe并可以角度使用。当我们构建一个iframe时,它需要源安全检查来修改iframe内容。该解决方案使我们能够多次重新创建iframe内容。

HTML

<div id="iframecontainer"></div>

JS

var content = "<h1>Content inside Iframe</h1>"; //desired content of iframe
var iframecontainer = document.getElementById("iframecontainer");
iframecontainer.innerHTML ='<iframe id="threedsframe" width="%90" height="400px"></iframe>';
var iframe = iframecontainer.childNodes[0];
let doc =  iframe.contentDocument || iframe.contentWindow;
doc.open();
doc.write(content);
doc.close();
用户回答回答于

为了解决这个问题,需要添加这段代码

document.domain = 'yourdomain.com'

从文章本身:

页面可能会因某些限制而改变其原点。脚本可以将document.domain的值设置为当前域的子集。如果是这样,则较短的域用于随后的原点检查。例如,假设脚本执行以下语句:

document.domain = "company.com";

执行该语句后,页面将传递原始检查。但是,出于同样的原因,company.com无法将document.domain设置为othercompany.com。 端口号由浏览器单独保存。任何对setter的调用(包括document.domain = document.domain)都会导致端口号被null覆盖。因此,只有在第一个设置document.domain =“company.com”时,才能使company.com:8080与company.com通话。它必须在两者中设置,以便端口号都为空。

扫码关注云+社区

领取腾讯云代金券