Question

在客户端，我有一个File-Dropzone（HTML5文件-API），用户可以删除应该上传到服务器的多个文件。对于每个文件，都会创建一个新的XMLHttpRequest对象，并将该文件异步发送到服务器。我正在通过xhr.upload对象上的 progress 事件监听器来监控进度。

问题是，到目前为止服务器端需要同步获取文件，因为有一些计算发生必须在服务器端一个接一个地完成，不幸的是我无法更改该实现。但是，如果我将xhr对象设置为同步发送文件，我在进度事件中注册的功能将不再触发，因此我无法监视进度。

任何人都可以帮忙吗？（如果有使用 jQuery 的原生功能的解决方案，我也可以使用它。）

这是我目前正在使用的代码的重要部分：

for (var i = 0; i < files.length; i++) {
           var file = files[i];                              

           var xhr;
           if (window.XMLHttpRequest)
              xhr=new XMLHttpRequest();
           else
              xhr=new ActiveXObject("Microsoft.XMLHTTP");

           xhr.upload.addEventListener('progress',function(ev){
               var percent = Math.round((ev.loaded/ev.total) * 100);                                       
               console.log(i + " : " + percent + "%");                                     
               progress.style.width = percent +'%';   
               if(progressHtml)
                   progressHtml.innerHTML = i + "/" + files.length + " : " + percent + "%";
            }, false);

            xhr.open("post", "/servlet/de.test.UploadDropServ", false); //synchronous                                    
            xhr.setRequestHeader("Filename", file.name);
            xhr.setRequestHeader("UniFilename", file.name);            
            xhr.send(file);          

            xhr.addEventListener("load", function () {                    
                progress.style.width = "100%";                                      
            }, false);                                                                                               
         }
     }

Answer 1

所以现在的问题是你不希望它是异步的。

当您将请求设置为同步时，javascript将等到完成之后再执行任何其他操作，包括进度回调。

如果您希望进度回调起作用，则需要它是异步的。为此，您有两个解决方案：

1：如果服务器端是PHP，启动会话但不要关闭它，它将是同步的。

2：在客户端，创建一个文件堆栈，一次上传和上传一个文件，在前一个“完整”回调中调用下一个文件。

监视同步XMLHttpRequest调用的进度

1 个答案: