You can directly upload it to your s3 bucket.

Before:
Client -> Nextjs Server (hit limit) -> S3 Bucket

After:
Client -> S3 Bucket

To control what the client is allowed to upload and what not, you can create a policy. The whole process is documented here: https://aws.amazon.com/de/blogs/compute/uploading-to-amazon-s3-directly-from-a-web-or-mobile-application/

Can Vercel limit? Or Next.js itself?
it's part my code
const uploadPromises = images.map(async (img) => { const extension = img.originalName.split('.').pop(); const fileName =${slugify(img.fileName, { lower: true })}.${extension}; if (img.file instanceof File) { const bufferImage = await img.file.arrayBuffer(); const params = { Bucket: 'mevaro', Key: fileName, Body: Buffer.from(bufferImage), ContentType:image/${extension}, }; await s3.putObject(params); updateImages.push(fileName); } else { console.error('img.file is not a File'); } }); await Promise.all(uploadPromises); await connectDB(); const fabric = getCollection('fabrics'); await fabric.insertOne({ title: title.trim(), slug: slug.trim().toLocaleLowerCase, seo_title: seo_title.trim(), seo_content: seo_des.trim(), compound: compound, resistance: resistance, density: density, category: category, url_video: url_video, isChecked: isChecked, price: Number(price), content: updateContent, images: updateImages, }); await closeConnection(); revalidatePath('/fabrics', 'layout'); } catch (error) { await closeConnection(); throw error; } };

yea, there are limits. On localhost (your server) you can control the limit by yourself. However when you host it somewhere (server from others) you use their limits. And vercel in this case has these limits

how can I find out the limit or change it?

it's a hard limit of 4.5 mb when on vercel

you need to generate a presigend url and upload directly to s3

instead of to nextjs -> s3

the payload size is now up to you control

since the data goes straight to s3

btw you check-out the source of my package, next-upload which handles all this behind the scenes, or just use it in your app for a turn-key upload solution.

https://github.com/TimMikeladze/next-upload

you can combine it with keyv mongo adapter if you want some basic mongo storage of your upload file's metadata

should just work out of the box, if you pass it in the arguments

thank you

happy to help