使用fetch向Node.js发送JSON数据时req.body报错如何解决

触发这个报错的核心原因是你的Express后端没有配置JSON请求体解析中间件。Express默认不会自动解析POST请求携带的JSON格式载荷，导致req.body值为undefined，读取sqlQuery属性时自然会抛出类型错误。
另外你的接口路由没有返回任何HTTP响应，就算解决了body解析问题，前端请求也会一直挂起直到超时。
你写的Angular端fetch请求本身没有语法错误。

1. 后端代码修复 #

首先在后端服务入口文件中，在所有接口路由定义之前，添加Express内置的JSON解析中间件，同时补全路由的响应逻辑：

// 注意：这行必须写在所有app.post/app.get等路由定义之前，否则解析不生效
app.use(express.json())

app.post('/api/customQuery', async (req, res) => {
  // 增加可选链做容错，避免未传参时触发报错
  const test = req.body?.sqlQuery
  console.log('接收到的SQL参数：', test)
  
  // 此处写你的数据库查询等业务逻辑
  // 业务处理完成后必须给前端返回响应，避免请求挂起
  res.json({
    code: 200,
    msg: '请求成功',
    data: [] // 替换为实际查询结果
  })
})

如果你使用的Express版本低于4.16.0，需要先安装body-parser依赖实现解析能力：

npm install body-parser

对应中间件写法如下，同样需要放在路由定义之前：

const bodyParser = require('body-parser')
app.use(bodyParser.json())

2. 前端代码优化（可选） #

原有前端代码仅返回了fetch的Promise对象，没有解析响应、处理请求异常，可以补充对应逻辑方便调试：

async testmariadb($event: MouseEvent) {
  try {
    const res = await fetch('/api/customQuery', {
      method: 'POST',
      headers: {'Content-Type': 'application/json'},
      body: JSON.stringify({
        sqlQuery: 'SELECT * FROM software'
      })
    })
    // 解析后端返回的JSON格式响应
    const result = await res.json()
    console.log('后端返回结果：', result)
    return result
  } catch (err) {
    console.error('接口请求失败：', err)
  }
}

• 请求体解析中间件必须注册在所有业务路由之前，否则路由内不会触发解析逻辑，req.body依然为undefined
• 本地开发时如果用Angular代理转发接口，要确认代理配置中/api路径的转发目标端口和Node服务监听端口一致
• 生产环境如果配置了Nginx等反向代理，要确认代理没有主动丢弃POST请求体

内容的提问来源于stack exchange，提问作者Lorteau Erwan