【问题标题】:How to Allow Form-Data in NodeJS如何在 NodeJS 中允许表单数据
【发布时间】:2018-04-01 23:59:22
【问题描述】:

我最近创建了一个接受文件的 API。我正在尝试使用 Postman 测试 API。如果我使用 x-wwww-form-urlencoded 正文类型发出帖子请求,一切正常,我得到所有预期的数据。唯一的问题是它不允许发送文件。如果我使用form-data 正文类型,允许您发送文件,我不会在后端收到任何内容。不确定邮递员是否有问题或者我做错了什么。我的预感是后端目前不接受form-data,这就是为什么我没有收到任何数据。我能做些什么来改变它?

到目前为止,我的标题看起来像这样,

res.setHeader('Access-Control-Allow-Origin', origin);
res.header("Access-Control-Allow-Methods", "GET, POST, PATCH, PUT, DELETE, OPTIONS");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, form-data");

app.js

app
    // static route will go to the client (angular app)
    .use(express.static('client'))

    // secured routes
    .use('/api', secured_route)

    // add a user route
    .post('/user', user_api_controller.add_user)

    // delete this in the production
    .use(function(req, res, next) {
        res = allowed_orgins(req, res);
        next();
    })
;

allowed_orgins = function (req, res){
    var allowedOrigins = ['http://localhost:4200', 'http://localhost:8100'];
    var origin = req.headers.origin;
    if(allowedOrigins.indexOf(origin) > -1){
        res.setHeader('Access-Control-Allow-Origin', origin);
        res.header("Access-Control-Allow-Methods", "GET, POST, PATCH, PUT, DELETE, OPTIONS");
        res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, multipart/form-data");
    }
    return res;
}

user_api_controller.js

module.exports.add_user = function (req, res) {
    console.log(req.body.username);
    console.log(req.body.other_parameters);
}

如果我使用form-data,我不会在控制台上打印任何内容,但是当我使用x-wwww-form-urlencoded 时它可以正常工作。


我使用了multer middle ware,但我仍然没有得到任何东西。当我的后端收到一些东西时,中间件就会发挥作用。我已经尝试获取form-data 的纯文本字段,但我也没有得到。这意味着我的后端无法接收所有 form-data 字段,不仅是文件,还有文本字段。

【问题讨论】:

  • 你需要通过 req.body form 的 form-data @HafizTemuri
  • @muthukumar 抱歉,我没听清楚。请您详细说明一下好吗?
  • 你的问题不在于标题请通过multer Middle Ware
  • 我使用了multer middle ware,我仍然没有得到任何东西。当我的后端收到一些东西时,中间件就会发挥作用。我已经尝试获取form-data 的纯文本字段,但我也没有得到。这意味着我的后端无法接收form-data 字段,不仅是文件,还有文本字段。

标签: node.js api postman


【解决方案1】:

这里是我的超级简单快递示例:

const express = require('express')
const fileUpload = require('express-fileupload');

const app = express()
app.use(fileUpload());

app.post('/file-upload', function(req, res, next) {
  console.log(req.body.msg);
  console.log(req.files);
  res.send('ok');
  next();
});

app.listen(3000, function () {
  console.log('Example app listening on port 3000!')
})

对不起,我不使用邮递员,但我使用curl,它对我有用:

curl http://localhost:3000/file-upload \
  -H "Content-Type: multipart/form-data" \
  -F "file=@/YourDir/YourFile.txt" \
  -F "msg=MyFile"

因此,您可以尝试、测试、了解要点并使用此 curl 命令使用您的应用程序。

【讨论】:

  • 使用您的解决方案,至少当我在 Postman 中使用 form-data 时,我能够获取文本字段,我说这是一个进步。但是,我仍然无法获取文件。我尝试使用 curl,它给了我一个错误,Invoke-WebRequest : Cannot bind parameter 'Headers'. Cannot convert the "Content-Type: multipart/form-data" value of type "System.String" to type "System.Collections.IDictionary"。有什么想法可以解决吗?
  • 无法重现此错误...您还使用哪些其他中间件?
  • 我没有使用任何中间件。我用的是multer,但现在不用了。
  • 忘记 curl...lol 我得到了它与 Postman 的合作,但我遇到了另一个问题。我无法将文件保存到服务器。我正在尝试按照本教程保存文件,并提供如图所示的路径。 https://www.npmjs.com/package/express-fileupload 类似这样的东西,/upload/filename.txt,但由于某种原因,它构成了自己的路径名。它假设在应用程序的根目录中查找名为upload 的目录,而不是转到我的硬盘根目录。 Error: ENOENT: no such file or directory, open 'C:\uploads\filename.txt' 有什么想法可以解决这个问题吗?
  • 我已经搞定了。非常感谢您的帮助。你应该得到我的 50 次代表。
【解决方案2】:

文件上传的 Content-Type 标头实际上是 multipart/form-data 而不是 form-data。要在 Postman 中正确上传文件,请查看此处:https://github.com/postmanlabs/postman-app-support/issues/1441#issuecomment-289452571

在后端,您需要一个库来处理multipart/form-data 请求。如果您使用的是 expressjs,那么这个库将满足您的需求https://www.npmjs.com/package/multer

这里是如何使用multer

1) 先安装multer

npm install --save multer

2) 在代码中包含库(注意上传目录必须存在)

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

3) 使用upload 作为add_user 端点的中间件(在括号中填写包含上传文件的字段名称)

app
// other endpoints
.post('/user', upload.single(/* file field name in your form */), user_api_controller.add_user)

4) 可以在您的 user_api_controller.js

中访问该文件
module.exports.add_user = function (req, res) {
    console.log(req.file);
}

【讨论】:

  • 我已将标题类型更改为multipart/form-data。尽管如此,它并没有向我显示任何在后端接收数据的迹象。我在原始帖子中包含了更多代码。请检查我是否在那里做错了什么。
  • 要在后端接收文件,您需要使用另一个库multer。我已经更新了我的答案以给出一些说明。
  • 仍然没有得到任何东西。虽然它会创建上传文件夹,但它不会上传文件。当我使用form-data 时,不仅仅是文件,它也没有获取文本字段。
  • 您是通过 Postman form-data 还是 multipart/form-data 发送的?你在后端遇到了什么错误?
  • 我通过form-data 发送,我没有收到任何错误。当我尝试打印字段时,它会打印 undefined
猜你喜欢
  • 2023-03-30
  • 1970-01-01
  • 1970-01-01
  • 2018-08-17
  • 2021-12-17
  • 1970-01-01
  • 2021-02-06
  • 2012-05-23
  • 2018-07-10
相关资源
最近更新 更多