nextjs-api-file-upload

Handle file uploads in Next.js App Router API routes using request.formData().

2|Updated Feb 13, 2026
One-click install
npx skills add https://github.com/pmarashian/cursor-agent-skills --skill nextjs-api-file-upload
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: nextjs-api-file-upload
Source: https://github.com/pmarashian/cursor-agent-skills/tree/main/nextjs-api-file-upload
Command: npx skills add https://github.com/pmarashian/cursor-agent-skills --skill nextjs-api-file-upload

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill addresses the challenge of handling file uploads within Next.js API routes, specifically for the App Router, by guiding developers away from problematic middleware and towards the recommended built-in methods.

Core Features & Use Cases

  • Correct File Handling: Utilizes request.formData() for efficient file processing in API routes.
  • Avoids Blocking Middleware: Prevents the use of Express-style middleware like multer that can cause request pipeline hangs.
  • Use Case: Implement a secure and performant file upload feature for user-submitted content in a Next.js application.

Quick Start

Use the nextjs-api-file-upload skill to handle a file upload in your Next.js API route.

Frequently Asked Questions about nextjs-api-file-upload

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I handle file uploads in Next.js App Router route handlers?

To handle file uploads in Next.js App Router route handlers, you should use the built-in `request.formData()` method to stream and parse files directly. This avoids blocking middleware and maintains request pipeline performance.

Why does my Next.js API route hang when I use multer for file uploads?

Your Next.js API route hangs because Express-style middleware like multer causes request pipeline hangs in App Router route handlers. You should use `request.formData()` instead for efficient file processing without blocking the pipeline.

What is the best way to process user-submitted files in a Next.js application?

The best way to process user-submitted files in a Next.js application is using the built-in `request.formData()` method within App Router API route handlers. This approach securely streams and parses files directly without relying on problematic middleware.

Can I use `request.formData()` to stream files directly in Next.js API routes?

Yes, you can use `request.formData()` to stream and parse files directly within Next.js API route handlers. This built-in method is the recommended approach for handling file uploads efficiently in the App Router.

How does the `request.formData()` method work for parsing files in Next.js?

The `request.formData()` method works by streaming and parsing incoming file data directly within the Next.js App Router route handler. This mechanism avoids blocking middleware, resulting in improved request pipeline performance.