javascript - 在 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/

---

编辑

我以前试过:

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

但它会引发“权限被拒绝”错误。

Answer 1

这很容易用 easyXDM 完成实际上有一篇关于这个确切用例的博客文章 here .

本质上，它所做的是使用跨域消息传递将响应中继到调用文档。

更新: Here is a link对于实际操作，可以在 github 找到源代码。 ，文件的前缀为“upload_”。