jQuery 文件上传 Blueimp |客户端调整大小不起作用

Question

我试图在添加回调或任何其他回调中访问调整大小的图像，但大小没有改变，它是原始图像。

let uploader = $('#cropper_upload_' + cropper_element_id).fileupload({
    autoUpload: false,
    //url: '/home/manage_classic_question_images',
    //dataType: 'json',
    forceIframeTransport: false, // dont know why, just copy pasted from old project
    maxNumberOfFiles: 1,
    singleFileUploads: true, // default anyway
    loadImageMaxFileSize: 10000000000, // 10GB
    maxFileSize: 1000000000, // 10GB
    imageQuality: 0.5,
    disableImageResize: false,
    imageMaxWidth: 350,
    imageMaxHeight: 350});
uploader.on('fileuploadadd', function (e, data) {
    let file = data.files[0];
    console_log(file);
});
uploader.on('fileuploadprogress', function (e, data) {
    let file = data.files[0];
    console_log(file);
});
uploader.on('fileuploadsubmit', function (e, data) {
    let file = data.files[0];
    console_log(file);
});
uploader.on('fileuploadalways', function (e, data) {
    let file = data.files[0];
    console_log(file);
});
uploader.on('fileuploadprocessstart', function () {
    console.log('processstart');
});

According to the docs it should just work by enabling this:

您需要做的就是将选项 disableImageResize 设置为 false

我在 laravel 9 中使用库并使用

npm install blueimp-file-upload

安装依赖项。我检查了 node_modules 文件夹，该库还包括

jquery.fileupload-ui.js

。从我的旧项目中，我记得这是使客户端调整大小工作所必需的。

我已经坐在这里太久了，也许其他人仍在使用图书馆并且可以提供帮助？

Answer 1

看起来您已将 disableImageResize 设置为 false，这应该启用客户端调整大小。但是，图像似乎没有按预期调整大小。

一个可能的原因是你没有指定 imageCrop 选项，该选项决定是否将图像裁剪到指定的 imageMaxWidth 和 imageMaxHeight。

尝试将 imageCrop 设置为 true 并查看是否在回调中返回调整大小的图像：

let uploader = $('#cropper_upload_' + cropper_element_id).fileupload({
    autoUpload: false,
    // ...
    disableImageResize: false,
    imageMaxWidth: 350,
    imageMaxHeight: 350,
    imageCrop: true // add this option
});

如果这不起作用，您可能需要检查是否有任何可能与此问题相关的控制台错误或警告。