如何从不同的域访问 iFrame 的内容？

跨域 iFrame 访问：解决方案

当尝试从不同域访问 iFrame 的内容时，您可能会遇到“访问属性的权限被拒绝”错误。出现此问题的原因是浏览器的跨域策略，出于安全原因，该策略限制域之间的数据交换。

要克服此限制，您可以使用 postMessage 方法，如果您可以控制两个框架站点，则可以使用该方法以及 iFrame 的内容。此方法允许您在不同域之间发送和接收消息。

这是一个示例实现：

框架站点 (iframe.net):

<script>
  window.onmessage = function(event) {
    event.source.postMessage(document.body.innerHTML, event.origin);
  };
</script>

主页(example.com):

<script>
  window.onmessage = function(event) {
    alert(event.data);
  };
</script>

<!-- Trigger the message sending -->
<iframe>

document.getElementById('myframe').contentWindow.postMessage('', '*');

postMessage 方法有两个参数：要发送的消息和目标源（接收消息的域）。在此示例中，我们使用“*”表示该消息可以由任何域接收。

执行此代码时，包含 iFrame 正文的消息将从加框站点发送到主站点页面，它显示在警报框中。这演示了如何绕过跨域策略并使用 postMessage 方法在两个域之间交换数据。

以上是如何从不同的域访问 iFrame 的内容？的详细内容。更多信息请关注PHP中文网其他相关文章！