AgentSkillsCN

nextjs-api-file-upload

对于 Next.js App Router，可在路由处理器中使用 request.formData() 并对文件（如 CSV）进行流式读取与解析。切勿在 API 路由中使用 Express 风格的中间件（如 multer）——这可能会阻塞请求管道，导致请求挂起。当您在 Next.js API 路由中实现文件上传时，可使用此技能。

SKILL.md
--- frontmatter
name: nextjs-api-file-upload
description: For Next.js App Router, use request.formData() and stream/parse the file (e.g. CSV) in the route handler. Do not use Express-style middleware (e.g. multer) in API routes—it can block the request pipeline and cause hangs. Use when implementing file upload in Next.js API routes.

Next.js API File Upload (App Router)

This project uses Next.js App Router. File upload in API routes must use Next.js built-in handling, not Express middleware.

Do Not Use

  • •Express middleware (e.g. multer) in API routes. It can block the request pipeline and cause long hangs (e.g. login or upload appearing stuck).

Do Use

  • •request.formData() in the route handler.
  • •Stream or parse the file (e.g. CSV) inside the handler after calling formData().

Example Pattern

typescript
// In app/api/upload/route.ts (or similar)
export async function POST(request: Request) {
  const formData = await request.formData();
  const file = formData.get('file') as File | null;
  if (!file) return Response.json({ error: 'No file' }, { status: 400 });
  // Parse/stream file in handler (e.g. CSV parsing)
  // ...
}

Integration

  • •Can be merged into a broader "Next.js API" skill if one exists. Use for any task that adds or changes file upload in Next.js App Router API routes.