langflow-ai/langflow · warning · Error

The file size is too large. Please select a file smaller tha

Error message

The file size is too large. Please select a file smaller than {{maxSizeMB}}.

What it means

Thrown by the useFileSizeValidator hook when a selected file's byte size exceeds maxFileSizeUpload from the utility store (populated from the backend's LANGFLOW_MAX_FILE_SIZE_UPLOAD config). The message is the i18n key errors.fileTooLarge with the limit interpolated via formatFileSize, so users see the concrete limit (e.g. 'smaller than 100 MB').

Source

Thrown at src/frontend/src/shared/hooks/use-file-size-validator.ts:11

import { useTranslation } from "react-i18next";
import { useUtilityStore } from "@/stores/utilityStore";
import { formatFileSize } from "@/utils/stringManipulation";

const useFileSizeValidator = () => {
  const { t } = useTranslation();
  const maxFileSizeUpload = useUtilityStore((state) => state.maxFileSizeUpload);

  const validateFileSize = (file) => {
    if (file.size > maxFileSizeUpload) {
      throw new Error(
        t("errors.fileTooLarge", {
          maxSizeMB: formatFileSize(maxFileSizeUpload),
        }),
      );
    }
    return true;
  };

  return { validateFileSize };
};

export default useFileSizeValidator;

View on GitHub (pinned to 976ec789d2)

Solutions

Select a file under the displayed limit, or compress/split the file first
Raise the server limit: set LANGFLOW_MAX_FILE_SIZE_UPLOAD (bytes) in the backend env and restart, so the fetched config raises the frontend limit too
If the limit looks wrong in the UI, hard-refresh so the utility store re-fetches /config before concluding the backend change failed
For very large datasets, upload to object storage and reference by URL instead of the file manager

Example fix

# before (default limit too small for user data)
# .env
LANGFLOW_MAX_FILE_SIZE_UPLOAD=104857600

# after
LANGFLOW_MAX_FILE_SIZE_UPLOAD=1048576000  # 1 GB; also raise proxy body limits

Defensive patterns

Strategy: validation

Validate before calling

const { validateFileSize } = useFileSizeValidator();
const safeFiles = files.filter((f) => f.size <= maxFileSizeUpload);
// or check explicitly before upload:
if (file.size > maxFileSizeUpload) skipAndNotify(file);

Try / catch

try {
  validateFileSize(file);
} catch (e) {
  if (e instanceof Error && e.message.includes("file size")) {
    showFileSizeWarning(file.name); // skip file, continue batch
  } else throw e;
}

Prevention

Read maxFileSizeUpload from /config on app start and show it next to upload controls
Filter oversized files before batching uploads so one bad file doesn't abort the batch
Keep LANGFLOW_MAX_FILE_SIZE_UPLOAD aligned with proxy body-size limits

When it happens

Trigger: Any file-picker or drag-drop upload path that calls validateFileSize(file) with file.size > maxFileSizeUpload — e.g. attaching a 500 MB CSV when the server caps uploads at 100 MB.

Common situations: Default server limit is far smaller than the user's file; admins who raised LANGFLOW_MAX_FILE_UPLOAD on the backend but the frontend store still holds the old value (stale config fetch); reverse proxies (nginx client_max_body_size) rejecting before this check.

Related errors

AI-assisted analysis of langflow-ai/langflow@976ec789d2 (2026-08-14). Data as JSON: /api/errors/265b63f0d12e98e6. Report an issue: GitHub.