create javascript file object for image being shared from capacitor SendIntent.checkSendItnentReceived

Question

I am using the SendIntent plugin for capacitor (https://github.com/carsten-klaffke/send-intent) to receive shared data from other applications to my android capacitor application. When I share text data, it works fine but when I try to share pictures, I'm unable to use the path it sends in the url property to create a File object.

I have tried a few different ways to create a blob using the path it sends and then creating a file using new File([blob], 'name', type) and none of them are working. Per the documentation on the plugin, I've tried using Filesystem.readFile() (another capacitor plugin) which I believe returns a base64 encoded string in the data property. I do get data back and I've tried converting that base64 string into a blob using the following:

const { data } = await Filesystem.readFile({
              path: resultUrl
            });
            const bytes = new Array(data.length);
            for (var x = 0; x < data.length; x++) {
                bytes[x] = data.charCodeAt(x);
            }
            const arr = new Uint8Array(bytes);
            const blob = new Blob([arr], {type: shareObject.type});
            const sharedFile = new File([blob], resultUrl.split('/').pop(), {type: blob.type});

this has gotten me the closest. When I log out the sharedFile.name and sharedFile.size, they are both in line with the image I'm trying to share but I'm not able to see the image in my application when I try and display it on my view.

Is there something I'm missing? What is the best way to create a javascript File object from images that are shared with SendIntent?

TIA

Answer 1

You can use convertFileSrc(...)​ for this:

const savedPhoto = Capacitor.convertFileSrc(resultUrl),
document.getElementById("savedPhoto").src = savedPhoto;

<img id="savedPhoto" />

Btw: If you can share strings, you could also just share the image directly in Base64 format.