Question

我有这段代码可以在我的电子应用程序中正常运行。它将管理文件上传。该请求由嵌入式php服务器处理，该服务器在macOS上是默认的php开发服务器，在Windows上本地化在一个文件夹中，该文件夹将包含php二进制文件，并将成为我应用程序最终版本的一部分。我已经实现了XMLHttpRequest进度，以向用户显示引导程序4进度栏，并且应该跟踪上传状态。我注意到，每次上传文件时，无论文件大小如何，如果正在进行文件上传，该百分比也将变为100％。有没有办法使它更准确？我正在使用一个自定义类，该类将依赖ftp php函数与服务器联系，然后上传文件，这些文件主要是视频，最大尺寸也可以是400 / 500MB，因此我需要一个准确的百分比来避免用户中止该进程或关闭该应用程序，因为他认为该应用程序已崩溃。

这是我用来制作应用原型的js代码：

<script type="text/javascript">
const bsCustomFileInput = require('bs-custom-file-input');

$(document).ready(function(){

  bsCustomFileInput.init();

  $('#file-uploader').submit(function(e){
    e.preventDefault();

    var formData = new FormData($('#file-uploader')[0]);
    //formData.append('uploaded_file', $('#file-uploader')[0]);
    $('.modal').modal('show');

    $.ajax({
      xhr: function(){
        var xhr = new window.XMLHttpRequest();
        xhr.upload.addEventListener("progress", function(evt){
          if(evt.lengthComputable){
            var percentComplete = evt.loaded / evt.total;
            percentComplete = parseInt(percentComplete * 100);
            console.log(percentComplete);
            $('.progress-bar').css('width',percentComplete+"%");
            $('.progress-bar').html(percentComplete+"%");
              if(percentComplete === 100){

              }
          }
        }, false);
        return xhr;
      },
      type: 'POST',
      url: 'http://127.0.0.1:8000/requestsController.php',
      data: formData,
      processData: false,
      contentType: false,
      cache: false,
      success: function(response){
        $('.modal').modal('hide');
        console.log(response);
      }
    });

  });


});
</script>

XMLHttpRequest上传进度不正确的百分比

0 个答案: