Next 13 API路由返回空白页，求问题原因及解决办法

你的问题出在Next.js 13 App Router模式下API路由的两个关键规则没遵守：

1. 缺少必需的route.ts文件 #

App Router要求API路由代码必须放在app/api/[路由路径]/route.ts（或.js）文件中，而你的app/api/auth目录是空的，没有创建这个核心文件，导致路由无法被Next.js识别。

修正后的文件结构应该是：

├───api
│   └───auth
│       └───route.ts  // 你的API逻辑要写在这里
├───Components
├───Reserve
│   └───[slug]
│       └───Components
├──Restaurant
│   └───[slug]
│       ├───Components
│       └───Menu
│           └───Components
└───Search
    └───Components

2. API函数导出方式错误 #

App Router的API路由不需要用export default导出函数，而是直接命名导出对应HTTP方法的函数（比如GET、POST）。你当前的export default async function GET是Pages Router的写法，在App Router下不生效。

修正后的代码（放在app/api/auth/route.ts中）：

import { NextResponse } from "next/server";

export async function GET(request: Request) {
    return NextResponse.json({a: "hi"});
}

最后验证步骤 #

1. 保存修改后的route.ts文件
2. 重启Next.js开发服务器（确保新文件被正确加载）
3. 访问localhost:3000/api/auth，此时应该能看到预期的{"a":"hi"}响应。

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