关于#node.js#的问题：我在前端上传5张图片，express接收multer处理过的图片，然后再用webp-converter压缩图片但是req.files接收到的数组只有1张图片

Question

我在前端上传5张图片，express接收multer处理过的图片，然后再用webp-converter压缩图片
但是req.files接收到的数组只有1张图片。最后的处理结果并没有返回图片的返回地址，请问改该如何解决

前端使用axios上传图片代码

export function uploadimgs(FormData){
    return request({
        url:'/articles/uploadimg',
        method:'post',
        data:FormData,
        // 发送图片格式
        contentType: 'multipart/form-data'
    })
}

express处理

控制层

// 文章内容图片
const postarticlesimg = async (req, res) => {
    //储存图片路径
    const imgurls = [];
    console.log('数组的长度是:',req.files);
    if (req.files.length === 0) {
        res.json({
            code: 400,
            message: '上传文件不能为空！',
        })
        return;
    } else {
        const imgtmp =  converter(req.files[0]);
        if (imgtmp) {
           imgurls.push(imgtmp)
        }
        res.json({
            status: 200,
            message: '上传成功',
            data: {
                imgUrl: imgurls,

            }
        })      }}
module.exports = {
    getArticlesList,
    postimg,
    postarticlesimg
}

中间件
multer中间件

const multer = require('multer')
const path = require('path')
const fs = require('fs')
const storage = multer.diskStorage({
    destination: function (req, file, cb) {
        let date = new Date();
        let year = date.getFullYear();
        let month = (date.getMonth() + 1).toString().padStart(2, '0');
        let day = date.getDate();
        // 上传图片存放的目录
        let dir = "./public/upload/articlesimg" + year + month + day;
        // 判断目录是否存在，没有则创建
        if (!fs.existsSync(dir)) {
            fs.mkdirSync(dir, { recursive: true })
        }
        cb(null, dir);
    },
    // 自定义的文件名
    filename: function (req, file, cb) {
        // var fileFormat = (file.originalname).split(".");
        // cb(null, fileFormat[0] + '-' + Date.now() + "." + fileFormat[fileFormat.length - 1]);
        // 获取文件后缀名
        let fileName = Date.now() + path.extname(file.originalname);
        // fileName是上传文件的文件名
        cb(null, fileName);
    }
    // 
})

//设置过滤规则（可选）
var imageFilter = function (req, file, cb) {
    var acceptableMime = ['image/jpeg', 'image/png', 'image/jpg', 'image/gif']
    if (acceptableMime.indexOf(file.mimetype) !== -1) {
        cb(null, true)
    } else {
        cb(null, false)
    }
}
//设置限制（可选）
const imageLimit = {
    fieldSize: '2MB'
}
// uploadImg.array('file',12),接收以'file'命名的上传文件数组,限制最多上传12个文件
const uploadmany = multer({ storage: storage,fileFilter: imageFilter, limits: imageLimit }).array('images', 12);//file为上传时的name值,例如el-upload要设置name=“file”,element-ui自定义上传的时候需要也要用fs.append("file",file.file),参数一和single（file）里面的参数相同

module.exports = {
    uploadmany
}

    ```

webp-converter中间件

// 压缩图片为webp格式
const webp = require('webp-converter');
const fs = require('fs')
exports.converter =async function  (file) {
  // var img = file.filename; // 图片名字
  var imgType = file.mimetype; // 图片类型
  var url = (file.path).replace(/\\/g, '/'); // 图片地址
  if (imgType == "image/png" || imgType == "image/jpeg") {
    // 压缩转换为webp格式图片 webp.cwebp前两个参数，第一个为原文件地址，第二个为生成的目标文件
    webp.cwebp(url, (file.path).replace(/\\/g, '/').split(".")[0] + ".webp", "-q 80", logging = "-v").then(response => {
      console.log(response);
    })
    // 压缩图片为webp格式后删除原文件
   
    var oldUrl = (file.path).replace(/\\/g, '/'); // 原文件地址
    fs.unlinkSync(oldUrl, function (error) {
      if (error) {
        console.log(error);
        return false;
      }
      console.log('删除文件成功');
      const imgurl = "http://localhost:3008/" + (file.path).replace(/\\/g, '/').split(".")[0] + ".webp"
      console.log("是否返回图片地址", imgurl);
      return imgurl;
    })

  }
}

路由

router.post('/articles/uploadimg',uploadmany,postarticlesimg)