本文介绍了XMLHtt prequest等级2 - 确定性,如果上传完毕的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用AJAX的文件上传。之后,文件上传,PHP应该检查(哑剧,大小,病毒(clamscan)及以上) - 这需要几秒钟的更大的文件。当文件被上传,HTML5 <进度> 充盈,当文件准备和PHP开始检查,进度应该切换到不确定的。我认为对的方式来做到这一点(这两项做的没有的工作):

I am using ajax for file uploads.After the file is uploaded, php should check it (mime, size, virus (clamscan) and more) - this takes some seconds for larger files. While the file is uploading, a HTML5 <progress> is filling, when the file is ready and PHP starts checking, the progress should switch to indeterminate. I thought of to ways to do this (which both do not work):

检查upload.onload事件

xhr.upload.addEventListener("load", function (e) {
    $("#uploadprogress").attr("value", false);
    $("#uploadprogress").attr("max", false);
    $("#progress").text("Checking file...");
});

这是不行的,因为的onload -event firest当请求已经产生,而不是当上载已准备就绪。

This doesn't work, because the onload-event firest when the request is ready, not when upload is ready.

检查是否上传进度百分比= 100%

xhr.upload.addEventListener("progress", function (e) {
    if (e.lengthComputable && e) {
        p = (e.loaded / e.total);
        if (p==1) {
            $("#uploadprogress").attr("value", false);
            $("#uploadprogress").attr("max", false);
            $("#progress").text("Checking file...");
        } else {
            var percent = Math.ceil(p * 1000) / 10;
            $("#uploadprogress").val(e.loaded);
            $("#uploadprogress").attr("max", e.total);
            $("#progress").text("Uploading... " + percent + "%");
        }
   }
}
});

这是不行的,因为上传百分比有时停在约。 97%,尽管载完成和PHP开始处理文件

This does not work, because the upload percentage sometimes stops at approx. 97%, despite the upload is finished and PHP starts handling the files

有另一种可能性,检查这个?

Is there another possibility checking this?

推荐答案

你要听的就是 readystatechange XHR对象上(而不是在XHR.upload)事件。 的readyState 4 当上传完成发送 服务器关闭连接的。 loadend / 负荷当上传完成后,无论服务器是否关闭连接火灾。仅供参考,在这里,你可以听的事件,当他们开火:

The event you want to listen to is readystatechange on the XHR object (not on XHR.upload). readyState is 4 when the upload has finished sending and the server closes the connection. loadend/load fire when the upload has finished regardless of whether the server closes the connection. Just for reference, here are the events you can listen to and when they fire:

    var xhr = new XMLHttpRequest();

    // ...
    // do stuff with xhr
    // ...

    xhr.upload.addEventListener('loadstart', function(e) {
      // When the request starts.
    });
    xhr.upload.addEventListener('progress', function(e) {
      // While sending and loading data.
    });
    xhr.upload.addEventListener('load', function(e) {
      // When the request has *successfully* completed.
      // Even if the server hasn't responded that it finished.
    });
    xhr.upload.addEventListener('loadend', function(e) {
      // When the request has completed (either in success or failure).
      // Just like 'load', even if the server hasn't
      // responded that it finished processing the request.
    });
    xhr.upload.addEventListener('error', function(e) {
      // When the request has failed.
    });
    xhr.upload.addEventListener('abort', function(e) {
      // When the request has been aborted.
      // For instance, by invoking the abort() method.
    });
    xhr.upload.addEventListener('timeout', function(e) {
      // When the author specified timeout has passed
      // before the request could complete.
    });

    // notice that the event handler is on xhr and not xhr.upload
    xhr.addEventListener('readystatechange', function(e) {
      if( this.readyState === 4 ) {
        // the transfer has completed and the server closed the connection.
      }
    });

这篇关于XMLHtt prequest等级2 - 确定性,如果上传完毕的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

07-21 00:52