image-processingfile-uploadimage-uploadingmime-typesbootstrap-file-upload

Krajee Bootstrap File Input fails with large files


I am using krajee file input to upload images. It works well for small images. But it fails to upload large images. When I checked requests in server side the small images has mimeType=image/jpeg and large images has mimeType=application/octet-stream with size=0 Here are my file uploader configurations.

$("#file-4").fileinput({
theme: 'fa',
uploadUrl: uploadUrl,
allowedFileExtensions: ['jpg', 'png', 'gif', 'jpeg'],
overwriteInitial: false,
maxFileSize: 12500,
maxFilesNum: 4,
showCaption:false,
rtl: true,
showRemove: false,
showUpload: false,
showCancel: true,
browseOnZoneClick: true,
initialPreview: imageData,
initialPreviewConfig: JSON.parse(unescape(configData)),
deleteUrl: 'http://localhost:8000/ajax/upload/image/delete?fileName=' + $('#fileName').val(),
deleteExtraData: {file: this.key},
initialPreviewThumbTags: tags,
browseLabel: 'Upload Images',
layoutTemplates: {
    footer: footerTemplate,
    actions: actionsTemp
},
uploadExtraData: {
    folder: $('#folder').val()
}
});

Solution

  • Likely the issue is with server side settings, for example in php.ini.

    ; Maximum allowed size for uploaded files.
    upload_max_filesize = 40M
    
    ; Must be greater than or equal to upload_max_filesize
    post_max_size = 40M
    

    Both should be set above the max size you wish to upload.