xds ajax文件上传

时间:2011-07-20 13:53:31

标签: jquery ajax cross-domain

希望有人能帮助这个......

我正在建立一个在很多地方消费的网络服务。

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

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

www.mysite.com上的

页面打电话给www.mywebservice.dev(目前它只是回应了一个file_get_contents电话)。

网络服务返回

<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>

注入页面并且没有投诉...

inside processEvent.js是另一个包含jquery.form插件的调用(与上面的调用相同,但显然是diferenct文件)和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

...无论其

在请求条目下的网络标签中,响应是一个JSONObj,如预期的那样发送的详细信息......

任何有关让这个笨蛋得到正确的帮助都会受到欢迎。

拥抱和亲吻所有人。

3 个答案:

答案 0 :(得分:1)

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

答案 1 :(得分:0)

好的,我已经取得了进步!!!!

我正在努力使用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;
});

当iframe内容发生变化时,css会阻止可见性的闪现。

这是从远程服务器提供响应,到目前为止看起来所有数据和文件都已通过。

在萤火虫中,我现在得到:

[jquery.form] state = complete

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

我已经为ajaxSubmit添加了一个完整的选项,但是它还没有触发(即使我在控制台中获得了state = complete mssg)但是当我得到它时,我会过来这个并报告... < / p>

答案 2 :(得分:0)

文档说如果你使用iframetarget,那么它不会尝试处理响应。能够做到这一点真是太好了。