Axios发送POST请求至Express时req.body为空问题解决

// START EDIT:
解决方案（感谢@robertklep 即Hawkeye先生）：问题根因为客户端Axios发起POST请求时，配置项中错误使用了body作为请求数据的字段名。
// END EDIT:

问题场景 #

搭建前端React、后端Express的全栈应用，接口调用采用Axios实现。此前接口运行正常，无明显代码改动的前提下，突发POST请求体无法传递到后端的问题。

已完成的配置验证：

• 已在Express入口文件index.js中配置请求体解析中间件：

app.use(bodyParser.json());

• 也尝试替换为Express内置JSON解析中间件，问题未解决：

app.use(express.json())

关联代码 #

客户端业务请求触发函数 #

const checkForExistingUserData = async () => {
  if (user) {
    const body = {
      caseId: user['caseId']
    }
    await postRequest({request: body}, commonApiLocations["userDataLookUp"])
  }
}

封装的通用POST请求方法 #

export function postRequest(body, url) {
  console.log(body) // 控制台可正常打印出预期的请求体数据
  const config = {
    method: 'post',
    url: masterEndPoints['expressEndPoint'] + url,
    headers: {
      'Content-Type': 'application/json',
    },
    body // 问题点：Axios配置中该字段名应为data
  };
  return axios(config);
}

Express侧对应路由处理逻辑 #

route.post('/api/users/checkExistingUserData', async (req, res) => {
  try {
    const request = req.body.request;
    console.log("request: ", request); // 打印结果为undefined
    if (request['caseId']) {
      let result = await checkIfExist(tableNames['TableName'], {'caseId': request.caseId})
      res.status(200).send(result);
    } else {
      res.status(200).send(false)
    }
  } catch (error) {
    res.status(500).send('En error occurred on the server')
  }
});

问题表现 #

• 客户端控制台打印的待发送请求数据完全符合预期
• 服务端控制台打印request字段返回undefined，直接打印req.body得到空对象{}，无法定位故障点

修复方案 #

Axios请求配置规范中，携带POST请求体的字段为data，和原生Fetch API使用的body字段名不同。封装请求方法时错误使用了body字段，Axios无法识别该配置项，因此实际发出的请求未携带任何请求体，最终后端解析到的req.body为空。
将配置项中的body替换为data即可修复问题：

const config = {
  method: 'post',
  url: masterEndPoints['expressEndPoint'] + url,
  headers: {
    'Content-Type': 'application/json',
  },
  data: body // 修正字段名
};

内容的提问来源于stack exchange，提问作者Gustav Vingtoft