Next.js报错TypeError: Cannot read properties of undefined (reading 'headers')求助

错误原因 #

这个报错出现在App Router（app目录下的API路由）场景中，核心问题有两个：

1. 路由处理函数没有返回NextResponse对象，导致Next.js无法识别有效响应，内部处理时触发headers读取错误
2. 错误混用了Pages Router的NextApiRequest/NextApiResponse类型，这两套API体系不兼容

修正方案 #

1. 遵循App Router的API规范

App Router的API路由需要导出异步函数，接收Request对象，且必须返回NextResponse实例。同时NextResponse.json的状态码要放在第二个配置参数里，不能和响应体混在一起。

2. 修正后的代码示例

import { NextResponse } from 'next/server';
// 导入你的用户模型（根据实际情况调整）
import User from '@/models/User';

export async function POST(request: Request) {
  try {
    const body = await request.json();
    const newUser = new User(body);
    await newUser.save();
    
    return NextResponse.json(
      { msg: `Successfully created new User: ${newUser}` },
      { status: 200 }
    );
  } catch (err) {
    return NextResponse.json(
      { error: `Error on '/api/register': ${err}` },
      { status: 400 }
    );
  }
}

关键注意点 #

• 不要在App Router中使用NextApiRequest/NextApiResponse，这是Pages Router（pages/api目录）专属的类型
• 所有分支都必须返回NextResponse，包括错误分支，不能只调用NextResponse.json而不返回
• 优先用async/await替代then/catch，避免回调嵌套导致的返回遗漏问题

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