首页 > 解决方案 > 我如何使用 vue 和 nodejs 上传超过 500 个文件,每个 512kb

问题描述

我目前在一个健康科技平台工作,该平台要求用户最多上传 700 次扫描。我编写了一个强大的文件上传器,我尝试上传 481 次扫描,只有 301 个文件保存在服务器中。我还将这些文件上传到 s3 存储桶,也只有 187 个文件上传到那里。服务器不会崩溃,也不会给出任何类型的错误,它只是在中间停止,我什至不能用 ctrl+c 终止进程。我一直在使用 aws ec2 实例 g4dn。这是我用作后端的代码

exports.uploadNewScans = async (req, res) => {
  var params = {
    Bucket: process.env.BUCKET_NAME,
    CreateBucketConfiguration: {
      LocationConstraint: process.env.REGION,
    },
  };

  await s3.createBucket(params, function (err, data) {
    if (err) console.log(err, err.stack);
    else console.log("Bucket Created Successfully", data.Location);
  });
  var fileArray = [];
  var folder_name;
  var ResponseData = [];
  let date;
  let uid;
  const d = new Date();
  const form = new formidable.IncomingForm({
      multiples: true,
      keepExtensions: true,
    }),
    files = [],
    fields = [];

  form.on("field", (fieldName, fieldValue) => {
    if (!fieldValue) {
      return res.status(401).json({
        error: "This field is required",
      });
    }
    fields.push([fieldName, fieldValue]);
    uid = fieldValue;
    date = `${d.getDate()}-${d.getMonth() + 1}-${d.getFullYear()}`;
    folder_name = `../uploads/${fieldValue}/${date}/scans/`;
    mkdirp.sync(path.join(__dirname, folder_name));
    form.uploadDir = path.join(__dirname, folder_name);
  });
  form.on("file", (field, file) => {
    try {
      fileArray.push(file);
      files.push([field, file]);
      fileArray.map(async (item) => {
        let fileContent = fs.readFileSync(item.path);
        params = {
          LocationConstraint: process.env.REGION,
          Bucket: `${process.env.BUCKET_NAME}`,
          Key: `/${uid}/${date}/` + item.name,
          Body: fileContent,
          ACL: "public-read",
        };

        const data = await s3.upload(params).promise();
        ResponseData.push(data);
        console.log("upload done");
      });
    } catch (err) {
      console.log(err);
      return res.status(400).json({
        error: "There was an error uploading to s3",
      });
    }
  });
  form.on("end", async () => {
    console.log("done");
    await runAlgorithm(uid, date, res);
  });
  form.parse(req);
};

前端代码是:

async upload() {
  if (this.uid == "") {
    this.makeToastForUID();
  }
  if (this.files.length == 0) {
    this.makeToastForFiles();
  }
  if (this.files.length > 0 && this.uid != "") {
    this.isLoading = true;
    let files = this.files;
    var formData = new FormData();
    formData.append("patientUID", this.uid);
    files.map((file) => {
      formData.append("scans", file);
    });
    await axios
      .post(`${this.user.centerId}/upload`, formData, {
        headers: {
          "Content-Type": "multipart/form-data",
        },
      })
      .then(async (success) => {
        this.isLoading = false;
        console.log("The files have beeen successfully uploaded", success);
        let d = new Date();
        let date =
          d.getDate() + "-" + (d.getMonth() + 1) + "-" + d.getFullYear();
        await axios
          .post(`${this.user.centerId}/getImages`, {
            patientUID: this.uid,
            date: date,
          })
          .then((data) => {
            console.log(data);
            this.$store.commit("setPatientScans", {
              processedImages: data.data.processedImages,
              unprocessedImages: data.data.unprocessedImages,
              percentage_left: Math.round(data.data.percentage_left),
              percentage_right: Math.round(data.data.percentage_right),
              percentage_total: Math.round(data.data.percentage_total),
              patientUID: data.data.patientUID,
              date: data.data.date,
              scan_report: "",
            });
            this.$router.push({
              name: "ShowImages",
            });
          })
          .catch((error) => {
            this.isLoading = false;
            console.log(error);
          });
      })
      .catch((error) => {
        console.log("There was an error uploading the files", error);
      });
  }
},

标签: javascriptnode.jsvue.jsfile-uploadformidable

解决方案


推荐阅读