UI progress bar on file download


#1

Hey!
does anyone know how to get the amount of bytes loaded / bytes total => percentage of a FTP download and how to display them into my child process?!
i’m using node-ftp module to connect to my ftp server (and it works good). but i don’t know how to check how many bites it has downloaded and how to create a visual progress bar to show to the user the status of download (i need 3 files to dowload, and it could be great to use stacked bootstrap progress bar for my interface)

thank you


#2

I know this is a bit old, but I recently implemented something similar to my Electron app so I went through a similar issue not long ago (though not with FTP).

The basic idea is to take the total file size, and divide it by the total number of bytes received during the download. Normally you could use something like:

req.on('response', function(data) {
});

To get the total file size, however that doesn’t seem to work with node-ftp streams. However there is a way to do it using another node-ftp function. I was able to make what you’re asking for by using this:

var FTP = require('ftp'),
	fs  = require('fs');

client = new FTP();
client.on('ready', function() {
	client.size('path/to/remote.zip', function(err, size) {
		if (err) {
			throw err;
		}
		client.get('path/to/remote.zip', function(err, stream) {
			var gotten = 0;
			if (err) {
				throw err;
			}

			stream.once('close', function() { client.end(); });

			stream.pipe(fs.createWriteStream('local.zip'));

		    stream.on('data', function(chunk) {
		    	gotten += chunk.length;
		        calcDownload(gotten, size);
		    });
		});
	});
});

client.connect({
	host: 'ip',
	port: 21,
	user: 'user',
	password: 'pass'
});

function calcDownload(gotten, size) {
    var progress = (gotten * 100) / size;
    console.log(progress);
}

What this does is first grab the size of the file, and saves it to a variable. Then it uses stream.on('data') to get the number of bytes sent, and increments a variable holding the total bytes sent during transfer (named gotten). Then it passes it to a small function that just converts to a percent.


#3

I recently implemented this feature in my app.
hope this will help for some one

https://stackoverflow.com/questions/45979518/progress-bar-when-file-download-in-electron-application-using-node-js/46440590#46440590

Thanks
Jk


#4

Thank You, i will take a look :+1: