xds ajax文件上传

Question

希望有人可以帮助解决这个问题...

我正在构建一个可在许多地方使用的网络服务。

www.mywebservice.dev 和 www.mysite.dev 在我的本地计算机上设置以在野外复制真实的东西...

我正在使用动态脚本标记方法来允许我发布包含文件上传到第二个的表单服务器。

www.mysite.com 上的页面调用 www.mywebservice.dev （目前它只是回显 file_get_contents 调用）。

Web 服务返回，

<script script type="text/javascript">
$(function(){
    var $scrpt = $('<script><\/script>');
    $scrpt
        .attr('type' , 'text/javascript')
        .attr('src','http://www.mywebservice.dev/_assets/script/processEvent.js');
$('head').append($scrpt);

});
</script>
<form id=£event-form" ... >
.......
</form>

它被注入到页面中，没有任何投诉...

在 processEvent.js 内部是另一个包含 jquery.form 插件的调用（与上面的调用相同，但显然文件不同）和 ajax 调用：

$('#event-form').bind('submit',function(){
    $(this).ajaxSubmit({
        url     : 'http://www.nmssys.dev/webservices.php',
        type    : 'POST' ,
        data    : { ajax : 'true' , webservice : 'processEvent' } ,
        success : function( response ){
                      consloe.log( ' WOOHOO ' , response );
                  },
        error   : function( jqXHR , textStatus , errorThrown ){
                      console.log( ' BORKED ' , jqXHR , textStatus , errorThrown );
                  }
    });
    return false;
});

到目前为止一切顺利...

现在，当触发提交时，我得到一些奇怪的结果。

根据文档 jquery.form 将自动创建一个 iframe 来容纳文件上传。提交时，我从 firebug 获得以下信息...

控制台：

[jquery.form] state = uninitialized
[jquery.form] cannot access response document: Error: Permission denied to access property 'document'
[jquery.form] aborting upload... aborted
BORKED Object { aborted=1, status=0, more...} aborted server abort
[jquery.form] state = interactive

但是...

在请求条目下的 Net 选项卡中，响应是一个 JSONObj，如预期的那样，包含发送的帖子的详细信息...

有关获取此混蛋的任何帮助正确的将是最受欢迎的。

拥抱和亲吻所有人。

Answer 1

将响应数据返回到父页面的解决方案是使用 jquery postmessage 插件

Answer 2

好吧我有进步了！！！！

我一直在努力解决 iframetarget 选项，这是管理文件上传响应的方式。浏览器正在打开一个新选项卡，而不是将输出传递到指定的 iframe 中。

解决方案...动态创建 iframe 并将其附加到正文...

$('<iframe name="iframeUploader"/>')
    .prependTo('body')
    .attr({'id': 'responseTarget'})
    .css({'width':'1px','height':'1px','position':'absolute','left':'-9999px','top': '-9999px'});

并像这样修改提交：

$('#nms-event-form').live('submit',function(){
    $(this).ajaxSubmit({
        url          : 'http://www.mywebservice.dev/webservices.php' ,
        type         : 'POST' ,
        dataType     : 'xml' ,
        data         : { ajax : 'true' , webservice : 'processEvent' } ,
        success      : function( response , status ){
                           consloe.log( ' WOOHOO ' , response );
                       } ,
        error        : function( jqXHR , textStatus , errorThrown ){
                           console.log( ' BORKED ' , jqXHR , textStatus , errorThrown );
                       } ,
        complete     : function(){
                           console.log($('#responseTarget').html());
                       } ,
        iframeTarget : '#responseTarget'
    });
    return false;
});

CSS 只是防止 iframe 内容更改时可见性闪烁。

这正在传递来自远程服务器的响应，到目前为止，看起来所有数据和文件都已传递。

在 firebug 中，我现在得到：

[jquery.form] state = complete

并且响应数据可以在 iframe 中看到...

我已经向 ajaxSubmit 添加了一个完整的选项，但到目前为止它还没有触发（即使我在控制台中得到了状态 = 完整的消息）但我'我会解决这个问题并在收到后报告...

Answer 3

文档说，如果您使用 iframetarget，那么它不会尝试处理响应。如果还能做到这一点就好了。