如何使用 DropzoneJS 压缩图像？

Question

我目前正在尝试使用 DropzoneJS 压缩图像。我想按质量压缩图像，删除元数据等，而不仅仅是调整大小。我该怎么做？

Answer 1

我找到了解决办法。您将需要图像压缩库，可在此处下载：https://xkeshi.github.io/image-compressor/

// "myDropzone" is the camelized version of the HTML element's ID
Dropzone.options.myDropzone = {
  transformFile: function(file, done) {
     const imageCompressor = new ImageCompressor();

     imageCompressor.compress(file, {
     // I assume the output image won't have the meta data anymore
     checkOrientation: true,
     // Limit output image width & height
     // For controllable file size & avoid blank output image
     // https://github.com/xkeshi/image-compressor#maxwidth
     maxWidth: 8192,
     maxHeight: 8192,
     // 0.8 is the default and already good enough
     // https://github.com/xkeshi/image-compressor#quality
     quality: 0.6,
     // Convert ALL PNG images to JPEG
     convertSize: 0,
     })
     .then((result) => {
       // Handle the compressed image file.
       done(result)
     })
     .catch((err) => {
       // Handle the error
       throw err
     })
  }
};

如何使用 DropzoneJS 压缩图像？

How can I compress images with DropzoneJS?

javascript

image

dropzone.js

dropzone