Convert Blob Url To File Object With Axios

I have an image cropper that creates a blob file for each crop. When the user finished cropping he clicks a success button and I get an URL that looks like this: blob:https://local

Solution 1:

Apparently what I tried was a bit overkill. Here's the solution that worked for me:

const config = { responseType: 'blob' };
axios.get(blobUrl, config).then(response => {
    new File([response.data], fileName);       
});

Solution 2:

set axios header :

axios.get(blobUrl, {
       responseType: 'blob'/* or responseType: 'arraybuffer'  */         
})
.then(r => r.blob())
.then(blobFile => 
     new File([blobFile], fileName, { type: blobFile.type })
);