使用Nodejs的multiparty做文件上传时,解析不了

使用Nodejs的multiparty做文件上传时,解析不了

app.js

app.get('/upload',upload.getPostFile);
app.post('/upload',upload.postFile);

upload.ejs

<form action="" enctype="multipart/form-data" method="post">
    <input type="text" name="title"><br>
    <input type="file" name="upload" multiple="multiple"><br>
    <input type="submit" value="Upload">
</form>

upload.js

var multiparty = require('multiparty');
var util = require('util');

exports.getPostFile = function(req, res){
   res.render('upload',{ title:"上传"});
};
exports.postFile = function(req,res){
   var form = new multiparty.Form(); 
   form.parse(req, function(err, fields, files) {
      res.writeHead(200, {'content-type': 'text/plain'});
      res.write('received upload:\n\n');
      res.end(util.inspect({fields: fields, files: files}));
    });
};

当我去到upload这个页面的时候,点击上传,一直在Loading状态。不知道哪里写错了,好像没有解析post的文件。


2 回复

针对您提到的文件上传问题,我们可以从几个方面进行检查和调整,以确保文件能够正确解析并上传。

1. 确保 action 属性设置正确

首先,您的表单 action 属性为空字符串,这意味着它将提交到当前页面。为了使表单正确提交到 /upload 路由,您应该将其设置为 action="/upload"

<form action="/upload" enctype="multipart/form-data" method="post">

2. 检查路由定义

确保在 app.js 中,路由定义正确无误:

const express = require('express');
const app = express();
const upload = require('./upload'); // 假设 upload.js 在同一目录下

app.use(express.static('public')); // 如果有静态资源

app.get('/upload', upload.getPostFile);
app.post('/upload', upload.postFile);

// 启动服务器
app.listen(3000, () => {
  console.log('Server is running on port 3000');
});

3. 修改 upload.js 中的 form.parse 方法

确保 multiparty 库正确解析请求,并且错误处理得当:

var multiparty = require('multiparty');
var util = require('util');

exports.getPostFile = function(req, res) {
  res.render('upload', { title: "上传" });
};

exports.postFile = function(req, res) {
  var form = new multiparty.Form();

  form.parse(req, function(err, fields, files) {
    if (err) {
      console.error('Error parsing form:', err);
      res.status(500).send('Error parsing the form.');
      return;
    }

    res.writeHead(200, { 'Content-Type': 'text/plain' });
    res.write('Received upload:\n\n');
    res.end(util.inspect({ fields: fields, files: files }));
  });
};

4. 确保视图引擎已配置

确保在 app.js 中已正确配置视图引擎(例如 EJS):

app.set('view engine', 'ejs');

5. 测试与调试

最后,启动应用并尝试上传文件。如果仍然遇到问题,可以通过浏览器开发者工具查看网络请求的具体情况,或在服务器端添加更多的日志输出来调试。

通过上述步骤,您的文件上传功能应该可以正常工作了。如果还有问题,请检查控制台是否有其他错误信息。


根据你提供的代码,问题可能出在表单提交的目标地址上。你的HTML表单的action属性为空,这意味着它将提交到当前URL,而不是指定的/upload路径。

请修改你的upload.ejs文件中的表单标签,确保其action属性指向正确的处理路径:

<form action="/upload" enctype="multipart/form-data" method="post">

此外,为了更好地调试问题,可以在upload.js中添加一些错误处理逻辑,以便捕获并输出任何可能发生的错误:

var multiparty = require('multiparty');
var util = require('util');

exports.getPostFile = function(req, res){
   res.render('upload', { title: "上传" });
};

exports.postFile = function(req, res){
   var form = new multiparty.Form();
   
   form.parse(req, function(err, fields, files) {
      if (err) {
         console.error("Error parsing the form:", err);
         res.writeHead(500, {'content-type': 'text/plain'});
         res.end('An error occurred while processing the form.');
         return;
      }
      
      res.writeHead(200, {'content-type': 'text/plain'});
      res.write('Received upload:\n\n');
      res.end(util.inspect({ fields: fields, files: files }));
   });
};

这样可以确保如果发生错误,你能够看到具体的错误信息,从而帮助定位问题所在。

总结:主要问题在于action属性未正确设置为/upload。同时增加错误处理逻辑有助于调试和解决问题。

回到顶部