蓝色小鬼文件上传客户端大小图像调整大小和裁剪

Question

我正在使用这个 jquery 图片上传插件 https://github.com/blueimp/jQuery-File-Upload

我需要以客户端大小调整/裁剪图像，使其具有精确的高度和宽度，然后上传到服务器。

这是上传脚本的一部分，它工作正常，唯一的问题是它只是调整图像大小而不裁剪，我最终得到了上传的图像，例如宽度为 150 像素，高度为 133 像素（尽管初始图片的高度和宽度超过 1000 像素，我想要精确的高度和宽度 - 150 像素）。从选项列表中，我认为imageCrop 应该可以解决问题，https://github.com/blueimp/jQuery-File-Upload/wiki/Options#imagecrop，但事实并非如此。我做错了什么，或者插件不支持我需要的功能？如果是这样，有什么方法可以使用这个插件使用一些外部库/函数来实现我需要的东西？

谢谢

编辑：

我也试过这个选项

 canvas: true,
 cover: true,
 crop: true,
 thumbnail: true,
 aspectRatio: '1/1'

但无济于事

$('#fileupload').fileupload({
    url: 'test.php'
     dataType: 'json',
     imageCrop: true,
     process: [
         {
             action: 'load',
             fileTypes: /^image\/(gif|jpeg|png)$/,
             maxFileSize: 20000000 // 20MB
         },
         {
             action: 'resize',
             maxWidth: 150,
             maxHeight: 150,
             minWidth: 150,
             minHeight: 150,
             imageCrop: true
         },
         {
             action: 'save'
         },
         {action: 'duplicateImage'},
         {
             action: 'resize',
             maxWidth: 100,
             maxHeight: 100,
             minWidth: 100,
             minHeight: 100,
             imageCrop: true
         },
         {
             action: 'save'
         }
     ], ...

Answer 1

根据“blueimp”手册执行Client side Image Resizing 您必须将选项disableImageResize 设置为false

$('#fileupload').fileupload({
    url: 'test.php',
    dataType: 'json',
    disableImageResize: false,
    imageMaxWidth: 800,
    imageMaxHeight: 800,
    imageCrop: true
})

Reference to src.