js实现批量下载文件--点击一次执行多次(利用iframe标签)

 a标签及href指向的如果是一个下载链接,那么相当于下载文件,对于单文件下载还是ok的,不过快速点击几个下载按钮,有的下载会被Cancelled

    <el-dialog
       title="批量录音下载"
      :visible.sync="dialogVisible"
      width="30%"
      :before-close="closeDown"
    >
      <span>请确认一共下载{{ dowmloadNum }}条数据</span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="closeDown">取 消</el-button>
        <el-button type="primary" @click="comfireDown">确 定</el-button>
      </span>
    </el-dialog>
    comfireDown() {
      const triggerDelay = 100;
      const removeDelay = 1000;
      const { createIFrame } = this;
      this.multipleSelection.forEach((item, index) => {
        let url = `http://${item.recordServer}:${this.global_record_hostport}/mulitfiledownload?pathname=${item.recordPath}&filename=${item.callId}&type=${item.recordFileSuffix}`
        createIFrame(url, index * triggerDelay, removeDelay);
      });
      this.dialogVisible = false;
    },
    createIFrame(url, triggerDelay, removeDelay) {
      setTimeout(function () {
        // 动态添加iframe,设置src,然后删除
        const frame = document.createElement("iframe"); //创建a对象
        frame.setAttribute("style", "display: none");
        frame.setAttribute("src", url);
        frame.setAttribute("id", "iframeName");
        document.body.appendChild(frame);
        setTimeout(function () {
          const node = document.getElementById("iframeName");
          node.parentNode.removeChild(node);
        }, removeDelay);
      }, triggerDelay);
    },


版权声明:本文为choupixiaolin原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。