How do i send a resized image to the cropper ?

[Joshuajrodrigues]

I need to resize the image first (preferably below 1024 pixels) because of apple safari issues. Now im using a browser side compression for this, but I have no way of finding out if the resized image is being used on the cropper or not.

`

{ updateData(fileList) }} maxCount={maxCount} itemRender={(originNode, file, fileList, actions) => { return ( markAsPrimary(e, file)} onDelete={actions.remove} /> ); }} > {size(fileList) === maxCount ? null : uploadButton}

 async function cropRequired(file) {
if (!beforeUpload(file)) {
  return false;
}
const config = {
  quality: 0.5,
  maxWidth: 800,
  maxHeight: 600,
  debug: true
};

readAndCompressImage(file, config)
  .then (async(resizedImage) => {

    if (resizedImage.type === "image/svg+xml") {
      await customUploadRequest({ resizedImage });
      return false;
    } else if (ALLOWED_MIME_TYPES.includes(resizedImage.type)) {
      return true;
    } else {
      message.error('Please select JPG/PNG/SVG formats only.');
      return false;
    }
  })

}

`

Would this send the resized image to the cropper ? or do I need to resize it in the Upload component somwhere ?

[nanxiaobei]

You can upgrade to 4.18.0, and use beforeCrop to return a resized image to crop, like

beforeCrop={(oldFile) => {
  const resizedFile = resizeFile(oldFile); // do some thing with oldFile
  return resizedFile;
}}