节点 js multer 文件上传不起作用。 req.file 和 req.files 始终未定义

Posted 2023-03-07

【中文标题】节点 js multer 文件上传不起作用。 req.file 和 req.files 始终未定义

【英文标题】：node js multer file upload not working. req.file and req.files always undefined

【发布时间】：2018-08-04 03:02:54

【问题描述】：

我正在尝试将文件上传到我的服务器，但 req.file 和 req.files 在我的 POST REST 端点上始终未定义。

我要上传的内容是一个“.dat”文件，我期待一个 json 响应。

这是我的代码：

服务器端：

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

var app = express()

app.post('/creoUpload', upload.single('uploadFileField'), function(req, res, next) 
  console.log("req.file = ",JSON.stringify(req.file)); //is undefined
  console.log("req.files = ",JSON.stringify(req.files)); //also undefined
);

客户端：

<form id="creoUploadForm" action="/creoUpload" enctype="multipart/form-data" method="post">
    <input type='file' name='uploadFileField'><br><br>
    <input type='submit' value='Upload'/>
</form>

JS：

$( "#creoUploadForm" ).submit(function( event ) 
    event.preventDefault();
    var formData = new FormData($(this)[0]);
    $.ajax(
          url: '/creoUpload',
          type: 'POST',
          data: formData,
          async: true,
          cache: false,
          contentType: false,
          processData: false,
          success: function (returndata) 
              console.log("RETURN DATA IS: ",returndata);
          ,
          error: function (err) 
              console.log("ERROR: ",err);
          
    );
);

我一直在田地里玩耍，但它不起作用..有人知道我在这里做错了什么吗？

我正在关注https://www.npmjs.com/package/multer的示例

版本：

Express 版本：4.12.0 节点版本：6.5.0 jQuery：1.12.1

谢谢！

【问题讨论】：

在您的 html 中，您可以尝试从表单标签中删除操作，并将 formaction="/creoupload" 添加到提交按钮吗？

尝试使用fetch Api 发送帖子请求

【参考方案1】：

我也有同样的问题，如果您查看 Error Handling 部分的文档，还有另一种实现方式，这对我有用。代码将是这样的：

var express = require('express');
var multer = require('multer');
var upload = multer( dest: 'uploads/' );
var app = express();

app.post('/creoUpload', function(req, res, next) 
  upload(req, res, function (err) 
    if (err) 
      // An error occurred when uploading
      console.log('Err: ', err);
      return;
     else 
       console.log('req.file: ', JSON.stringify(req.file));  
       console.log('req.files: ', JSON.stringify(req.files));
       return;
    
  )
);

【参考方案2】：

如果req.file和req.files是undefined，那么问题是multer没有收到上传的文件，这个问题似乎与jQuery有关。

不支持使用 jQuery 'v1.12.1' 上传 FormData，它根本不会发送任何内容。 我会建议尝试使用 fetch Api 或将 jQuery 的版本更改为 3.3.1。

当我将 jQuery 版本从 v1.12.1 更改为 v3.3.1 时，我已经测试了代码并成功将文件上传到服务器。

【参考方案3】：

您正在使用 multer 作为中间件，因此在进入您的函数并打印之前，它已将图像上传到存储并从 req.files 中删除记录。

您可以通过两种方式访问​​ req.files。

使用 multer 作为 finw3 所述的函数。

另一种解决方案是：

//代码开始

var storage = multer.diskStorage(

  destination: function (req, file, cb) 

    cb(null, '/filepath')
  ,


  filename: function (req, file, cb) 

    let filename = 'filenametogive';
     req.body.file = filename

    cb(null, filename)
  
)

var upload = multer( storage: storage )

//代码结束

现在您可以访问 req.body.file 中的文件

【参考方案4】：

不要将contentType 设置为false，因为POST 方法需要contentType = 'w-xxx-form-urlencoded'，这是JQ 的默认设置。