Проблема междоменной iframe

Например, у меня есть сайт под названием example.com, на котором iframe встроен в домен iframe.net, теперь я хочу прочитать содержимое iframe и передать некоторый параметр для отображения текстового сообщения. Как Привет с именем пользователя.

Теперь проблема в том, что у него нет возможности установить соединение между ними, даже я не могу получить innerHTML iframe i, который использовал следующий подход

document.getElementById('myframe').contentWindow.document.body.innerHTML;

Он выдает ошибку "Permission denied to access property"

Кто-нибудь знает, как читать и писать в кросс-платформенной платформе

Ответ 1

Если у вас нет контроля над сайтом с рамкой, вы не можете обойти междоменную политику.

Если у вас есть контроль над обоими сайтами, вы можете использовать метод postMessage для передачи данных в разных доменах. Очень простой пример:

// framed.htm:
window.onmessage = function(event) {
    event.source.postMessage(document.body.innerHTML, event.origin);
};

// Main page:
window.onmessage = function(event) {
    alert(event.data);
};

// Trigger:
// <iframe id="myframe" src="framed.htm"></iframe>
document.getElementById('myframe').contentWindow.postMessage('','*');

Ответ 2

В Internet Explorer 8 события, передаваемые в качестве параметра, могут быть нулевыми, поэтому вам нужно получить доступ к событию другим способом:

В frame.html:

window.onmessage = function(event) {
   var evt = event || window.event;
   evt.source.postMessage('Message from iFrame', evt.origin);
};

На main.html:

window.onmessage = function(event) {
   var evt = event || window.event;
   alert(evt.data);
};

Событие запускается так же, как Роб Роб:

document.getElementById('frameId').contentWindow.postMessage('message','*');

Ответ 3

Я создал PHP-скрипт, который может получить все содержимое с другого веб-сайта, и наиболее важной частью является то, что вы можете легко применить свой пользовательский jQuery к этому внешнему контенту. Пожалуйста, обратитесь к следующему сценарию, который может получить все содержимое с другого сайта, а затем вы также можете применить свой cusom jQuery/JS. Этот контент может быть использован где угодно, внутри любого элемента или любой страницы.

<div id='myframe'>

  <?php 
   /* 
    Use below function to display final HTML inside this div
   */

   //Display Frame
   echo displayFrame(); 
  ?>

</div>

<?php

/* 
    Function to display frame from another domain 
*/

function displayFrame()
{
    $webUrl = 'http://[external-web-domain.com]/';

    //Get HTML from the URL
    $content = file_get_contents($webUrl);

    //Add custom JS to returned HTML content
    $customJS = "
    <script>

      /* Here I am writing a sample jQuery to hide the navigation menu
         You can write your own jQuery for this content
      */
      //Hide Navigation bar
      jQuery(\".navbar.navbar-default\").hide();

    </script>";

    //Append Custom JS with HTML
    $html = $content . $customJS;

    //Return customized HTML
    return $html;
}

Ответ 4

iFrame не разрешает доступ к содержимому с платформы Cross Domain. Вы можете получить доступ, только если ваш iFrame использует тот же домен.

Это решение работает так же, как iFrame. Я создал PHP-скрипт, который может получить все содержимое с другого веб-сайта, и наиболее важной частью является то, что вы можете легко применить свой пользовательский jQuery к этому внешнему контенту. Пожалуйста, обратитесь к следующему сценарию, который может получить все содержимое с другого сайта, а затем вы также можете применить свой cusom jQuery/JS. Этот контент может быть использован где угодно, внутри любого элемента или любой страницы.

<div id='myframe'>

  <?php 
   /* 
    Use below function to display final HTML inside this div
   */

   //Display Frame
   echo displayFrame(); 
  ?>

</div>

<?php

/* 
  Function to display frame from another domain 
*/

function displayFrame()
{
  $webUrl = 'http://[external-web-domain.com]/';

  //Get HTML from the URL
  $content = file_get_contents($webUrl);

  //Add custom JS to returned HTML content
  $customJS = "
  <script>

      /* Here I am writing a sample jQuery to hide the navigation menu
         You can write your own jQuery for this content
      */
    //Hide Navigation bar
    jQuery(\".navbar.navbar-default\").hide();

  </script>";

  //Append Custom JS with HTML
  $html = $content . $customJS;

  //Return customized HTML
  return $html;
}