获取帖子请求中的空体

Question

我正在为 javascript 中的 fetch API 苦苦挣扎。 当我尝试使用 fetch 将某些内容发布到我的服务器时，请求正文是一个空数组。 但是当我使用 Postman 时它可以工作......这是我在 NodeJS 中的服务器代码：

const express = require('express')
const app = express()
const port = 3000

app.use(express.json())
app.post('/api', function (req, res) {
    console.log(req.body)
})
app.listen(port)

这是我的客户：

fetch('http://"theserverip":3000/api', {
    method: 'POST',
    headers: { "Content-Type": "application/json" },
    mode: 'no-cors',
    body: JSON.stringify({
        name: 'dean',
        login: 'dean',
    })
})
.then((res) => {
    console.log(res)
})

问题是在 SERVER 端，req.body 是空的。 有人能帮我吗？ 谢谢 ！

Answer 1

问题是

mode: 'no-cors'

从文档...

防止方法不是 HEAD、GET 或 POST 之外的任何内容，以及标题不是简单标题之外的任何内容

简单的内容类型头限制允许

• text/plain ,
• application/x-www-form-urlencoded ，和
• multipart/form-data

这会导致您精心制作的Content-Type: application/json标头变为content-type: text/plain （至少在通过 Chrome 测试时）。

由于您的 Express 服务器需要 JSON，因此它不会解析此请求。

我建议省略mode配置。 这将使用默认的"cors"选项。

---

由于您的请求并不简单，您可能希望向 Express 服务器添加一些CORS 中间件。

另一个（有点hacky）选项是告诉Express 将text/plain请求解析为JSON。 这允许您将 JSON 字符串作为简单的请求发送，这也可以避免飞行前的OPTIONS请求，从而降低整体网络流量...

app.use(express.json({
  type: ['application/json', 'text/plain']
}))

编辑：向app.use最终代码块添加了结束括号。

Answer 2

请参阅文档 模式， no-cors模式只发送简单的标题。 所以将content-Type改为text/html; 而不是application/json因此您的服务器无法识别正文格式并返回空。

删除mode: 'no-cors',你应该没问题。

Answer 3

为了补充提到删除mode: 'no-cors'选项的优秀答案，如果您不想向 Express 添加CORS 中间件，您可能只想在OPTIONS块下处理“预检”请求：

app.options('*', (req, res) => {
  res.setHeader('Access-Control-Allow-Origin', '*');
  res.setHeader('Access-Control-Allow-Headers', 'Content-Type'); // Add other headers here
  res.setHeader('Access-Control-Allow-Methods', 'POST'); // Add other methods here
  res.send();
});

另一个不错的答案： https : //www.vinaygopinath.me/blog/tech/enable-cors-with-pre-flight/

希望这可以帮助！

Answer 4

似乎没有一个对我有用我使用中间件解决了这个问题

app.use(restify.plugins.bodyParser());

或者

app.use(multer().array())

Answer 5

上述许多答案都没有解决我的问题，因此遇到此问题的任何人都可能需要做我需要做的事情，并使他们的app能够读取主体中的 JSON，因为该应用程序无法通过default 这是导致空体的原因

我通过添加解决了这个问题：

app.use(bodyParser.json());

添加这一行后，POST/PUT 请求发送正文没有问题

从技术上讲， bodyParser模块已被弃用，因此这不是最理想的解决方案，但如果将上述行添加到您的代码中使其工作，那么您至少知道您的问题在于您的应用程序可以解析/读取 JSON 的方式身体

Answer 6

如果您想使用fetch获取响应，请考虑使用res.send ：

    app.post('/api', function (req, res) {
        res.send(req.body)
    })