上传和下载的进度监控

需求

上传下载进度回调

axios.get('/more/get',{
  onDownloadProgress(progressEvent) {
    // 监听下载进度
  }
})
axios.post('/more/post',{
  onUploadProgress(progressEvent) {
    // 监听上传进度
  }
})

实现

声明类型

export interface AxiosRequestConfig {
  onDownloadProgress?: (e: ProgressEvent) => void
  onUploadProgress?: (e: ProgressEvent) => void
}

添加onprogress回调

if (onDownloadProgress) {
  request.onprogress = onDownloadProgress
}

if (onUploadProgress) {
  request.upload.onprogress = onUploadProgress
}

配置测试接口

const multipart = require('connect-multiparty')

app.use(
  multipart({
    uploadDir: path.resolve(__dirname, 'upload-files')
  })
)

// grogress 上传进度
router.post('/more/upload', function(req, res) {
  console.log(req.body, req.files);
  res.json('upload ok')
})