得到空的 req.body

介绍

在开发过程中，我们经常会遇到从前端传来的 post 请求，但是却得到了一个空的 req.body，这时如果不及时处理，可能会对接下来的开发产生很大的影响。本篇文章将介绍常见的情况和解决方案。

常见情况

1. 忘记设置请求头

在前端发送 post 请求时，如果没有设置请求头，服务器就无法正确解析请求体，导致得到空的 req.body。

解决方案：

在前端发送 post 请求时，一定要设置请求头，如下：

fetch('/api', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify(data)
})

2. 请求体格式不正确

在前端发送 post 请求时，请求体的格式必须符合服务器设置的解析规则（如 JSON、formdata 等），否则服务器无法正确解析请求体，导致得到空的 req.body。

解决方案：

确保前端发送的请求体格式和服务器设置的解析规则相同，如下：

// 如果设置的是 JSON 格式
fetch('/api', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify(data)
})

// 如果设置的是 formdata 格式
const formData = new FormData()
formData.append('name', 'John')
formData.append('age', '18')
fetch('/api', {
  method: 'POST',
  body: formData
})

3. 中间件顺序设置错误

在 Express 中，使用中间件时顺序非常重要。如果某个中间件在解析请求体之前执行，就会导致得到空的 req.body。

解决方案：

确保在解析请求体之前执行所有需要用到 req.body 的中间件，如下：

const express = require('express')
const bodyParser = require('body-parser')
const app = express()

app.use(bodyParser.json()) // 解析请求体必须放在路由设置之前

app.post('/api', (req, res) => {
  console.log(req.body) // 不为空
})

结论

得到空的 req.body 是常见的问题，但通常都有解决方案。在开发中，一定要仔细检查请求头、请求体格式和中间件顺序的设置。