413 Content Too Large Errors in Dokku and Next.js

Introduction

The HTTP 413 Content Too Large client error response status code indicates that the request entity was larger than limits defined by server. The server might close the connection or return a Retry-After header field.

The Problem

Our Amalinvest app relies on Next's server actions. By default, the maximum size of the request body sent to a Server Action is 1MB, to prevent the consumption of excessive server resources in parsing large amounts of data. However, you can configure this limit using the serverActionsBodySizeLimit option. It can take the number of bytes or any string format supported by bytes, for example 1000, '500kb' or '3mb'.

One of our users reported an issue that was only happening in one of the funds containing over a 500 holdings. Whenever the user tried loading the market value of the mentioned fund, this error was being thrown in sentry.

{
  "type": "http",
  "category": "fetch",
  "level": "warning",
  "data": {
    "method": "POST",
    "status_code": 413,
    "url": "https://app.amalinvest.com/funds/pf_id"
  }
}

This confirmed the issue: large portfolio payloads exceeded the allowable request body size.

Observations

  1. Updating next.config.js to increase body size limit of server actions resolved the issue in the development environment but the issue was still happening in production.

Root Cause

Our Dokku deployment uses Nginx as a reverse proxy. All requests go through Nginx before reaching the Next.js app. The default Nginx client_max_body_size limit is 1MB, which was insufficient for our application’s needs.

Solution

Updating Nginx Configuration in Dokku

We resolved the issue by increasing Nginx’s client_max_body_size setting. Here’s how to do it:

  1. Update the Nginx configuration for your Dokku app:

    dokku nginx:set <app-name> client-max-body_size 10M

  2. Rebuild the Nginx configuration:

    dokku proxy:build-config <app-name>

Verifying the Fix

After applying the above configuration, the 413 errors disappeared, and users could proceed with liquidating their portfolios.

References

Conclusion

By tweaking the Nginx configuration in Dokku, we successfully resolved the 413 error for large portfolio payloads. This experience underscored the importance of understanding and configuring each layer of your deployment environment.