使用multer上传文件

Question

我正在使用multer上传文件，我的问题是我无法在vue.js中获得响应消息

表格：

<form action="http://localhost:5000/upload" method="post" enctype="multipart/form-data" target="dummyframe" id="upload">

Index.js

const storage = multer.diskStorage({
  filename: function (req, file, cb) {
    if (
        extens == 'mp3' ||
        extens == 'wav' ||
        extens == 'oog' ||
        extens == 'aac' ||
        extens == 'm3u'
      ) {
        cb(null, file.originalname);
        console.log('uploaded')
      } else {
        console.log('invalid extens')
        cb(new Error('Invalid file extension'))
      }
    }
})

const upload = multer({
  storage: storage
});

app.post('/upload', upload.array('file', 10), function (req, res, next) {
  res.send(req.files)
}

除了vue.js中的响应之外，一切都运行得很好。如果出现错误，我不知道如何捕获错误消息。

Answer 1

这不是一个真正的Vue问题，但是要用multer处理错误，你应该写这样的东西-

// it's a working example
const express = require('express');
const multer = require('multer');
const path = require('path');
const app = express();

app.set('port', 3333);

let uploadDir = path.join(__dirname, '/uploads');

const storage = multer.diskStorage({
    destination: function(req, file, cb) {
        cb(null, uploadDir); // Set upload folder here
    },
    filename: function(req, file, cb) {
        cb(null, file.originalname); // Set filename here
    }
});

const upload = multer({
    storage: storage,
    fileFilter(req, file, cb) {
        let ext = file.originalname.split('.').pop();

        if (['mp3', 'wav', 'oog', 'aac', 'm3u'].includes(ext))
            cb(null, true); // success
        else 
            cb(new Error('Invalid file extension')); // error
    }
});

app.post('/upload', function(req, res, next) {
    let f = upload.single('file');

    f(req, res, function(err) {
        if (err instanceof multer.MulterError) {
            // A Multer error
            console.log('A Multer error occurred when uploading.', err);
            res.send('MulterError');
        } else if (err) {
            // An unknown error
            console.log('An unknown error occurred when uploading', err);
            res.send('error');
        } else {
            console.log('success');
            res.send('success');
        }
    });
});

app.listen(app.get('port'), () => {
    console.log(`Example app listening at http://localhost:${app.get('port')}`);
});

此外，您可能想要使用Ajax上传文件，在这里https://developer.mozilla.org/en-US/docs/Web/API/FormData/Using_FormData_Objects FormData会很有帮助