XHR 进度仅在开始时触发

XHR Progress Only Fires At The Start

本文关键字:开始时 XHR      更新时间:2023-09-26

我有一些代码,旨在在缩放客户端后自动上传图像。图像上传得很好,但是,XHR 进度事件在第一次后不会触发。任何帮助将不胜感激。

注意:我正在上传一个jpg的BLOB,如果这可能很重要,他们会将其组装并保存在服务器上。

这是我的代码:

var uploadCameraPhoto = function ( blob, filename, dataUrl ) {
    var xhr = new XMLHttpRequest();
    if ( xhr.upload ) {
     var formData = new FormData() ;
     formData.append( 'file', blob, filename ) ;
     xhr.upload.onprogress = function(e) {
      console.log(e.loaded + ' / ' + e.total);
     } ;
     xhr.onload = function (e) {
      console.log( ( ( xhr.status === 200 ) ? 'uploaded' : ( 'error: ' + xhr.status ) ) );
     } ;
     var action = $( 'upload' ).get( 'action' ) ;
     xhr.open("POST", action, true);
     xhr.setRequestHeader("X_FILENAME", filename);
     xhr.send(formData);
    }
} ;

而不是:

xhr.upload.onprogress = function(e) {
  console.log(e.loaded + ' / ' + e.total);
};

尝试:

function uploadProgress(e) {
  if (e.lengthComputable) {
    console.log(e.loaded / e.total);
  } else {
    console.log('Cannot compute progress.');
  }
}
xhr.upload.addEventListener("progress", uploadProgress, false);