413 response body too large error could be more clear

When I deploy a function that has a large response body (greater than 5mb):

import { readFileSync } from 'fs';
import path from 'path';

export default function handler(_, res) {
  const file = path.join(process.cwd(), 'large.mp3');
  const stringified = readFileSync(file, 'utf8');

  res.setHeader('Content-Type', 'application/json');
  return res.end(stringified);
}

I see a 500 error:

And the corresponding function log error:

This message:

LAMBDA_RUNTIME Failed to post handler success response. Http response code: 413.

Could more clearly state the reason it failed was due to the function response body size.

[leerob]

It’s likely due to the size of dehydratedStateData returned from the server - can you try only returning the data inside there you need?

[brian-enkor]

Yes, actually looking into it, we figured it must have been due to the size of data returned from the server. We tried fetching data from the client-side without getStaticProps and it seems to work now!

This issue was hard to resolve due to ambiguous error message I guess… sometimes we were looking into wrong places