jQuery-File-Upload iframe后备检测

时间:2013-05-30 11:41:49

标签: jquery iframe file-upload blueimp cloudinary

https://github.com/blueimp/jQuery-File-Upload

使用blueimp的jQuery-File-Upload

我的应用程序在许多旧版浏览器上运行。文件上传有很多兼容性约束。 我想简单地检测文件上载器何时优雅地使用iframe传输。 我想在使用fileupload的jQuery中检测到这个,类似于这个例子:

var using_iframe_transport = false;

this_file_input.fileupload({
  dataType: 'json',
  url: "http://api.cloudinary.com/v1_1/my_account/image/upload",

  //as we send the file upload, record whether it is using iframe
  send: function (e, data) {
    if (e.iframe_fallback){ //is there a variable like this that exists in the plugin?
      using_iframe_transport = true;
    }
  }
});//end fileupload

if (using_iframe_transport){
  //do something
}

可以在'progress','done'或'always'回调中使用此代码:

...
  progress: function(e){ //or 'done' or 'always'
    if($('iframe').length){
      using_iframe_transport = true;
    }
  }
...

但是,这些回调并不总是按照https://github.com/blueimp/jQuery-File-Upload/issues/461#issuecomment-9299307

报告的那样进行

我最关心的是支持IE6和Android 2.3默认浏览器。谢谢!

2 个答案:

答案 0 :(得分:3)

看起来控制是否使用iframe的方法是_initDataSettings,它使用_isXHRUpload来确定是否使用它。由于这是一个私有方法,无法在外部调用,因此可以使用以下命令:

options = this_file_input.fileupload('option');
use_xhr = !options.forceIframeTransport &&
            ((!options.multipart && $.support.xhrFileUpload) ||
            $.support.xhrFormDataFileUpload);

如果use_xhr为false,则使用iframe传输。

或者,如果您可以等到发送事件,则可以查看data.dataType,如果它以“iframe”开头,则表示您正在使用iframe后备。

答案 1 :(得分:0)

  1. 这是可能的。但是,它必须在fileupload插件的异步上下文中完成。如果您希望使用布尔变量using_iframe_transport,则必须在插件中的回调的上下文中使用它。在每个块中使用console.log来查看哪个块首先执行。

  2. 我会尝试使用add回调,因为只要添加文件就会调用它。

    var using_iframe_transport = false;
    
    this_file_input.fileupload({
      dataType: 'json',
      url: "http://api.cloudinary.com/v1_1/my_account/image/upload",
    
      //as we send the file upload, record whether it is using iframe
      send: function (e, data) {
        if (e.iframe_fallback){ //is there a variable like this that exists in the plugin?
          /*
            This is being set within the asynchronous context of the plugin.
          */
          using_iframe_transport = true;
        }
      }
    });//end fileupload
    
    /*
      This is a synchronous process and is being evaluated prior 
      to the plugin callbacks being executed. This logic needs to be
      used within a callback function.
    */
    if (using_iframe_transport){
      //do something
    }