如何使用 Express 从带有命名输入的表单中收集数据（已经使用 bodyParser/express.json）答案

【问题标题】：How to collect data from a form with named inputs using Express (already using bodyParser/express.json)如何使用 Express 从带有命名输入的表单中收集数据（已经使用 bodyParser/express.json）
【发布时间】：2019-06-25 09:31:59
【问题描述】：

表单提交到达我的路由器，但没有数据。

已解决：将express.json() 中间件替换为express.urlencoded()。请参阅我对“为什么”的回答。

（隐喻：表单是一辆公共汽车，按下提交按钮是在公共汽车站收集乘客然后起飞到服务器。这辆公共汽车在那个潜在乘客的脸上关上了门。乘客在它后面跑，乞讨公共汽车要停下来，但公共汽车继续行驶，到达服务器时空无一人。我需要帮助更换这个不称职的公共汽车司机。 )

我正在使用 Express v4.17.00 和 body-parser v1.19.00（我知道这是可选的）。

HTML 修复尝试：

[x] 输入已命名
[x] 值存在
[x] 从 `type="hidden" 切换到 type="text" 并返回
[x] 在按钮[type="submit"] 和输入[type="submit"] 之间切换
[x] 从输入中删除 data-fhqwhgads13（Vue 值）
[x] 将更基本的值传递给值
[x] 使用 Mozilla 的表单示例而不是我自己的表单（为什么我怀疑我搞砸了 Express）

快速修复尝试：

[x] 在 bodyParser.json() 和 express.json() 之间切换
[x] 使用 bodyParser.text(), .raw()
[x] 打印整个请求以查看正文是否在其他地方。

通过上述修复，console.log(req.body) 始终显示{}。我在我的 MRE 中使用了 MDN 的示例，所以我认为我在 Express 中遗漏了一些东西。

Here's my MRE repo

我希望数据进入我的 /store-schedule 发布路由，将数据作为 req 对象的一部分，我应该能够使用它。

但是，无论使用什么表单输入，console.log(req.body) 都会给我{}。没有错误消息。

【问题讨论】：

您能否添加客户端发送请求的代码和您的快速路由定义？
@BorysKupar 请注意，我刚刚解决了这个问题。 MRE 已链接。客户端是 dist/index.html。快速路由定义在 index.js 中。

标签： express

【解决方案1】：

我猜测表单的工作原理是将数据编码到随 post 请求发送的数据包的主体中。我想这就是URL encoded 所指的内容。这与 JSON 请求不同。我在传输和请求 JSON 方面几乎没有经验。我只知道它与 JSON 请求/响应不同。

所以，将express.json() 切换到express.urlencoded() 后，我在服务器的/store-schedule 路由上得到了我的数据。

// app.use(express.json()); Doesn't work.
app.use(express.urlencoded()); // Works

【讨论】：