I have a php backend that gives me binary img data. It uses file_get_contents('myImageUrl') and returns the result to my front-end using axios. The file_get_contents result looks like this:

What I want is to use this to share the image via javascript navigator.share() option. I came this far:

let url = this.$store.dispatch("api/myendpoint");
Promise.all([
    url
])
.then((data) => {
    const filesArray = new File([data[0]], "filename.png", {type: data[0].type})
    navigator.share({
        text: 'See this image',
        files: filesArray,
    })
})
.catch((error) => {
    console.log(error)
});

But it the console I get the following error:

Uncaught (in promise) TypeError: Failed to execute 'share' on 'Navigator': Failed to read the 'files' property from 'ShareData': The object must have a callable @@iterator property.