How to access data from ReadableStream response?

Question

I made an API call to an endpoint and it returns this:

const test = () => {
    fetch(endpoint)
      .then((response) => {
        console.log(response.body)
      })
      .catch((err) => {
        console.log(err);
      });
  };

How can I obtain the ReadableStream in a Base64 format? This is returning a png file.

Answer 1

Using this answer, you can get the blob and convert it to base64.

const test = () => {
    fetch(endpoint)
      .then((response) => {
        return response.blob();
      })
      .then((blob)=>{
          var reader = new FileReader();
          reader.readAsDataURL(blob); 
          reader.onloadend = function() {
              var base64data = reader.result;                
              console.log(base64data);
          }
      })
      .catch((err) => {
        console.log(err);
      });
  };

MDN on .blob()