Fastify中TypeScript接口实例属性单独提取为undefined问题求助

核心原因 #

你看到的控制台输出{"quantity":1}其实是JSON字符串，而非解析后的JavaScript对象。这意味着Fastify没有将请求体解析为对象，导致你尝试访问body.quantity时得到undefined——因为字符串本身没有quantity属性。

解决方案 #

1. 确保Fastify启用JSON请求体解析 #

Fastify默认启用JSON解析，但如果你的项目修改了默认配置（比如设置了bodyParser: false），需要手动确认或配置：

• 方式一：初始化Fastify实例时保留默认解析配置：

const fastify = require('fastify')({
  logger: true,
  bodyParser: true // 默认值为true，确保未被改为false
})

• 方式二：手动注册@fastify/jsonbody-parser插件（用于自定义解析规则）：
  先安装插件：

npm install @fastify/jsonbody-parser

再在代码中注册：

import fastifyJson from '@fastify/jsonbody-parser';

async function startServer() {
  const fastify = require('fastify')({ logger: true });
  await fastify.register(fastifyJson);
  // 注册路由等后续逻辑
}

2. 验证前端请求的Content-Type和数据格式 #

确保前端发送请求时满足两个条件：

• 请求头设置Content-Type: application/json
• 请求体是经过JSON.stringify()转换的字符串

举个React中用fetch发送请求的正确示例：

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

3. 运行时容错处理（可选） #

为了避免类似类型错误，可以在路由中先校验请求体类型：

if (typeof request.body === 'string') {
  try {
    request.body = JSON.parse(request.body);
  } catch (err) {
    return reply.code(400).send({ error: 'Invalid JSON body' });
  }
}

验证修复效果 #

修复完成后，控制台打印body时会显示类似：

[App] { quantity: 1 }

而非带引号的JSON字符串，此时body.quantity就能正确获取到数值1。

内容的提问来源于stack exchange，提问作者Brandon Dester