JQuery file upload iframe method

Question

I'd like to set up a cross-domain file upload solution that is IE8 compatible. I've been using blueimp's JQuery File Upload plugin with the iframe transport option.

The upload works well, but I'm not able to get the results of the upload from the server side. The redirect option to a result.html file for parsing seems like the solution, but the problem is that I will not have access to the server hosting the form to deploy an HTML file. In this case, is there any other way to retrieve the results of the upload without deploying an HTML file to the origin server?

Answer 1

Inside the javascript file you can add this event listener (for non-jQuery way see this answer)

$(window).on('message', function(e){
    var data = e.originalEvent.data || e.originalEvent.message;

    data = JSON.parse(data); //only if you did JSON.stringify for the data you sent
    //do what you need with the message you send.
});

Next when the upload is done you can either write this to the page or redirect the iframe to another page that has this content on it.

window.parent.postMessage('File Upload Done', '*');

If you need to send more data to the parent you need to JSON.stringify the content first (old IE and FF don't allow objects, just strings.)

window.parent.postMessage(JSON.stringify({'success': true, 'id': 1942}), '*');