SvelteKit POST请求时req.body为undefined报错问题咨询

问题原因 #

• 前端发起带JSON body的POST请求时，没有声明Content-Type: application/json请求头，SvelteKit默认不会自动解析未指定类型的请求体，所以API路由里拿到的req.body就是undefined。
• 如果你使用的是SvelteKit v1.0及以上版本，旧版的API路由入参格式已经废弃，新版用标准Web Request API，需要手动解析请求体。

关于能否使用Express body-parser的回答 #

不能直接使用Express的body-parser解决该问题。SvelteKit的原生API路由基于Web标准Request/Response API实现，默认没有集成Express运行环境，body-parser是Express专属中间件，无法直接在SvelteKit原生API路由中使用。如果强行把SvelteKit挂载到自定义Express服务上引入body-parser，属于冗余改造，完全没必要用这种复杂方案。

可行解决方案 #

方案1：适配旧版SvelteKit（API路由采用export async function post(req)写法） #

1. 修改index.svelte中的fetch请求，添加Content-Type请求头：

// index.svelte
export async function load({ fetch }) {
    const res = await fetch('/api/query', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({
         query: 'site.title',
        }),
    });
    const data = await res.json();

    return {
        status: data.status || 200,
        props: data
    }
}

添加该请求头后，SvelteKit会自动将JSON格式的请求体解析到req.body属性中，你原有api/query.js的逻辑无需修改即可正常运行。

方案2：适配新版SvelteKit（v1.0+） #

新版SvelteKit已经废弃了旧的API路由写法，需要采用标准Web API格式改造：

1. 前端部分和方案1一致，添加Content-Type: application/json请求头。
2. 修改api/query.js的逻辑：

// api/query.js
export async function POST({ request }) {
  const url = API_URL;
  const auth = Buffer.from(`${API_USER_EMAIL}:${API_USER_PASSWORD}`).toString('base64');
  // 手动解析请求体
  const reqBody = await request.json();

  const res = await fetch(url, {
    method: 'POST',
    headers: {
      'Authorization': `Basic ${auth}`,
      'Content-Type': 'application/json'
    },
    body: JSON.stringify(reqBody),
  });
  const data = await res.json();

  return new Response(JSON.stringify(data), {
    status: data.code || 200
  })
}

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