在 Express JS 路由中使用 formData 获取 POST 为空答案

【问题标题】：Fetch POST with formData is empty in Express JS route在 Express JS 路由中使用 formData 获取 POST 为空
【发布时间】：2017-04-03 08:02:18
【问题描述】：

我有一个表单，它使用 fetch() 到 AJAX，并带有 NodeJS 上的路由。当 AJAX POST 命中路由时，req.body 显示一个空对象 {}。

代码如下：

// 在 app.js 中

app.use(bodyParser.json());

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

//在form.js中

form.getElementById('form__option').addEventListener('submit', e => {
    e.preventDefault()
    const form = $('form')[0]
    fetch('/polls/create', {
        method: 'POST',
        body: new FormData(form)
    })
})

// 在 appRoute.js 中

exports.createPost = (req, res, next) => {
    console.log('req body', req.body)
    res.send('NOT IMPLEMENTED: pollsController createPost');
}

【问题讨论】：

你有没有把你的 app.use(...) 放在你的路由定义之前？
是的，app.use 都在 app.use(..., router) 之前执行
代码似乎正确。您应该从浏览器检查您的请求正文，确保它们是正确的（您可以使用 Chrome DevTool 的“网络”选项卡）。然后尝试添加一个应用程序。使用您的路由器（中间件）的最开始并检查req.body 看看它是否正确

标签： node.js fetch form-data

【解决方案1】：

这里的问题是FormData会将内容类型设置为multipart/form-data，Express'body-parser无法理解。

注意评论here：

[body-parser] 不处理多部分主体，因为它们复杂且通常很大。对于多部分主体，您可能对以下模块感兴趣：busboy 和 connect-busboy；多方和连接多方；强大;计算。

换句话说，您必须使用不同的模块来处理 FormData 发送的多部分正文。我可以推荐formidable，在这种情况下，您的服务器代码将类似于：

const formidable = require('formidable')

exports.createPost = (req, res, next) => {
    var form = new formidable.IncomingForm();
    form.parse(req, (err, fields, files) => {
        console.log(fields)
        res.send('NOT IMPLEMENTED: pollsController createPost');
    }
}

【讨论】：

是的，我可以确认这是问题所在。我的问题与 OP 完全相同，只能通过使用上述答案中的建议来解决。