• 上传文件到七牛云并限制并发数量


    //并发控制
    arr是文件上传的fileList数组 
    
    
    const limitLoad = (arr, load, limit) => {
      const sequence = [].concat(arr);
      let promise = [];
      promise = sequence.splice(0, limit).map((url, index) => {
        return load(url).then(() => {
          return index;
        });
      });
      let p = Promise.race(promise);
      // for循环给p赋值相当于.then().then()链式调用
      for (let i = 0; i < sequence.length; i++) {
        p = p.then((res) => {
          promise[res] = load(sequence[i]).then(() => {
            return res;
          });
          return Promise.race(promise);
        });
      }
    };
    
    const load = (file) => {
      return new Promise((reslove, reject) => {
        updateFileList(file, reslove);//调用七牛的上传
      });
    };
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    //上传文件
    const updateFileList = async (file, resolve) => {
        //获取视频或者音频时长
        var fileurl = URL.createObjectURL(file);
        var audioElement = new Audio(fileurl);
        audioElement.addEventListener("loadedmetadata", function (_event) {
          file.duration = parseInt(audioElement.duration);
        });
        const config = {
          useCdnDomain: true,
          region: qiniu.region.z2, // 根据地区不同,官网有不同的配置
        };
        const key =
          "uploads/" +
          ("video/mp4".includes(file.name.split(".")[1]) ? "video" : "image") +
          "/" +
          moment().format("YYYY-MM-DD") +
          "/" +
          Math.floor(Math.random() * 99999) +
          "/" +
          file.name;
        const observable = await qiniu.upload(
          file,
          key, //文件名
          UserQiniu.token,
          config
        );
        // 上传视频文件
        observable.subscribe({
          next(res) {
            //上传进度
            ruleForm.fileList.forEach((item) => {
              if (item.raw.uid == file.uid) {
                item.percentage = res.total.percent;
              }
            });
          },
          error(err) {
          },
          complete(res) {
          '''
          '''
            resolve();
          },
        });
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45

    上传文件的几个回调根据自己的情况设置条件即可 参考意义不大
    在这里插入图片描述

  • 相关阅读:
    Vue界面跳转传递参数
    数据结构:二叉树
    ESP8266--Arduino开发(搭建HTTP网络服务器)
    Mathematical optimization
    为什么每个有影响力的内容创作者都需要一个Kadence WordPress网站
    mybatis基础
    centos7安装WordPress
    kswapd0 引起 CPU高占用解决方法
    0. start-资料记录
    ZnMoO4 : Dy3+纳米荧光粉
  • 原文地址:https://blog.csdn.net/regretTAT/article/details/134281802