Axios POST 参数在服务器上显示为空 - 使用 MERN 堆栈答案

【问题标题】：Axios POST params show empty on server - using MERN stackAxios POST 参数在服务器上显示为空 - 使用 MERN 堆栈
【发布时间】：2019-03-01 09:58:08
【问题描述】：

我想在 Mongo 中更新一个文档，但是当我向服务器发送带有更新参数的 Axios POST 请求时，我只收到服务器端的一个空白对象 - 我正在使用带有 Express 的 Node.js服务器（MERN 堆栈）。

我已经尝试过 qs 库模块和 Node 的 querystring 模块。我尝试包含标题 'Content-Type': 'application/x-www-form-urlencoded' 和 'application/json'。

我的 Axios POST 请求：

const A = 1;
const B = 2;
const data = { A, B };
console.log(qs.stringify(data));                 // A=1&B=2
axios.post(url('upVote'), qs.stringify(data));

服务器路由：

app.post('/upVote', async (req, res) => {
  console.log(req.params);                       // {}
  await DB.updateVote(ID, collection, voteCount);
  res.end();
});

headers as shown by Chrome's DevTools。

...此外，我所有的 axios.get() 请求都可以正常工作，并从 Mongo 获取数据并将其正确发送回我的应用程序，并且 url/endpoints 匹配。

【问题讨论】：

我认为这里你没有得到一个空白对象。你什么也得不到。喜欢的内容：0。你试过服务器日志吗？

标签： javascript node.js axios

【解决方案1】：

有几种方法可以使用 axios 向服务器发送数据。我在 axios 中看到了与 documentation 的混淆，我以前没有见过这种用法，并且在查看请求日志和对象时似乎确实被破坏了。

1) axios.post 接收请求正文作为第二个参数。所以如果你想给axios传参数，你应该这样做：

const B = 2;
const data = { A: 1, B: 1 };

axios.post(url('upVote'), {}, { params: data });

注意 axios 会自己处理字符串化，第三个参数是config object。

在服务器上，参数将在request.query 上可用

2) 如果你想自己对参数进行字符串化，那么你应该像这样将它们附加到你的 URL 中

axios.post(`url('upVote')?${qs.stringify(data)}`);

这里也是，服务器上的数据会在request.query下

3) 为方便起见，通常最好使用 post 请求的主体来传输大数据负载。您还应该考虑您的缓存策略是什么，如果它们依赖请求 url 而没有考虑请求正文，这可能是一个问题。

axios.post(url('upVote'), data);

在这种情况下，服务器上的数据将在request.body下

UPD：原来忘了提到你需要一个body-parser 中间件来访问request.body。

4) 您可以使用 axios 而不使用方法简写，这可能对某些人有用

axios({
  method: 'POST',
  url: url('upVote'),
  params: data
})

这与 1 中的示例相同。
它们都返回一个 Promise，您可以使用 .then().catch() 或 await。

【讨论】：

谢谢！这对我来说有点清楚，它奏效了。使用您的示例 1，我能够从 req.query 访问服务器上的数据...现在我很困惑，因为我也尝试了您的示例 3，但我无法在 body 参数上传递数据.. req.body 未定义
别管我！！我忘记了 body-parser for express...谢谢！
是的，很高兴它有帮助。更新了答案，提到了body-parser，以防万一。

【解决方案2】：

我认为您想要.body 而不是.params。因为您使用 axios 通过邮件在正文中发送数据。您正在打印不会为此 url/api 打印任何内容的参数。
试试

console.log(req.body) // instead of req.params

如果这不起作用，请向我们展示您的反应代码。
而且在反应中，您必须在 axios 之后添加 .then() 否则它会说 unhanded promise

要在服务器端获取参数，您必须进行一些更改
在 axios (react)

axios.post(url('upVote/param'), qs.stringify(data));

在服务器

app.post('/upVote/:params', async (req, res) => {
 console.log(req.params)
 .....
})

【讨论】：

【解决方案3】：

我想你打电话给res.end()。我觉得应该是res.send(...)

这个答案应该会有所帮助：https://stackoverflow.com/a/29555444/1971378

【讨论】：