How to Increase File Upload Size in Web Applications (Nextjs, Express.js, Nginx, Apache)

When handling file uploads in a web application, the default upload size limit may be too small for large files. Here’s how you can increase it based on different technologies.

1. Next.js (API Routes & Server Actions)

In Next.js, you can configure the upload size limit in next.config.js:

const nextConfig = {
  api: {
    bodyParser: {
      sizeLimit: "10mb", // Adjust this based on your needs
    },
  },
  experimental: {
    serverActions: {
      bodySizeLimit: "2mb", // Increase for server actions if needed
    },
  },
};

export default nextConfig;

2. Express.js

For an Express server, use express.json() or express.urlencoded() with a custom limit:

app.use(express.json({ limit: "50mb" }));
app.use(express.urlencoded({ limit: "50mb", extended: true }));

3. Nginx (Reverse Proxy)

If you use Nginx as a proxy, update its config:

client_max_body_size 100M;

Restart Nginx after changes:

sudo systemctl restart nginx

4. Apache

For Apache, update .htaccess or php.ini:

php_value upload_max_filesize 100M
php_value post_max_size 120M

Restart Apache:

sudo systemctl restart apache2

Best Regards,
N I Rimon 🌹