如何從不同的網域存取 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中文網其他相關文章！