Ionic Capacitor read image as Blob

Ionic Framework
1

Capacitor provides the Camera Plugin so as we can take images on an h device - I am then using the Filesystem plugin to read the file.

Capacitors filesystem however cannot read to Blob file which means I cannot upload to firebase storage.

Is there a way to convert the image file to a bloc using capacitors Filesystem?

async takePicture() {
const image = await Camera.getPhoto({
quality: 90,
allowEditing: true,
resultType: CameraResultType.Uri
});
// image.webPath will contain a path that can be set as an image src. You can access
// the original file using image.path, which can be passed to the Filesystem API to
// read the raw data of the image, if desired (or pass resultType: CameraResultType.Base64 to getPhoto)
var imageUrl = image.webPath;
// can be set to the src of an image now
imageElement.src = imageUrl;
}

async fileRead() {
let contents = await Filesystem.readFile({
path: ‘secrets/text.txt’,
directory: FilesystemDirectory.Documents,
encoding: FilesystemEncoding.UTF8
});
}

2

Sir, did you resolve this issue? I’m kinda struggling with it!

3

@dalepo yes - run ‘readFile()’ on the uri path of the file you want to upload, and it will return and object.

The object = {
data:
}

you can then pass the data from this object to the firebase upload function, and it works perfectly.

ref.putString(image.data, ‘base64’);