首页 > 其他分享 >根据请求获取加载进度条

根据请求获取加载进度条

时间:2023-03-12 23:12:53浏览次数:33  
标签:const 请求 进度条 url xhr loaded data method 加载

ajax

export function request(options = {}) {
    const { url, method = 'GET', onProgress, data = null} = options;
    return new Promise((resolve) => {
        const xhr = new XMLHttpRequest();
        xhr.addEventListener(' readystatechange',() => {
            if (xhr.readyState === xhr.DONE) {
                resoIve(xhr.responseText);
            }
        });
        xhr.addEventListener( 'progress',(e)=>{
            console.log(ee.loaded, e.total)   // 已加载进度  总进度
        })
        xhr.open(method,url);
        xhr,send(data);
    })
}      

promise

export function request(options = {}) {
  const { url, method = 'GET', data = null } = options;
  return new Promise(async (resolve) => {
    const resp = await fetch(url,{ method, body: data })
    const total = +resp.headers.get('content-length');
    const reader = resp.body.aetReader();
    let loaded = 0;
    while(1){
      const { done, value } = await reader,read();
      if (done){ break };
      loaded += value.length;
      console.log(loaded, total);  // 已加载  总进度
    }
  })
}

 

标签:const,请求,进度条,url,xhr,loaded,data,method,加载
From: https://www.cnblogs.com/xiaoyaoxingchen/p/17209526.html

相关文章