Sunday, 14 February 2021

Axios: onUploadProgress event gets only triggered after video is uploaded completely

I am trying to track the progress of video upload and accordingly display it to the user.
This is the axios request that uploads the video.

  const config = {
    onUploadProgress: function (progressEvent) {
      var percentCompleted = Math.round(
        (progressEvent.loaded * 100) / progressEvent.total
      );
      console.group("profileActions.uploadProfileVideoURL");
      console.log("progressEvent.loaded: ", progressEvent.loaded);
      console.log("progressEvent.total: ", progressEvent.total);
      console.log("percentCompleted: ", percentCompleted);
      console.groupEnd();
    },
  };

  axios
    .post("/api/profile/uploadProfileVideoURL", videoData, config)

The problem is that it only gets triggered when video is completely uploaded.
I have found this discussed in this Github Axios Issue:

Only 100% can be fired in case your upload files are too small, or download/upload speed is too fast. Try to upload 10mb file maybe.

So I tried uploading a 100Mb video, and the event still gets triggered at then end of the upload.
Any idea why is this happening?
And can I fine-tune axios for the event to get triggered at certain progress values?



from Axios: onUploadProgress event gets only triggered after video is uploaded completely

No comments:

Post a Comment