fineuploader - 读取文件尺寸/通过分辨率验证

Question

我想通过文件尺寸（分辨率）进行验证。

documentation page上的

只有关于文件名和大小的信息，关于维度的文档中没有任何内容，我也没有在Google上运气。

这样做的目的是我不希望用户将低分辨率照片上传到我的服务器。感谢。

Answer 1

正如 Ray Nicholus 建议的那样，使用getFile方法获取File对象，然后将其与内部实例对象qq.ImageValidation一起使用，以对文件运行fineuploader的验证。必须返回一个promise，因为此proccess是 async 。

function onSubmit(e, id, filename){
    var promise = validateByDimensions(id, [1024, 600]);
    return promise;
}

function validateByDimensions(id, dimensionsArr){
    var deferred = new $.Deferred(),
        file = uploaderElm.fineUploader('getFile', id),
        imageValidator = new qq.ImageValidation(file, function(){}),
        result = imageValidator.validate({
            minWidth  : dimensionsArr[0],
            minHeight : dimensionsArr[1]
        });

    result.done(function(status){
        if( status )
            deferred.reject();
        else
            deferred.resolve();
    });

    return deferred.promise();
}

<小时/>

剩下的问题：

现在我想知道如何显示被拒绝的图像的缩略图，而不将其上传到服务器，UI可以用不同的颜色标记为“无效图像”，但是用户可以看到哪些图像有效，哪些不是......

- 更新 - （关于上述问题）

虽然我没有看到如何将缩略图的默认行为添加到上传器中，但没有上传，但有一种方法可以手动生成缩略图，如下所示：

var img = new Image();
uploaderElm.fineUploader("drawThumbnail", id, img, 200, false);

然后我会自己创建一个要插入qq-upload-list的项目，并自己处理它...但是它仍然不是那么难。

---

更新（获得对尺寸验证的更多控制）

您必须编辑（当前）qq.ImageValidation函数以在私有函数getWidthHeight之外公开。只需将该功能减速更改为：

this.getWidthHeight = function(){

此外，将this.validate函数更改为：

会更好

this.validate = function(limits) {
        var validationEffort = new qq.Promise();

        log("Attempting to validate image.");

        if (hasNonZeroLimits(limits)) {
            this.getWidthHeight().done(function(dimensions){
                var failingLimit = getFailingLimit(limits, dimensions);

                if (failingLimit) {
                    validationEffort.failure({ fail:failingLimit, dimensions:dimensions });
                }
                else {
                    validationEffort.success({ dimensions:dimensions });
                }
            }, validationEffort.success);
        }
        else {
            validationEffort.success();
        }

        return validationEffort;
    };

所以你会得到失败的原因，以及尺寸。总是很高兴有更多的控制权。

现在，我们可以像这样编写自定义验证：

function validateFileDimensions(dimensionsLimits){
    var deferred = new $.Deferred(),
        file = this.holderElm.fineUploader('getFile', id),
        imageValidator = new qq.ImageValidation(file, function(){});

    imageValidator.getWidthHeight().done(function(dimensions){
        var minWidth = dimensions.width > dimensionsLimits.width,
            minHeight = dimensions.height > dimensionsLimits.height;

        // if min-width or min-height satisfied the limits, then approve the image
        if( minWidth || minHeight )
            deferred.resolve();
        else
            deferred.reject();

    });

    return deferred.promise();
}

这种方法提供了更大的灵活性。例如，您希望对纵向图像进行不同于横向图像的验证，您可以轻松识别图像方向并运行自己的自定义代码来执行任何操作。