Ionic Native HTTP request returns Blob without type

Question

I have this piece of Code that grabs the Image string and encodes it as Blob

const reqOptions: any = {
    method: 'get',
    responseType: 'blob',
    headers: {
        accept: 'image/*'
    }
}
ionresp = await this.ionicHttp.sendRequest(url, reqOptions)

if i log the Blob im getting

Blob {size: 15312, type: ""}

The Blob i need has a type of image/png but im not able to convert the Blob afterwards or manipulate the requested data so i get a Blob type set

if i try to fetch the data with a ionicHttp.get() and convert it into a Blob myself the ionresp is returning an empty Blob

resp.Data = new Blob([ionresp], {type: type})

Answer 1

There was no Error with the Blob or returned but the FileReader doesnt work in Capacitor and i had to implement a workaround to get it working.

getFileReader(): FileReader {
    const fileReader = new FileReader();
    const zoneOriginalInstance = (fileReader as any) 
    ["__zone_symbol__originalInstance"];
    return zoneOriginalInstance || fileReader;
}

convertBlobToBase64(blob: Blob): Promise<string> {
    return new Promise<string>((resolve, reject) => {
        let reader = this.getFileReader();
        reader.readAsDataURL(blob);
        reader.onload = () => resolve(reader.result.toString());
        reader.onerror = error => reject(error);
    })
}

This is neccesary because Capacitor creates the FileReader in his own Zone and the other code cannot interact with it.