I got binary data of the png image from some third party api
This is the data text that I get after console log :
`�PNG
IHDRf�:%PLTE���U��~IDATx�옱�� D[��I�BfBʌP�R_��ݗ~}�,��8���D��3x뭷��”IV��2�����o|`�,��yi.��r�>�%��UN�<#@�o�4$۬�!7 �”>PM�d
�6��-ڻ��˫M���4�[�<M�d���_�~w��I�B}Y�!�����&����y`3��.3�˰%�m:.�_’�i�9V�f���)�ի�l $m���5@nS>y6�)��֝�|;���b*@�yt3�5�y6�4’�$R��S�����|�xR�6OC�$���ԀՐ����a3��ۼ�ҒfL���x�;�^}�S�y�;��ե���0��5���{“=��6��T1���T?_a`lr����`E�<I���Ȫ1B��%����ݒ����Sc��
�ǃ週��E.t%�C�s�YI�2�� �}y�7��}ootM�7H�f�c�w S�rLiI`q��୷֟����o���IEND�B`�`
In the browser , when open the network tab the image will be display like this :
image display
How can I display the data above as image like below picture ? I’ve try every possible way by convert data to base64 or change accept type from the request header but none of them works .
Any help will be much appreciated . Thank you for reading
This is the code to convert data to base64 that I’ve tried :
` const blob = new Blob([esimQrCode], { type: “image/png” });
const base64Data = Buffer.from(esimQrCode).toString(“base64”);
return <img src={data:image/png;base64,${base64Data}} />
`