Tengo un componente que procesa y carga imágenes. Actualmente proceso la imagen en mi backend y luego la envío a mi frontend y luego la cargo desde allí. Me gustaría hacer todo en mi backend. El único problema es que el punto final de carga requiere el objeto FormData() . Encontré un form-data paquete npm que estoy usando en mi backend ahora, pero sigo recibiendo un error.

Así es como funciona actualmente:

 // frontend logic: const data = await uploadImage(img); const file = new File([Buffer.from(data)], `img-${i}.webp`, { type: "image/webp", }); const formData = new FormData(); formData.append("path", "images"); formData.append("files", file, file.name); await axios .post("http://localhost:1338/api/upload", formData, { headers: { authorization: `Bearer ${jwtToken}` }, }) .then(({ data }) => { console.log(data); }) .catch(console.log); // // // backend logic: const data = await processImage(img.url); return data;

Esto es lo que estoy tratando de hacer:

 // frontend logic: const data = await uploadImage(img); // // // backend logic: const data = await processImage(img.url); const formData = new FormData(); formData.append("path", "images"); formData.append("files", data, "file.name"); await axios .post("http://localhost:1338/api/upload", formData, { headers: { authorization: `Bearer ${process.env.JWT_TOKEN}` }, }) .then(({ data }) => { console.log(data); }) .catch(console.log); // I get error: 413 Payload Too Large

Estoy tratando de hacerlo con la misma imagen que funciona con el primer método. Tal vez necesito crear un new File() , pero no pude encontrar ningún paquete npm que funcionara para eso. ¿Qué debo hacer para que esto funcione?