Question

我已经为同样的问题看了很多答案，但我还没有找到合适的解决方案。我正在尝试创建一个可以使用express和multer上传文件的Web应用程序，我遇到的问题是没有文件被上传，req.file总是未定义。

我的代码

'use strict';

var express = require('express');
var path    = require('path');
var multer  = require('multer')
var upload  = multer({ dest: 'uploads/' })

var app = express();
require('dotenv').load();

app.use(express.static(path.join(__dirname, 'main')));

app.post('/upload', upload.single('upl'), function (req, res, next) {
  // req.file is the `avatar` file
  // req.body will hold the text fields, if there were any
  console.log(req.file);
  res.status(204).end();
})

var port = process.env.PORT || 8080;
app.listen(port,  function () {
    console.log('Node.js listening on port ' + port + '...');
});

表格

    <form class="uploadForm" action="/upload" method="post" enctype="multipart/formdata">
        <label class="control-label">Select File</label>
        <input name="upl" id="input-1" type="file" class="file">
        <input type="submit" value="submit" />
    </form>

非常感谢，这让我发疯。

Answer 1

如果是邮递员，请尝试以下操作：

关闭API的邮递员标签
再次打开新标签
重建API请求，然后发送。

这可能会解决问题。每次重新启动服务器时，都需要执行上述步骤再次调用API。 multer的原因是将一些名为connect.sid的cookie发送回客户端，这可能需要进一步通信。使用旧cookie不会上传文件。

Answer 2

您的enctype略有不正确，应该是multipart/form-data而不是multipart/formdata。

Answer 3

我把MY（有很多我想象的，肯定更好的）解决方案用来帮助很多像我这样的人，因为我在整整一天都进行了搜索; - （

//JS file on node side

var express = require('express');
var fileUpload = require('express-fileupload');
var fs = require("fs");
var app = express();
console.log('étape 0');
app.use(express.static('mesStatic'));
app.use(fileUpload());
console.log('étape 1');
app.get('/indexFileUpload.htm', function (req, res) {
   res.sendFile( __dirname + "/" + "indexFileUpload.htm" );
})
console.log('étape 2');
app.post('/file_upload', function (req, res) {

   console.log('étape 3');
   console.log('req.files:' , req.files);
   if (!req.files) {
       res.send('No files to upload.');
       return;
   }

   console.log('req.files.file.data:' , req.files.file.data);
   var bufDataFile = new Buffer(req.files.file.data, "utf-8");
   console.log('étape 3.1');
   console.log('__dirname : ' + __dirname);
   fs.writeFile(__dirname + '/file_upload/output.txt', bufDataFile,  function(err) {
      if (err) {
         return console.error(err);
      }
      else {
         console.log("Data written successfully !");
      }      
      console.log('étape 4');
      res.end('Fin OK !!!');  
   })
})
var server = app.listen(8081, function () {
   var host = server.address().address
   var port = server.address().port

   console.log("Example app listening at http://%s:%s", host, port);
})

Answer 4

HTML文件，

<form class="uploadForm" action="/upload" method="post" enctype="multipart/form-data">
    <label class="control-label">Select File</label>
    <input name="upl" id="input-1" type="file" class="file">
    <input type="submit" value="submit" />
</form>

<强> app.js

var express=require("express");
var multer=require("multer");
var app=express();
var upload=multer({dest:"uploads/"});
app.post("/upload",upload.single("upl"),function(req,res){
console.log("Uploaded Successfull with filename : "+req.upl.filename);
});

Answer 5

是的，您的enctype错了，这是唯一的问题。确保您更正了enctype，否则您可能在req.file或req.files中未定义。

Answer 6

对我们而言，这是因为我们在multer之前使用express-http-proxy来代理呼叫，我们需要使用parseReqBody: false选项正确发送文件。

即

app.post('file/upload', proxy(process.env.API_URL, {
  parseReqBody: false,
}))

Answer 7

大家好，我也浪费了24小时，并且遇到了相同的错误，即 req.file未定义。现在，您可以参考下面的代码来检查您的解决方案。这是单个文件演示代码，用于在Node和Postman中使用multer上传文件。在POSTMAN中，选择POST方法并选择form-data，并且键名应为'profile'。

var express = require('express');
const app = express();
const port = 3000;
var multer = require('multer');
var upload = multer({dest:'uploads/'});
var storage = multer.diskStorage({
    destination: function(req, file, cb) {
        cb(null, './uploads');
     },
    filename: function (req, file, cb) {
        cb(null , file.originalname);
    }
});
var upload = multer({ storage: storage })

app.post('/single', upload.single('profile'), (req, res, error) => {
    try {
      console.log(req.file);
      res.send(req.file);
    }catch(err) {
      res.send(400);
    }
  });
app.get('/', (req, res) => {
    res.send('hello Guys');
});
app.listen(port, () => {
    console.log('listening to the port: ' + port);
});

Answer 8

如果您使用 document 中提到的错误处理，那么 req.file 将是未定义的。

同时使用错误处理和检查文件是否存在的另一种方法是使用快速错误处理：

index.js

const express = require("express");
const bodyParser = require("body-parser");
const upload = require("./upload");
const multer = require("multer");

const app = express();

app.use(bodyParser.urlencoded({ extended: true }));

app.get("/", function (req, res) {
  res.send("Hello World");
});

app.post("/upload_file", upload.single("file"), function (req, res) {
  if (!req.file) {
    throw Error("FILE_MISSING");
  } else {
    res.send("success");
  }
});

//Express Error Handling
app.use(function (err, req, res, next) {
  if (err instanceof multer.MulterError) {
    res.statusCode = 400;
    res.send(err.code);
  } else if (err) {
    if (err.message === "FILE_MISSING") {
      res.statusCode = 400;
      res.send("FILE_MISSING");
    } else {
      res.statusCode = 500;
      res.send("GENERIC_ERROR");
    }
  }
});

const server = app.listen(8081, function () {
  const port = server.address().port;

  console.log("App started at http://localhost:%s", port);
});

upload.js

const multer = require("multer");
const storage = multer.diskStorage({
  destination: function (req, file, cb) {
    cb(null, "./uploads");
  },
  filename: function (req, file, cb) {
    cb(null, Date.now() + "_" + file.originalname);
  },
});

const upload = multer({
  storage: storage,
  //   limits: { fileSize: 10 },
});

module.exports = upload;

Answer 9

使用：

formdata.append('file',document.getElementById("input-file").files[0]);

代替：

formdata.append('file',document.getElementById("input-file").files);

这是我做错的地方。

multer - req.file始终未定义

9 个答案: