First arg must be a Blob object or a File object. Image compressor

Question

I am making an image compressor. In the image you see a simple design with a dragon drop to fill in ur files. But i want to download the image i keep getting one error (displayed below).

[This is what i got so far.][1] [1]: https://i.sstatic.net/2RJ3v.png

This is my download funtion but when i press the button to download i keep getting 1 error

  function download(file, res) {
    console.log(file);
    var fdata = new FormData()
    fdata.append('upload_preset', 'image_name')
    fdata.append('file', file)
    // converts the picture and instant download the new image.
    imageConversion.compressAccurately(file, 50).then(res=>{
      console.log(res)
      imageConversion.downloadFile(res)
    })
  }

Error:

conversion.js:1 Uncaught (in promise) Error: compressAccurately(): First arg must be a Blob object or a File object.

I tried a lot of things but i can't really figure it out. Someone got any idea how to solve this?

Answer 1

I figured it out. I had to add an Array and make the file excisable for all functions.

function handleFiles(files) {
  window.files = files;
  files = [...files];
  files.forEach(previewFile);
}

function download() {
  Array.from(files).forEach((element) => {
    // converts the picture and instant download the new image.
    imageConversion.compressAccurately(element, 50).then((res) => {
      console.log(res);
      imageConversion.downloadFile(res, 'test');
    });
  });
}