xxxxxxxxxx
'use strict'
const Fs = require('fs')
const Path = require('path')
const Axios = require('axios')
const ProgressBar = require('progress')
async function downloadImage () {
const url = 'https://unsplash.com/photos/AaEQmoufHLk/download?force=true'
console.log('Connecting …')
const { data, headers } = await Axios({
url,
method: 'GET',
responseType: 'stream'
})
const totalLength = headers['content-length']
console.log('Starting download')
const progressBar = new ProgressBar('-> downloading [:bar] :percent :etas', {
width: 40,
complete: '=',
incomplete: ' ',
renderThrottle: 1,
total: parseInt(totalLength)
})
const writer = Fs.createWriteStream(
Path.resolve(__dirname, 'images', 'code.jpg')
)
data.on('data', (chunk) => progressBar.tick(chunk.length))
data.pipe(writer)
}
downloadImage()
xxxxxxxxxx
const config = {
onUploadProgress: progressEvent => console.log(progressEvent.loaded)
}
xxxxxxxxxx
//get use the onDownloadProgress, other requests use the onUploadProgress. (Please mention me for any corrections)
import Axios from 'axios';
function makeRequest () {
config={
function onUploadProgress (ev) {
console.log(ev);
let percentCompleted = Math.floor((progressEvent.loaded * 100) / progressEvent.total);
// do whatever you like with the percentage complete
// maybe dispatch an action that will update a progress bar or something
// do your thing here
}
function onDownloadProgress(ev) {
console.log(ev);
// do your thing here
}
}
axios.post('/to/path', data, yourConfigIfAny)
.then(({ data }) => {
console.log(data);
});
}