When working with Sitecore Experience Editor in Next.js applications, you may encounter a “Body exceeded 2mb limit error” error that prevents content authors from accessing the editing interface. This article explains how to identify and resolve this common issue.
Understanding the Problem
The error typically manifests as:
Connection to your rendering host failed with a Body exceeded 2mb limit error.
Ensure the POST endpoint at URL https://web-performance-ch-node.azurewebsites.net/api/editing/render has been enabled
While many developers initially assume this is related to infrastructure limits (like Vercel’s 4.5MB payload limit or AWS Lambda’s approximately 6MB restriction), the actual cause is often much different and involves Next.js API route configuration limits.
Root Cause Analysis
The issue originates from Next.js API routes having a default body size limit of 1MB for incoming requests. In Sitecore’s editing APIs, this limit is configured in the Next.js API route configuration, not at the hosting platform level.
Even payloads significantly smaller than platform limits (such as 700KB) can trigger this error due to the restrictive Next.js default settings.
The Solution
To resolve this issue, you need to update the body size limits in two key files within your Next.js application:
File 1: src/pages/api/editing/render.ts
// Bump body size limit (1mb by default) and disable response limit for Sitecore editor payloads
// See https://nextjs.org/docs/api-routes/request-helpers#custom-config
export const config = {
api: {
bodyParser: {
sizeLimit: '2mb',
},
responseLimit: false,
},
}
File 2: src/pages/api/editing/data/[key].ts
// Bump body size limit (1mb by default) and disable response limit for Sitecore editor payloads
// See https://nextjs.org/docs/api-routes/request-helpers#custom-config
export const config = {
api: {
bodyParser: {
sizeLimit: '2mb',
},
responseLimit: false,
},
}