How to use formidable to upload large .mp4 files?

[littlebee]

I have the following code that works for uploading .jpg files under 1MB but doesn't work when I try to upload a 4.7MB .mp4 video. The callback appears to never get called. The last thing printed to the console from the code below is parseForm(): calling form.parse.

I'm using next.js and I've exported a config to configure the route for 20MB bodyParser.sizeLimit.

// See, github.com/codersteps/nextjs_file_uploader/blob/main/lib/parse-form.ts
async function parseForm(
  req: NextApiRequest,
): Promise<{ fields: formidable.Fields; files: formidable.Files }> {
  return await new Promise(async (resolve, reject) => {
    const uploadDir = ensureUploadDir()
    
    console.log("parseForm(): calling formidable", { uploadDir });
    const form = formidable({
      maxFiles: 100,
      maxFileSize: 1024 * 1024 * 100, // 100mb
      uploadDir,
      filename: (_name, _ext, part) => {
        const filename = `${uuid()}.${
          mime.getExtension(part.mimetype || "") || "jpg"
        }`;
        console.log("parseForm():", { filename, part });
        return filename;
      },
    });

    console.log("parseForm(): calling form.parse");
    form.parse(req, function (err, fields, files) {
      if (err) {
        console.error("parseForm(): error", err);
        reject(err);
      } else {
        console.log("parseForm(): form.parse success", { fields, files });
        resolve({ fields, files });
      }
    });
  });
}

[littlebee]

Sorry about not seeing it earlier, but I found the cause. The above code DOES work with mp4 files and the problem was the offscreen code where I set the Next.js config for bodyParser to accept large files. bodyParser needs to be disabled for Formidable to work on Next.js. I'll leave this post and mark it as answered for anyone else stumbling down the same path.

// Body parser is disabled for this route because formidable handles it.
export const config = {
  api: {
    bodyParser: false,
  },
};

[tunnckoCore]

@littlebee I'm using next.js and I've exported a config to configure the route for 20MB bodyParser.sizeLimit.

Glad you found the answer.

That's the thing A) we require a "clean body", that's why formidable-serverless exist too (altho i think it only works for v1); B) even if you increase the Next's settings, i don't think you can upload too big files there. And precisely, above 4MB, it's documented on their end too.

• https://vercel.com/docs/storage/vercel-blob#server-and-client-uploads