如何在不降低质量的情况下使用 Cropperjs 裁剪图像？

问题描述

我在客户端显示之前上传的图片，并使用cropperjs让用户裁剪它，然后点击按钮重新上传。

const submit_button = document.getElementById('submit-btn');
const input = document.getElementById('id_file');
const image = document.getElementById('image');

let cropper = new Cropper(image,{
    autoCropArea: 1,zoomable: false,preview: '.preview'
})


input.addEventListener('change',() => {
    const img_data = input.files[0]
    image.src = URL.createObjectURL(img_data);
    cropper.replace(image.src)
});

submit_button.addEventListener('click',() => {
    cropper.getCroppedCanvas({
        imageSmoothingEnabled: true,imageSmoothingQuality: 'high'
    }).toBlob((blob) => {
        let file = new File([blob],"cropped.png",{type: "image/png",lastModified: new Date().getTime()});
        let container = new DataTransfer();
        container.items.add(file);
        input.files = container.files;


        document.getElementById("form").submit();
    },'image/png',1);
});

代码工作得很好，只是每次新裁剪都会对图像进行压缩。如何禁用压缩？我已经尝试了一些建议（图像平滑，将质量设置为 1），但这根本不起作用。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

cropperjs django