Spent 6 hours to open PNG! Whats wrong?

1

Hi, All)

I could not understand what is the problem with PNG format as I have tried almost all poosible to open it in browser:

  1. Filereader tells Failed to execute ‘readAsDataURL’ on ‘FileReader’: parameter 1 is not of type ‘Blob’.
  2. Buffer.from(res.content, ‘binary’).toString(‘base64’) shows nothing as base64 image. btoa(res.content).
  3. Btoa tells Failed to execute ‘btoa’ on ‘Window’: The string to be encoded contains characters outside of the Latin1 range.

Also I have checked all Accept options. I just need to open received pic in a browser using JS…

I can’t find a solution for many hours yet!

2

No, thats really something VERY strange. I just have found that standard nodejs http which used in Meteor changes image string (as well as does not work with multipart and body) and it is necessary to add “var response = HTTP.call(‘GET’, url,{npmRequestOptions: { encoding: null }})” in http module. Hope that will help as fetch appeared just couple of month ago and a lot using standard library. Solved.

3

Hey,
it really does sound strange. It shouldn’t take that much time.

Something like this should work:

  const imageBlob = // request for getting the image from Sentinel Hub
  const img = document.createElement('img');
  img.width = '...'; // the same size as in the request
  img.height = '...'; // the same size as in the request
  img.src = URL.createObjectURL(imageBlob);
  const imgContainer = document.getElementById('...'); // id of the container where you want to add the image
  imgContainer.appendChild(img);

This snippet doesn’t check if there was an error while requesting the image, so that’s something to add.

Hope this helps.