PATCH request handlers

This page explains how to implement PATCH request handlers in Next.js for updating resources.

Understanding PATCH requests

PATCH requests enable partial modifications to a resource. Unlike PUT requests that replace an entire resource, PATCH requests update only specified fields.

Creating a PATCH handler

To handle PATCH requests in a dynamic route:

1. Create a dynamic route handler (see Dynamic route handlers)
2. Export an async function named PATCH
3. Process the request body and update the resource

app/api/comments/[id]/route.ts

export async function PATCH(
  request: Request,
  { params }: { params: Promise<{ id: string }> }
) {
  const { id } = await params;
  const body = await request.json();
  const { text } = body;

  const index = comments.findIndex((comment) => comment.id === parseInt(id));
  comments[index].text = text;
  return Response.json(comments[index]);
}

Request structure

A typical PATCH request includes:

1. The resource identifier in the URL (e.g., /api/comments/1)
2. A JSON body containing the fields to update:

{
  "text": "Updated comment"
}

Processing PATCH requests

The handler:

1. Extracts the resource ID from the route parameters
2. Parses the request body to get updated fields
3. Finds and updates the resource
4. Returns the modified resource

Good to know

• PATCH requests require a dynamic route to identify the resource
• Changes to in-memory data (like arrays) don’t persist after server restart
• Always validate input data and handle potential errors