关于用multer解析上传文件的Nodejs问题

关于用multer解析上传文件的Nodejs问题

先上github代码地址：https://github.com/heshiyu2015/my_tank

小弟初学在用Express做demo，如下图，想使用multer解析上传的文件请求 app.png

解析之后用路由调用如下的代码， 路由.png

大家可以看到我有两个console.log输出req.files和req.body，但是结果都是{}{},空对象，而且我检查了dest中定义的路径也没有 文件啊。这说明multer根本就没解析这个multipart-data请求啊，查了好久没发现错误，为毛撒，下面上一张我的提交表单代码 界面.png


6 回复

关于用Multer解析上传文件的Node.js问题

背景

最近我在使用Express框架开发一个Demo应用时遇到了一些问题，特别是在使用Multer来解析上传的文件请求时。经过一番调试，我发现req.files 和 req.body 都是空对象，并且目标目录中也没有上传的文件。以下是具体的代码和配置。

问题描述

我想通过一个表单上传文件，并使用Multer来处理上传的文件。然而，无论我如何配置Multer，最终得到的结果总是空对象，文件也未被保存到指定目录。

示例代码

首先，确保你已经安装了必要的依赖：

npm install express multer
Multer配置

在你的项目中创建一个multer.js文件，并进行如下配置：

const multer = require('multer');

// 配置存储方式
const storage = multer.diskStorage({
  destination: function (req, file, cb) {
    cb(null, './uploads/'); // 文件保存的目标目录
  },
  filename: function (req, file, cb) {
    cb(null, file.fieldname + '-' + Date.now()); // 使用时间戳作为文件名
  }
});

const upload = multer({ storage });

module.exports = upload;
Express路由

在你的主路由文件（例如index.js）中引入Multer配置，并设置相应的路由：

const express = require('express');
const upload = require('./multer'); // 引入Multer配置
const app = express();

app.post('/upload', upload.single('file'), (req, res) => {
  console.log(req.file); // 输出上传的文件信息
  console.log(req.body); // 输出表单数据
  res.send('File uploaded successfully');
});

app.listen(3000, () => {
  console.log('Server is running on port 3000');
});
HTML表单

确保你的HTML表单正确地设置了enctype属性，并且文件输入字段的name属性与Multer配置中的字段名称匹配：

<form action="/upload" method="post" enctype="multipart/form-data">
  <input type="file" name="file">
  <button type="submit">Upload</button>
</form>

解决方案

通过以上配置，你应该能够成功上传文件并使用Multer解析请求。如果仍然存在问题，请检查以下几点：

  1. 确保服务器端口没有被其他服务占用。
  2. 检查HTML表单的enctype是否正确设置为multipart/form-data。
  3. 确认Multer配置中的字段名称与表单输入字段的name属性一致。

希望这些信息能帮助你解决Multer解析上传文件的问题！如果你还有其他疑问，请随时留言。


对了，对其进行调试要启动mongoDB额。。

= = ,　是你的html有问题。我没有装也调出来了，你多了，

下次不要犯这种小错误

你的代码界面好红啊，看着难受。

服务器收到上传文件后，怎样提醒前端页面上传成功呢？因为不是ajsx提交的所以我没有办法像ajax的success中收到服务器发来的json数据，这该怎么办呢？

根据你的描述，问题可能是由于Multer配置或表单提交方式不正确导致的。以下是一些可能的解决方案和示例代码：

1. 确认Multer配置正确

确保你在Express应用中正确配置了Multer。示例代码如下：

const express = require('express');
const multer = require('multer');

const app = express();

// 设置Multer存储
const storage = multer.diskStorage({
  destination: function (req, file, cb) {
    cb(null, 'uploads/'); // 保存到uploads目录
  },
  filename: function (req, file, cb) {
    cb(null, file.fieldname + '-' + Date.now()); // 使用字段名和时间戳作为文件名
  }
});

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

app.post('/upload', upload.single('file'), (req, res) => {
  console.log(req.file); // 打印上传的文件信息
  console.log(req.body); // 打印表单数据
  res.send('File uploaded successfully');
});

2. 表单提交方式

确保你的HTML表单使用enctype="multipart/form-data"属性，并且包含正确的<input type="file">标签。

示例代码如下：

<form action="/upload" method="POST" enctype="multipart/form-data">
  <input type="file" name="file" />
  <button type="submit">Upload</button>
</form>

3. 检查文件路径

确保服务器端指定的uploads/目录存在并且有写入权限。

4. 调试

你可以添加一些调试信息来确认Multer是否接收到文件：

app.post('/upload', (req, res, next) => {
  console.log(req.files); // 打印req.files以确认Multer是否接收到了文件
  next();
}, upload.single('file'), (req, res) => {
  console.log(req.file);
  console.log(req.body);
  res.send('File uploaded successfully');
});

通过以上步骤，你应该能够解决Multer无法解析文件的问题。如果问题仍然存在，请检查控制台是否有任何错误信息，并确保Multer版本与Node.js版本兼容。

回到顶部