vercel/next.js · error

<Form> only supports file inputs if `action` is a function.

Error message

<Form> only supports file inputs if `action` is a function. File inputs cannot be used if `action` is a string, because files cannot be encoded as search params.

What it means

createFormSubmitDestinationUrl serializes FormData for the submit target; when an entry's value is a File (from a file input) and the Form's action is a string (GET navigation), files cannot be encoded into search params, so this error is thrown to stop the submit.

Source

Thrown at packages/next/src/client/form-shared.tsx:90

    //  "Set parsed action's query component to `query`."
    //   https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#submit-mutate-action
    //
    // We need to match that.
    // (note that all other parts of the URL, like `hash`, are preserved)
    targetUrl.search = ''
  }

  const formData = new FormData(formElement)

  for (let [name, value] of formData) {
    if (typeof value !== 'string') {
      // For file inputs, the native browser behavior is to use the filename as the value instead:
      //
      //   "If entry's value is a File object, then let value be entry's value's name. Otherwise, let value be entry's value."
      //   https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#converting-an-entry-list-to-a-list-of-name-value-pairs
      //
      if (process.env.NODE_ENV === 'development') {
        console.warn(
          `<Form> only supports file inputs if \`action\` is a function. File inputs cannot be used if \`action\` is a string, ` +
            `because files cannot be encoded as search params.`
        )
      }
      value = value.name
    }

    targetUrl.searchParams.append(name, value)
  }
  return targetUrl
}

export function checkFormActionUrl(
  action: string,
  source: 'action' | 'formAction'
) {
  const aPropName = source === 'action' ? `an \`action\`` : `a \`formAction\``

View on GitHub (pinned to 0eb3775416)

Solutions

1. Use a function (Server Action) for `action` when the form contains file inputs, or remove the file input.

When it happens

Trigger: Thrown at packages/next/src/client/form-shared.tsx:90 when the library encounters an invalid state.

Common situations: See trigger scenarios.

AI-assisted analysis of vercel/next.js@0eb3775416 (2026-08-19). Data as JSON: /api/errors/7227ae807ae39c60. Report an issue: GitHub.