Как отправить данные через домен через postMessage?

Question

У меня есть сценарий добавления в iFrame, который находится в другом домене. Я пытаюсь отправить файл загрузки data на страницу, на которой встроен iFrame.

У меня есть следующий код в плавающем фрейме (Uploadify скрипт):

$('#file_upload').uploadify({ 
    //JS CODE 
    'onUploadSuccess' : function(file, data, response) { 
     data //data is what must be passed from the iFrame to the script on another site 
    } 
}); 

data является то, что должно быть передано следующему сценарию на другом домене:

var myframe, nestedFrame; 
myFrame = $('#editorf').contents().find('body'); 
nestedFrame = myFrame.find('#re_contentIframe').contents().find('body'); 
nestedFrame.append('data'); //data should be replaced with the information from the iFrame 

Я попытаться следующее код:

Код iFrame - Страница B

$('#file_upload').uploadify({ 
    //JS CODE for UPLOADIFY 
'onUploadSuccess' : function(file, data, response) { 
    window.postMessage('http://iframe-domain.net/uploads/' + data,'http://iframe-domain.net'); 
     } 
    }); 

Прием кодовой страницы - Страница A

$(function() { 
    window.addEventListener('message', receiver, false); 

    function receiver(e){ 
     if (e.origin == 'http://iframe-domain.net'){ 
      var myframe, nestedFrame; 
      myFrame = $('#editorf').contents().find('body'); 
      nestedFrame = myFrame.find('#re_contentIframe').contents().find('body'); 
      nestedFrame.append(e.data); 
     } 
    } 
}); 

Это не работает. Я это сообщение об ошибке:

Error: Permission denied to access property 'toString' 
...a);if(Z){var Y=0;(function(){if(typeof Z.GetVariable!=D){var ab=Z.GetVariable("$... 

jquery.uploadify.js (line 17) 

Uploadify Скрипт работает, как файл будет загружен, но он не появляется, чтобы передать данные на страницу. Я не уверен, что эта ошибка является причиной того, что страница не работает.

Как это сделать?

EDIT

Чтобы лучше объяснить, вот пример:

Человек идет на страницу А (главная страница). На странице A iFrame встроен на эту страницу. Внутри iFrame есть скрипт uploadify, позволяющий пользователям загружать файл.

Пользователь загружает файл, который сценарий uploadify возвращает имя файла. Пример: 528050f030522.jpg. После того, как скрипт uploadify получит эту информацию, он должен отправить его на скрипт страницы, который затем запускает и вставляет имя файла на страницу.

Answer 1

я, наконец, смог получить эту работу.

Вот что я сделал.

Первый I came across a plugin, который помогает облегчить window.postMessage.

С postMessage plugin я использовал следующий код:

плавающего фрейма JS код

var fileUploaded = data; 
pm({ 
    target: window.parent, 
    type: "message5", 
    data:fileUploaded 
}); 

Полный код с Uploadify Script:

$(function() { 
    $('#file_upload').uploadify({ 
     'swf'  : 'uploadify.swf', 
     'uploader' : '/js/uploadify/uploadify.php', 
     'onUploadSuccess' : function(file, data, response) { 
      var fileUploaded = data; 
      pm({ 
       target: window.parent, 
       type: "message", 
       data:fileUploaded 
     }); 
     } 
    }); 
}); 

окно приема/Родитель Выиграть доу JS код

pm.bind("message", function(data) { 
//Function to insert data onto page 
}); 

Полный код для моей страницы:

pm.bind("message", function(data) { 
    var myframe, nestedFrame; 
    myFrame = $('#editorf').contents().find('body'); 
    nestedFrame = myFrame.find('#re_contentIframe').contents().find('body'); 
    nestedFrame.append('data'); 
}); 

Этот плагин имеет несколько вариантов и упрощен процесс значительно.

Answer 2

В вашем iframe у вас есть window.postMessage(URL,sendingOrgin), но это не то, как вы отправляете данные в другое окно. Если я правильно понимаю this page, вместо этого вы используете otherwindow.postMessage(data,receivingOrigin).

Итак, сначала (в вашем iframe) создайте новый iFrame, дайте ему обработчик события onload и вызовите метод postMessage в этом окне после его загрузки. Что-то вроде этого

var iframe=document.createElement("iframe"); 
iframe.onload=function(){ 
    iframe.contentWindow.postMessage(data,"http://receivingdomain.com"); 
} 
iframe.src="http://receivingdomain.com/receivingPage.html" 

Edit: Кроме того, обратите внимание, что если вы просто хотите послать информацию в одну сторону (и разово за IFRAME), это может быть гораздо проще просто открыть IFRAME с URL http://receivingdomain.com/receivingPage.html?data=... и на странице приема прочитайте его собственное окно. location для извлечения данных ...

Answer 3

Возможно, вы пытаетесь сделать postMessage в том же окне IFrame из вашего окна. На странице A вы слушаете window.addEventListener('message', receiver, false); Это означает, что вы должны отправить ваши данные в это окно. С точки зрения вашей IFRAME эта страница A является родительским окном.Таким образом, вы должны использовать следующий на странице B (страницы IFrame),

window**.parent**.postMessage('http://iframe-domain.net/uploads/' + data,'http://iframe-domain.net');

TL; DR: Просто измените window.postMessage на window.parent.postMessage