We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Image Upload Buffer

Hi,


I'm trying to upload images to server.

The request works well, but the body are buffered.

What can i do to get real data from body buffered?

I tried Buffer.from(req.body, 'utf8'), but it wrong converts the image.

"Input buffer contains unsupported image format"


Angular 14.


"@syncfusion/ej2-angular-richtexteditor": "^20.3.47",
"@syncfusion/ej2-locale": "^20.3.47",
"@syncfusion/ej2-richtexteditor": "^20.3.47",

Insert Image Settings:



Front Events:



Backend:

"parse-multipart": "^1.0.4",



newBuffer = image buffer


"Input buffer contains unsupported image format"


7 Replies

VJ Vinitha Jeyakumar Syncfusion Team December 1, 2022 01:07 PM UTC

Hi Gabriel,


Can you please share us with some more details about your reported issue for our better understanding,

  • Your exact use case scenario.
  • What is the data you are trying to get using buffer?
  • Video illustration.
  • If possible, please share with us the issue reproducing runnable sample.

Regards,
Vinitha


GA Gabriel December 5, 2022 04:04 PM UTC

Hello Vinitha,

sorry for my english.


I'm using rich text editor in my web aplication. I need to save the image in our AWS server and replace the generated URL on HTML text, making HTML size smaller.

The HTML will be use in our FAQ texts.


So i configured the saveUrl​ passing the backend save route:



Before upload the image, we check size and set on currentRequest the authorization to execute saveUrl.



In backend, i need to process the image, getting the buffer from rich text save url request and converting to WEBP, using the module "sharp".



So, first, we're using "parse-multipart" module to parse the request body.




After getting the parts, we convert the image, using the "sharp" module, to WEBP image.


After upload imagem success, replace URL generated in HTML text:



Running localy, front-end and back-end, works well, using latin1 to get buffer data.


I'm from Brazil, by the way.


But running in production, server at USA/Miami, lambda AWS, we get this error from sharp converter:

"Input buffer contains unsupported image format"


So how we convert the body buffered from request and get real and correct image data buffer?



VJ Vinitha Jeyakumar Syncfusion Team December 13, 2022 02:23 PM UTC

Hi Gabriel,


We suspect that the reported issue occurrs while converting the image, using the "sharp" module, to WEBP image. please refer to the below general blogs for your reference,



Regards,
Vinitha


GA Gabriel December 14, 2022 01:01 PM UTC

Hi Vinitha,


We don't know what encoding is needed to get buffer data from req.body sent by syncfusion rich text editor save image.

The problem isn't sharp module.

Using latin1 at Buffer.from works well running localy in my computer, front-end and back-end

But running our aplication at aws lambda, latin1 don't work.


Which encoding are necessary to get correct buffer data from req.body?