PayloadTooLargeError: request entity too large in mern stack development (express)

Question

Edit : as suggested by Lawrence Cherone's answer in the comments i had to set the size limit specifically in bytes not in simple text so after using :

app.use(express.json({limit : 52428800}))

everything worked well, the getRawBody function that you can see in the error log tried converting the text '50mb' into a bytes to get the length limit using this :

var limit = bytes.parse(opts.limit)

and for a reason that i still dont know it wasnt converting correctly, funny thing is i tried testing back with '50mb' as an option and it works now, the reason why it didnt work the first time will forever be a mystery to me

Edit : after some testing i figured only images that are lower than 35kb in size worked and after i converted the other images into a lower size they didnt cause any problems, some people suggested these options as alternatives :

• store all the images in my mongodb database directly using gridfs
• try to convert the images before sending them someway
• use another cloud storage service like Amazon s3 for storing my images

i'm developping a mern react application and one of the feature is simply uploading the profile picture to the server as a base64 string and storing it in mongodb, i keep getting this error whenever i send the axios request :

PayloadTooLargeError: request entity too large
at readStream (D:\projects\Knnectify\server\node_modules\raw-body\index.js:156:17)
at getRawBody (D:\projects\Knnectify\server\node_modules\raw-body\index.js:109:12)
at read (D:\projects\Knnectify\server\node_modules\body-parser\lib\read.js:79:3)
at jsonParser (D:\projects\Knnectify\server\node_modules\body-parser\lib\types\json.js:135:5)
at Layer.handle [as handle_request] (D:\projects\Knnectify\server\node_modules\express\lib\router\layer.js:95:5)        
at trim_prefix (D:\projects\Knnectify\server\node_modules\express\lib\router\index.js:328:13)
at D:\projects\Knnectify\server\node_modules\express\lib\router\index.js:286:9
at Function.process_params (D:\projects\Knnectify\server\node_modules\express\lib\router\index.js:346:12)
at next (D:\projects\Knnectify\server\node_modules\express\lib\router\index.js:280:10)
at expressInit (D:\projects\Knnectify\server\node_modules\express\lib\middleware\init.js:40:5)

i've searched through hundreds of posts about similar issues and they all seem to tell you to set the limit in the express server config like this :

app.use(express.json({limit : '50mb',extended : true}))
app.use(express.urlencoded({limit : '50mb',extended : true}))

this doesnt work for me no matter how high i set the limit , the images are about 500kb size and its driving me crazy since it seems to work for everyone else i have no idea why it doesnt work for me, my axios request is something like this:

const {data} = await axios.post(`${_backend_URL}/users/update`, {newUser})

where newUser is a simple object containing a profilepicture field with a base64 string, at first i thought the problem was because i was trying to send gif images as base64 so i tried other images but it seems to always give this problem no matter the file type

the 3 files used are these and only the third seems to go through but im clueless as to why the other 2 wont work, also is there a way to intercept this error in my server so that at least i can start consol logging some stuff ?

enter image description here

enter image description here

enter image description here

Torrietorrin

try adding length: 52428800, to them options, this is where the error comes from – Expressman

holy Smith it worked, i used {limit : 52428800} apparently {limit : '50mb') doesnt get the job done and i have to set it the way you suggested, i tracked the module options you provided and somewhere along the line it converts the text '50mb' into a number of bytes to set the length limit for the body and it doesnt get the value right, you're a life saver – Torrietorrin

@Torrietorrin could you please share where exactly you added the length parameter? I am having the same issue. – Nogas

Answer 1

I tried to fetch an image blob from the server and I got that error, so I fixed it by add limiting the options to express.raw()

router.post("/encode", express.raw({type: '*/*', limit: '1mb'}), ImageController.encodeBlurhash);

Vicinal

Answer 2

I think problem is not with node or express js because I also try too many solution but after that I found the one solution that's work for me.

In index.js file set following code

app.use(bodyParser.json({limit: '50mb'}))
app.use(bodyParser.urlencoded({ limit: '50mb',extended: true }));

And this path /etc/nginx/nginx.conf update nginx server configuration under the http only this line

client_max_body_size 100M;

Quickfreeze