在冗长的服务器端处理文件之前,如何知道ajax文件上传何时完全完成

时间:2015-07-26 15:18:44

标签: php jquery ajax file-upload

我使用JQuery,ajax和FormData上传文件,在服务器端使用PHP。文件上传有效,我有一个在上传过程中成功更新的进度条。但是,当文件很小或网络连接速度很快时,收到的最后一个进度事件可能不是100%(可能小于90%)。这是一个问题,因为我想在文件传输后更改进度条文本以指示正在进行服务器端处理(将PDF转换为图像,这可能需要一些时间)。

有什么方法可以让我知道文件传输何时完成,这样我就可以确保进度条没有卡在匿名/急躁诱导/哦 - 没有停止工作 - 更好刷新 - 并且在整个服务器端处理期间再次尝试89%?

我的上传代码,以防相关(我为了简洁而删除了beforeSendsuccesscomplete):

var formData = new FormData($('#form-file-upload')[0]);
$.ajax({
  url: 'ajax/file-upload.php',
  type: 'POST',
  dataType : "json",
  xhr: function() {
    var myXhr = $.ajaxSettings.xhr();
    if(myXhr.upload){
      myXhr.upload.addEventListener('progress', function(e){
        if(e.lengthComputable){
          var percent = (100*e.loaded/e.total).toFixed(0);
          $('#form-file-upload-progress-percent').html(percent + ' %');
          $('#form-file-upload-progress-bar').attr('aria-valuenow', percent).css({width: percent + '%'});
        }
      }, false);
    }
    return myXhr;
  },
  beforeSend: // code executed before submission
  success: // code executed after successful server-side processing
  complete: // code executed after server-side processing
  data: formData,
  cache: false,
  contentType: false,
  processData: false
});

1 个答案:

答案 0 :(得分:0)

upload具有与主要xhr相同的事件。所以myXhr.upload.addEventListener("load", uploadComplete);是您要寻找的。