getCroppedCanvas and upload image, The image size change

[zeroone2005]

The image size is changed from 177KB to 777KB, when I use getCroppedCanvas function and toBlob to uploaded it ,

_sImage.cropper('getCroppedCanvas', {"width": settings.width, "height": settings.height, "fillColor": '#FFF'}).toBlob(up, 'image/jpeg', settings.quality);

up function:

        function up(blob){
            let formData = new FormData();
            formData.append('fileData', blob);
            $.ajax({
                "data"        : formData,
                "processData" : false,
                "contentType" : false,
                "dataType"    : 'json',
                "type"        : 'POST',
                "url"         : settings.uploadfile,
                "success"     : function(data){
                                  console.log(data.img);
                                },
                "error"       : function(){
                                    console.log(data.info);
                                },
            });
        }

[fengyuanchen]

Four questions:

• What's the size of the output image?
• What's the size of the original image?
• What's the mine type of the original image?
• What's the value of the quality?

[zeroone2005]

original image : .jpg 144KB 1100px * 880px output image : .jpg 783KB 996px * 892px quality: 1

ajax request header: POST /upload/387 HTTP/1.1 Connection: keep-alive Content-Length: 802492 Pragma: no-cache Cache-Control: no-cache Accept: application/json, text/javascript, /; q=0.01

[fengyuanchen]

You should not set the quality to 1, see here.

[zeroone2005]

TKS.