Получение ответа от удаленного сервера после загрузки файла в iframe

Question

У меня есть форма, которая загружает файл в фиале на удаленный сервер. В результате при представлении url-сервер возвращает данные json с результатом операции, который мой iframe ловит.

{'result': 'true' or 'false'} 

Теперь я хотел бы получить этот json как обратный вызов моего iframe. Я знаю, что мне нужно jsonp для этого, потому что это межсайтовый вызов. Вот моя функция с примерами кода из IBM' site:

function fileUploadFunction(){  
    var fileUploadForm = $('#file_upload_form'); 
    fileUploadForm.attr('action', uploadURL); 
    fileUploadForm.submit(); 
    $('#upload_target').load(function() { 
     alert("IFrame loaded"); 
      $.getJSON(uploadUrl+"&callback=?", function(data) { 
       alert("Symbol: " + data.symbol + ", Price: " + data.price); 
      }); 
    });   
}; 

Но здесь возникает несколько проблем. Сначала - мой uploadUrl - это просто «http: // something /». Нужно ли мне это для поддержки звонков с суффиксом $callback=?
Во-вторых - сервер дает ответ только в результате загрузки файла. Поэтому мне нужно получить результат, который хранится в моем iframe, а не на указанном URL-адресе. Как это решить?

Вот эта ссылка. Обратите внимание на скрытый iframe внутри формы. Появляется результат с сервера. :

http://ntt.vipserv.org/artifact/

---

EDIT

Я ранее пытался:

$('#upload_target').load(function() { 
     var ret = frames['upload_target'].document.getElementsByTagName("body")[0].innerHTML; 
     var data = eval("("+ret+")"); 
    }); 

Но возникает «разрешения отказано ' ошибка.

Answer 1

Одним из возможных решений может быть установка имени iframe с чистым js. Это имя можно прочитать с родительской страницы обертки.

Answer 2

Похоже, что ваш код запросит uploadURL дважды: во-первых, .submit() выполните запрос POST для загрузки файла, и результат будет показан в iframe в качестве веб-страницы; второй, .getJSON() выполните запрос GET, и результат будет выполнен как javascript в <script>. Вы поймете это, если откроете Firebug при тестировании своего приложения.

Поскольку два запроса независимы, я не знаю, как .getJSON() предоставит вам любую информацию о файле, который вы только что загрузили .submit().

Для такого рода междоменной связи я бы предложил использовать postMessage; в противном случае вам нужно будет изменить рабочий процесс приложения, чтобы делать все в iframe после загрузки файла; например do <script>alert('Submission accepted');</script> в iframe.

Что вы пытаетесь сделать после того, как пользователь успешно загрузил файл?

Answer 3

Это легко сделать с easyXDM, и на самом деле есть сообщение в блоге об этом точном случае использования here.

В сущности, он использует междоменные сообщения для передачи ответа на вызывающий документ.

Update:Here is a link для этого в действии, источник может быть найден в github, файлы с префиксом «upload_».

Answer 4

Рекомендация Sean's easyXDM - отличный вариант (&, вероятно, должен быть помечен как правильный), но я хотел предложить другое легкое решение, которое я не видел никого.

В тех случаях, когда Вы отправляете к скрытому фрейма на другой домен & просто нужен один ответ обратно (не двухсторонняя communcation), вы можете передать сообщение от фрейма к родителю с помощью лопнул URL , Вот пример:

1. родитель загружает IFRAME на другом домене

2. родительские опросы myframe.contentWindow.location.href (постоянно получать Permission denied ошибок, так как фрейм находится на другом домене)

3. Iframe процессы, затем перенаправляется на адрес

   http://parentdomain.com/pagethatdoesnotexist?{'result':'ok'} 
   

4. IFrame получает 404, но теперь место доступно для родителей

5. родитель читает сообщение из URL в IFrame в

Answer 5

не использовать .html() вообще.

Я использовал

jQuery('.someElement') 

и он работал на меня. Вы можете сохранить результат в переменной и вставить ее в новый элемент

например

var = jQuery('.someElement'); 
jQuery('.newElement').html(var);