CODEWITHSUNDEEP
javascriptaxios
user3226932
user3226932

Reputation: 2252

How to measure progress of loading json file from axios call?

In order to measure progress, I'm thinking about doing these two things while making axios call:

  1. get file size while making call to json file
  2. get percentage of file downloaded out of the file size from network tab

So far I just have this where I can get the data but I need some way to get the metadata behind it (the information in the network console like file size, amount downloaded so far)

const request = axios.get('/data');

request.then((response) => {


}

Or is there another way of measuring progress?

Upvotes: 2

Views: 2669

Answers (1)

Emmanuel Mahuni
Emmanuel Mahuni

Reputation: 1964

you just need to pass in a configuration object with the onUploadProgress function:

let progress = 0;
const request = axios.post('/data', {
    onUploadProgress: function(event) {
       progress = Math.round((event.loaded * 100) / event.total);
    }
});

request.then((response) => {
    //
}

then use the progress variable as you wish.

Note: If using a get request use onDownloadProgress as mentioned here

Upvotes: 5

Related Questions