javascript - Axios onUploadProgress 在我的机器上只触发一次

Question

如果我使用这个 fiddle https://jsfiddle.net/v70kou59/1/一切都按预期进行

(function () {
    var output = document.getElementById('output');
    document.getElementById('upload').onclick = function () {
      var data = new FormData();
      data.append('foo', 'bar');
      data.append('file', document.getElementById('file').files[0]);
      var config = {
        onUploadProgress: function(progressEvent) {
          var percentCompleted = Math.round( (progressEvent.loaded * 100) / progressEvent.total );
          console.log(percentCompleted)
        }
      };
      axios.put('/upload/server', data, config)
        .then(function (res) {
          output.className = 'container';
          output.innerHTML = res.data;
        })
        .catch(function (err) {
          output.className = 'container text-danger';
          output.innerHTML = err.message;
        });
    };
  })();

但是，如果我下载 axios 示例存储库并安装回调函数所需的依赖项，onUploadProgress 将不再按预期工作。它仅以“100”触发 onUploadProgress 一次。 https://github.com/axios/axios/tree/master/examples

这可能是我的节点版本吗？看起来一定是我的机器。

Answer 1

我遇到了确切的问题。原因之一(我的情况就是如此)可能是，您的网络速度太快，无法多次触发 progressEvent。

要模拟此情况，请在浏览器的“网络”选项卡上减慢网络速度。

慢速 3G 设置在 Google Chrome/New Edge(开发版本)浏览器上对我有用。

引用图片:

PS:我知道现在回答这个问题已经太晚了。但其他人到达这里后可能会发现这很有帮助。