How to specify returning a File or Blob?

[walpolsh]

I'm just curious how to specify if a file or a blob is returned upon success?

This is how I'm using it:

export async function compress(file, quality, maxHeight, maxWidth) {
  return await new Promise((resolve, reject) => {
    new Compressor(file, {
      quality,
      maxHeight,
      maxWidth,
      success: resolve,
      error: reject,
    });
  });
}
const fullImage = await compress(fileObj, 0.7)
const thumbnail = await compress(fileObj, 0.7, 256, 256) 

In both cases I get a Blob back but would rather it remain file without doing another conversion

Thanks!

[fengyuanchen]

Currently not supported.

[VisionaryAppDev]

Hello @fengyuanchen,

I have tested this lib for a while on Nuxt 2 and it's working pretty well. But, there is some problem when using it on Nuxt 3 and I couldn't get it working. I have a very similar code to the one you provided inside docs directory on github.

The result is success, no error log inside console log and the vm.output data is updated to the new value (I have verified it through Vue DevTools) but there isn't anything changed to the browser/ui.

options: {
         ...
          success: function (result) {
            vm.output = result;
          },
          ...
        },

Not sure if you have meet this problem before. I couldn't figure out what is going on now.

[fengyuanchen]

@VisionaryAppDev Sorry, I haven't used Nuxt.

[Murtdha]

Hello @fengyuanchen,

I have tested this lib for a while on Nuxt 2 and it's working pretty well. But, there is some problem when using it on Nuxt 3 and I couldn't get it working. I have a very similar code to the one you provided inside docs directory on github.

The result is success, no error log inside console log and the vm.output data is updated to the new value (I have verified it through Vue DevTools) but there isn't anything changed to the browser/ui.

options: {
         ...
          success: function (result) {
            vm.output = result;
          },
          ...
        },

Not sure if you have meet this problem before. I couldn't figure out what is going on now.

can you provided me the code

[nik32]

A Temporary solution until this enhancement is added to the lib -

const removeExtension = (fileName: string) =>
  fileName.substring(0, fileName.lastIndexOf('.')) || fileName;

export async function compress(file, quality, maxHeight, maxWidth) {
  return await new Promise((resolve, reject) => {
    new Compressor(file, {
      quality,
      maxHeight,
      maxWidth,
      success: (compressedFile) => {
        if (compressedFile instanceof File) return resolve(compressedFile);
        else {
          const compressedFileFromBlob = new File([compressedFile], removeExtension(file.name), {
            type: compressedFile.type,
          });
          return resolve(compressedFileFromBlob);
        }
      },
      error: reject,
    });
  });
}