axios监听上传进度

axios中提供了onUploadProgress回调函数,可以在此函数中实现监听文件的上传进度 tips: Axios的本质是XHR的promise封装,所以XHR的一些函数对它也同样适用。 上传请求的请求头中Content-Type必须为multipart/form-data,但有时还需要加上其

axios中提供了onUploadProgress回调函数,可以在此函数中实现监听文件的上传进度

tips:

  • Axios的本质是XHR的promise封装,所以XHR的一些函数对它也同样适用。
  • 上传请求的请求头中Content-Type必须为multipart/form-data,但有时还需要加上其他参数
axios
 .post("/api/file/uploadfile", form, {
   headers: {
     "Content-Type": "multipart/form-data",
   },
   onUploadProgress: (progressEvent) => {
     if (progressEvent.lengthComputable) {
       this.progresss = Math.round(
         (progressEvent.loaded / progressEvent.total) * 100
       );
     }
   },
 })
 .then((res) => {
   // ...
 });
LICENSED UNDER CC BY-NC-SA 4.0
Comment