Express+ElementUI实现图片上传

express:

const dir = path.resolve(__dirname, '../public/images');
const SIZELIMIT = 20000000;

var storage = multer.diskStorage({
    destination: function (req, file, cb) {
        cb(null, dir)
    },
    filename: function (req, file, cb) {
        console.log(file)
        cb(null, Date.now() + '-' + file.originalname);
    }
})

var upload = multer({
    storage: storage
})

router.post('/uploadfile', upload.single('file'), (req, res, next) => {
    if (req.file === undefined) {
        return res.send({
            errno: -1,
            msg: 'no file'
        })
    }

    const { size, mimetype, filename } = req.file;
    const types = ['jpg', 'jpeg', 'png', 'gif'];
    const tmpTypes = mimetype.split('/')[1];
    if (size >= SIZELIMIT) {
        return res.send({
            errno: -1,
            msg: 'file is too large'
        })
    }
    file = req.file;
    const url = `http://localhost:3000/images/${file.filename}`
    res.json({
        msg: "success",
        file,
        url
    })
})

vue:

<el-upload
      ref="uploadImg"
      action=""
      :http-request="uploadFile"
      list-type="picture-card"
      :on-success="fileSuccessUpload"
      :on-error="fileError"
      :on-change="checkType"
      :show-file-list="false"
      :with-credentials="true"
      accept="image/jpeg,image/png,image/jpg"
 >
         .....
         
uploadFile(file) {
      console.log("file", file);
      let formData = new FormData();
      formData.append("file", file.file);
      uploadImg(formData).then(
        (res) => {
          console.log("res", res);
          this.urls.push(res.data.url);
        },
        (err) => {
          console.log("err", err);
        }
      );
    },