convertBytesToOther.js

// This function converts the byte to the corresponding amount, be it kilo, mega, GB, etc.
const convertWeightByte = (byte) => {
    let sizekiloByte = (byte / 1024);
    let sizeMega = (sizekiloByte / 1024);
    let sizeGigabyte = (sizeMega / 1024);
    let sizeTerabyte = (sizeGigabyte / 1024);
    let sizePetabyte = (sizeTerabyte / 1024);
    let sizeExabyte = (sizePetabyte / 1024);

    if(sizekiloByte > 0 && sizekiloByte <= 1024){
        return {size: sizekiloByte.format(2, false), abbreviation: "KB", name: "kilobyte"};
    } else if(sizeMega > 0 && sizeMega <= 1024){
        return {size: sizeMega.format(2, false), abbreviation: "MB", name: "megabyte"};
    } else if(sizeGigabyte > 0 && sizeGigabyte <= 1024){
        return {size: sizeGigabyte.format(2, false), abbreviation: "GB", name: "gigabyte"};
    } else if(sizeTerabyte > 0 && sizeTerabyte <= 1024){
        return {size: sizeTerabyte.format(2, false), abbreviation: "TB", name: "terabyte"};
    } else if(sizePetabyte > 0 && sizePetabyte <= 1024){
        return {size: sizePetabyte.format(2, false), abbreviation: "PB", name: "petabyte"};
    } else if(sizeExabyte > 0){
        return {size: sizeExabyte.format(2, false), abbreviation: "EB", name: "exabyte"};
    }else{
        return {size: byte.format(2, false), abbreviation: "B", name: "byte"};
    }
}

module.exports = convertWeightByte;

main.js

let loaded; // global variable to know how much we have raised in byte
let interval; // global variable interval
let loadedLast; // last byte uploaded within one second
let file = input.files[0];
let form = new FormData();
    form.append('file', file, file.name);

    // we start the constant interval that runs every second
    interval = setInterval(()=> {
      
        if(loadedLast){ // If there is any starting byte, we enter but we assign it to the first
            
            // We subtract the bytes uploaded so far with the last bytes. That will give us the amount raised in this second
            let byteUpload = loaded - loadedLast; // It returns something like this 5486835465 in bytes
            let {size, abbreviation, name} = convertWeightByte(byteUpload); // With the function that converts from bytes to other types we pass the bytes
            
            /*
              Something like that would return
              size: 500
              abbreviation: "MB"
              name: "megabyte"
            */
        }

        // Here each time we are assigning the new amount uploaded to the variable of last loaded
        loadedLast = loaded;
    }, 1000);

upload("url-upload-file", form, {
    uploadprogress: (e) => {
        if (e.lengthComputable) {
            /* 
              Here every millisecond enters and we assign the amount uploaded in this period of time.
              Since the files are being uploaded in pieces, it will enter every millisecond
            */
            loaded = e.loaded;
        }
    },
    onloadend: (e) => {
        // here at the end of the climb we finish the interval
        clearInterval(interval);
    }
}).then(response => {
    console.log("success", response);
}).catch(error => {
    console.log("error uplaod", error);
})

uploadFiles.js

//This function is an xhr used to upload your files to your server
/*
  route: it will be the path to which you will upload your file
  data: is the file to upload
  object: are some of the states that you can use when uploading a data or file with your xhr
*/
function upload(route, data, { onprogress = null, onloadstart = null, callbackUtils = null, onloadend = null, onabort = false, onload, uploadprogress = false }) {
    return new Promise((resolve, reject) => {
        let xhr = new XMLHttpRequest();

        xhr.open('POST', `${_API_}${route}`);
        xhr.onreadystatechange = function (readyState) {
            if (xhr.readyState == 4) {
                let resp = xhr.responseText;
                xhr.status == 200 ? resolve(resp != '' ? JSON.parse(resp) : true) : reject(resp != '' ? JSON.parse(resp) : true);
            }
        }

        xhr.onerror = (error) => reject(JSON.parse(error));

        if (onload) xhr.onload = onload;
        if (onprogress) xhr.onprogress = onprogress;
        if (onloadstart) xhr.onloadstart = onloadstart;
        if (onloadend) xhr.onloadend = onloadend; // We will use this one that serves to realize when we finish our upload.
        if (uploadprogress) xhr.upload.addEventListener("progress", uploadprogress); // This state will be the one that constantly warns us how much data has been uploaded to our file
        if (onabort) xhr.addEventListener("abort", onabort);
        if (callbackUtils) callbackUtils({ xhr })

        xhr.send(data);
    });
}