nextjs14创建 API 路由

在 Next.js 13 和后来的版本中，应用目录结构发生了一些变化。你可以在 app 目录中创建 API 路由。下面是如何在 Next.js 14 中创建一个简单的 API，响应一个 GET 请求并返回 “hello” 字符串的步骤：

创建 API 路由

1、在 app 目录中创建 API 路由

在项目中，导航到 app 目录，并创建一个 api 文件夹，然后在 api 文件夹中添加 hello 文件。目录结构应如下所示：

my-nextjs-app/
├── app/
│ ├── api/
│ │ └── hello/
│ │ └── route.ts
│ └── page.ts
├── …

2、编写 API 路由代码

在 app/api/hello/route.ts 文件中添加以下内容：

export async function GET(request) {  
  return new Response("hello", {
    status: 200,
  });
}  

3、访问 API

可以通过在浏览器中访问以下 URL 来测试 API：

http://localhost:3000/api/hello

如果一切正常，应看到 ‘hello’ 字符串作为响应。

4、关于Post请求

import type { NextApiRequest, NextApiResponse } from 'next';

// 处理 POST 请求  
export async function POST(req: NextApiRequest, res: NextApiResponse) {
  // 返回一个 JSON 响应  
  return new Response(JSON.stringify({ 'message': "文件上传成功" }), {
    status: 200,
  });
}