window.postmessage для вложенного iframe в кросс-домене

Question

У меня есть корневая html-страница A (скажем, A.html на foo.com), которая содержит iframe B (скажем B.html на bar.com). iframe B содержит другой iframe C (C.html на foobarfoo.com).

Я пытаюсь уведомить IFrame C, когда пользователь щелкает что-то в родительской странице A.

Так как ребенок плавающих фреймы (B и C) находятся в разных доменах, чем родитель, доступ к свойству Iframe или вызов сценария не является вариантом.

У меня есть контроль над кодом в A.html и C.html и вы можете использовать функцию postmessaging html5 для отправки сообщений. Я попытался отправить postmessage из A в B, который отлично работает, но отправка его непосредственно из A в C - это то, с чем я борюсь.

Если я пытаюсь получить доступ к вложенному iframe C, используя document.parentWindow.frames, я просто получаю только iframe B, а не iframe C. Ожидается ли это?

Если я впервые получил iframe B из DOM, а затем попытаюсь получить iframe C с помощью getElementByID, я получаю доступ к отрицательной ошибке, что очевидно, учитывая, что iframe B находится в другом домене, и запрос его DOM не будет разрешен.

Вот код для обоих вариантов, которые я пробовал ...

Option1

function postMessage1() 
{ 
    var message = new Object; 
    message["MessageId"] = "NewPage"; 
    var messageData = JSON.stringify(message); 

    var domain = 'http://localhost'; 
    var allFrames = document.parentWindow.frames; 
    var iframe = allFrames['frameC']; 

    iframe.postMessage(messageData, domain); -----> iframe is null here as it cannot find any frame with the ID - frameC. 
} 

Option2

function postMessage2() 
{ 
    var message = new Object; 
    message["MessageId"] = "NewPage"; 
    var messageData = JSON.stringify(message); 

    var domain = 'http://localhost'; 
    var proxyFrame = document.getElementById("frameB"); 
    var targetFrame = proxyFrame.getElementById("frameC"); ----> Access denied to getElementByID in frame B as it is from a different domain and accessing its DOM is not allowed. 

    targetFrame.contentWindow.postMessage(messageData, domain); 
} 

Я пытаюсь найти, если есть это решение, использующее window.postMessage. Любая помощь оценивается.

Answer 1

Что нужно сделать, так это получить доступ к iframe C, используя ссылку из свойства frames iframe B. Итак, в основном, вы рекурсивно обращаетесь к свойству frames для A, чтобы получить B, а затем получите доступ к свойству frames B, чтобы получить C:

function postMessage() 
{ 
    var message = new Object; 
    message["MessageId"] = "NewPage"; 
    var messageData = JSON.stringify(message); 

    var domain = 'http://localhost'; 
    var iframeB = document.parentWindow.frames['frameB']; 
    var iframeC = iframeB.frames['frameC']; // or iframeB.frames[0]; if C is the only iframe in B 

    iframeC.postMessage(messageData, domain); 
} 

не пробовал приведенный выше код, но этот вид обхода по дереву фреймов возможно, так как кадры свойство не подпадает под ту же политику происхождения.