Not allowing to have a network request more than 0.5MB

[jayeshse]

Environment information

NA

Describe the bug

we are handling image upload request using amplify url where we have an image sizing upto 10 mb, is there a way we can increase the size to of the network request to 50MB ?

Reproduction steps

its simple api call we are we are sending the images to the proxy layer

[Jay2113]

Hi @jayeshse 👋 , thanks for reaching out! Have you setup storage and the upload functionality using Amplify Gen 2? If yes, Amplify will automatically perform an Amazon S3 multipart upload for objects that are larger than 5MB: https://docs.amplify.aws/react/build-a-backend/storage/upload-files/#multipart-upload.

Can you elaborate on the limitation that you are running into for network requests >0.5 MB?

[jayeshse]

Hi @Jay2113,

Thank you for your reply.

Let me try to explain in simple way, since this is an internal url I am avoiding sharing any details, may be we can raise different request from Schneider.

We are using aws amplify to deploy the web app, we have the application designed in a way where from front end we are hitting api, the service of the api is also define in the same code base (can be considered as a proxy before hitting actual api).

the POST service takes images from FE and calls the end point api which shares the image url back. during this process of making call from FE we get the error of content too large with 413 on the FE, and I believe it is not reaching the proxy layer.

If required we can have a connect to understand the behaviour better.

Thanks,
Jayesh

[jayeshse]

Hi @Jay2113,

did you get a chance to check my comment?

[Jay2113]

Thanks for sharing the additional information @jayeshse. Based on the HTTP response code (413 - Content Too Large) observed when making API calls from the frontend, this behavior can occur if either the source image or the optimized image exceeds the maximum allowed size of 4.3 MB.

As a workaround, I recommend storing the image file in Amazon S3 and using the Next.js Image component to resize and optimize it into WebP or AVIF format, which can then be served at a smaller size.

[jayeshse]

Hi @Jay2113, thank you for your reply and happy new year.

while testing I figured out that I can't send an image size is bigger than 2 MB.

And please let me know if this is incorrect, but to even store the image in s3 we would have to make api call from Frontend which would fail due to limitation ?

Also I am using Svelte and typescript for the application.

[Jay2113]

Hi @jayeshse, happy new year to you as well!

Since you are building a Svelte app, I assume you are utilizing a community adapter to deploy SSR-based apps on Amplify. When working with a framework adapter, you will need to include a routing rule in the deploy-manifest.json file that targets Amplify's image optimization service.

To help reproduce this behavior, could you share your deploy-manifest.json file or provide steps if you are using a custom plugin like @sveltejs/enhanced-img?