Search code examples
jqueryfile-uploadjquery-file-upload

Jquery File Upload Image Resize does not work for certain images


I am using blueimps jquery file uploader. All in all everything works great. But recently I noticed that the image resize function does not resize certain images and I have no clue why.

Here are the options for the uploader:

$('#fileupload_edit_previewimage').fileupload({
    autoUpload: false,
    maxNumberOfFiles: 1,
    // Enable image resizing, except for Android and Opera,
    // which actually support image resizing, but fail to
    // send Blob objects via XHR requests:
    disableImageResize: /Android(?!.*Chrome)|Opera/
        .test(window.navigator.userAgent),
    imageMaxWidth: 600,
    imageMaxHeight: 400,
    imageCrop: false, // Force cropped images
    maxFileSize: 100000000000 // 100GB
})

Here is the image, which never gets resized:

https://uploadfiles.io/213u3

It is a 19MB JPG.

Here is an image which works:

https://ufile.io/smlpk

It is an 1MB JPG.

I have tried many different images and types, most of them do work, but some dont.

Any idea what the issue could be?

EDIT

The upload is clientside. Its a direct upload to S3, the server only created a predesigned post and signs the request.

I noticed that bigger images all fail, so there is a pattern.

I am now trying to find a solution.

EDIT

I am experimenting now with the preview canvas of jquery file uplaoder and it seems that the canvas is not even created for big images. (the idea is to use the canvas for the upload).


Solution

  • I found the issue. The client rejects the image load for big images because the default value is too low, documentation

    The solution is to increase the loadImageMaxFileSize, in my case:

    loadImageMaxFileSize: 100000000000, // 100GB