Tips: Next.jsのServer Actionsで送れるリクエストサイズを1MBから変更する

この記事は何

Next.jsではV14からserverActionsを利用できます。
Server Actionsについては以下の記事をご覧ください。

Server Actionsはとても便利なのですが、リクエストサイズが大きいとエラーになることがあります。

この記事では送れるリクエストサイズを変更する方法について簡単にまとめます。

Server Actionsにリクエストサイズ上限が設定されている理由

Server Actionsでは、リクエストを送るタイミングで事前にサイズの検証をおこなうことでサーバーの負荷上昇を防いでいるようです。

しかし、この制限によって送りたいリクエストをうまく送ることができない場面も発生します。

解決方法

解決方法はドキュメントに記載されており、
以下のようにbodySizeLimitの指定を行うだけで変更できます。

next.config.js

/** @type {import('next').NextConfig} */
 
module.exports = {
  experimental: {
    serverActions: {
      bodySizeLimit: '2mb',
    },
  },
}

Vercelの場合は注意が必要かも

こちらに関しては検証できていないですが、Vercelを利用している場合、Configでサイズを指定しても最大4.5MB、edgeの場合は4MBまでしか上限を上げられないようです。
Vercelをご利用の方はお気をつけください。