Javascript Axios正常获取请求进度 我想做的是:

Javascript Axios正常获取请求进度 我想做的是:,javascript,vue.js,axios,Javascript,Vue.js,Axios,我正在使用Vue和Axios,我试图在控制台中显示进度百分比 问题是: 请求本身需要4秒或更长时间,因为它会获取大量数据并将其存储到excel中,然后下载 我所尝试的: 我在Axios中找到了两种方法:onDownloadProgress和onUploadProgress onDownloadProgress功能工作正常,但只有在下载开始时,而不是在后端将数据提取到excel文件时(这占用了大部分时间) 以下是前端代码: 夏季: 我的进度将分为两部分: 下载进度(将使用onDownloadPr

我正在使用Vue和Axios,我试图在控制台中显示进度百分比

问题是: 请求本身需要4秒或更长时间,因为它会获取大量数据并将其存储到excel中,然后下载

我所尝试的: 我在Axios中找到了两种方法:
onDownloadProgress
onUploadProgress

onDownloadProgress
功能工作正常,但只有在下载开始时,而不是在后端将数据提取到excel文件时(这占用了大部分时间)

以下是前端代码: 夏季: 我的进度将分为两部分:

  • 下载进度(将使用
    onDownloadProgress
  • 请求进度(正在准备下载Excel文件)

我们不知道服务器需要多长时间才能做出响应您无法在该时间点显示进度条的百分比,如果是流式数据,我们可以显示进度,为此,您可以在调用之前模拟这种效果,设置进度条的状态显示,然后在设置的间隔方法中放入一些随机百分比,然后在获得响应后重新计算并从该点继续进度状态

this.progress =true;
let interval = setInterval(()=>{
this.progressPercentage = randomFunction()
 // some random calculation for progress
},500)
axios.get(url)
.then(()=>{
   clearInterval(interval);
   // User your progress event object 
})
this.progress =true;
let interval = setInterval(()=>{
this.progressPercentage = randomFunction()
 // some random calculation for progress
},500)
axios.get(url)
.then(()=>{
   clearInterval(interval);
   // User your progress event object 
})