Donaldcwl / browser-image-compression

Image compression in web browser
MIT License
1.3k stars 160 forks source link

Can i compress a BLOB? #132

Closed phantodev closed 2 years ago

phantodev commented 2 years ago

Hi guys... i have a ERROR: Error: The file given is not an instance of Blob or File

I am trying to use bellow:

const croppedImage = "'blob:http://localhost:3000/885e979e-ceb3-4d58-97e5-af42fa4cf950'";

const options = { maxSizeMB: 1, maxWidthOrHeight: 414, useWebWorker: true }

const compressedFile = await imageCompression(croppedImage, options);

There are a way to do this?

Donaldcwl commented 2 years ago

The croppedImage (string type) variable in the script is the URL to the image. You need to load image URL to blob type, you may refer to: https://stackoverflow.com/a/52410044

Following is an edited version of your script:

const croppedImage = await fetch('blob:http://localhost:3000/885e979e-ceb3-4d58-97e5-af42fa4cf950').then(r => r.blob());

const options = {
maxSizeMB: 1,
maxWidthOrHeight: 414,
useWebWorker: true
}

const compressedFile = await imageCompression(croppedImage, options);