js实时获取文件下载进度

最新推荐文章于 2024-04-25 12:24:01 发布

一只金牛座的崽

最新推荐文章于 2024-04-25 12:24:01 发布

阅读量701

点赞数 5

分类专栏： Js 文章标签： javascript 前端 vue.js

本文链接：https://blog.csdn.net/weixin_43456275/article/details/137061649

版权

Js 专栏收录该内容

25 篇文章 0 订阅

订阅专栏

export default (url) => {
  let xhr = new XMLHttpRequest();
  xhr.open('GET', 'url', true);
  xhr.onprogress = function (e) {
    let percent = Math.floor( e.loaded / e.total * 100); // 下载进度
    console.log(percent, '进度');
  };
  xhr.send();
  xhr.responseType = "arraybuffer";
  xhr.onreadystatechange = event => {
    if(xhr.readyState == 4){
      if (xhr.status == 200){
        const fileName = 'fileName';
        let blob = new Blob([xhr.response], {type: 'video/mp4'}); // 文件类型
        const downLoadLink = document.createElement('a');
        downLoadLink.download = fileName;
        downLoadLink.href = URL.createObjectURL(blob);
        downLoadLink.click();
      }
    }
  }
}