jQuery文件上传控件提交大文件错误

jQuery file upload control submits large files erroneously

本文关键字：文件 错误 提交 jQuery 控件      更新时间：2023-09-26

我有一个blueimp/jQuery文件上传控件的自定义文件上传实现。它工作得很好，除了当我选择多个文件并且其中一个超过最大长度时，它仍然尝试上传超出边界的文件(即使我没有为该特定文件调用data.submit())。

我已经验证了progress事件不会为大的(未提交的)文件触发，但服务器最终报告一个404.13(请求过滤模块配置为拒绝超过请求内容长度的请求)，并且实际提交的其他文件都没有上传。

如何改变我使用jQuery文件上传控件上传有效文件的方式，但忽略大文件?

这是我的代码…它操作一个通过knockout来显示UI元素的模型，因此您不会在下面的代码中看到任何UI操作。

        $('#fileupload').fileupload({
            dataType: 'json',
            url: '/Handlers/UploadHandler.ashx',
            progress: function (e, data) {
                console.log(data.context);
                var progress = parseInt(data.loaded / data.total * 100, 10);
                var file = fileUploadDataModel.files()[data.context];
                file.percentComplete(progress);
            },
            add: function (e, data) {
                $.each(data.files, function (index, file) {
                    var fileModel = new FileModel(file.name, file.size);
                    fileUploadDataModel.files.push(fileModel);
                    data.context = fileUploadDataModel.files().length - 1;
                    if (file.size > opts.maxFileSize) {
                        fileModel.errorMessage('{0} ({1}) exceeds maximum size -- rejected'.format(file.name, friendlyBytes(file.size)));
                        fileModel.percentComplete(0);
                    }
                    else data.submit();
                });
            },
            done: function (e, data) {
                var file = fileUploadDataModel.files()[data.context];
                file.percentComplete(100);
            },
            singleFileUploads: false,
        });

我能够通过标记无效的文件并从数据中删除它们来实现这一点。文件数组，然后提交其余的。这里是固定的代码…

        $('#fileupload').fileupload({
            dataType: 'json',
            url: '/Handlers/UploadHandler.ashx',
            progress: function (e, data) {
                console.log(data.context);
                var progress = parseInt(data.loaded / data.total * 100, 10);
                var file = fileUploadDataModel.files()[data.context];
                file.percentComplete(progress);
            },
            add: function (e, data) {
                var itemsToRemove = [];
                $.each(data.files, function (index, file) {
                    var fileModel = new FileModel(file.name, file.size);
                    fileUploadDataModel.files.push(fileModel);
                    fileModel.sourceIndex = fileUploadDataModel.files().length - 1;
                    file.fileModel = fileModel;
                    if (file.size > opts.maxFileSize) {
                        fileModel.errorMessage('{0} ({1}) exceeds maximum size -- rejected'.format(file.name, friendlyBytes(file.size)));
                        fileModel.percentComplete(0);
                        itemsToRemove.push(index);
                    }
                });
                itemsToRemove = itemsToRemove.reverse();
                for (index in itemsToRemove)
                    data.files.splice(itemsToRemove[index], 1);
                $.each(data.files, function (index, file) {
                    data.context = file.fileModel.sourceIndex;
                    data.submit();
                });
            },
            done: function (e, data) {
                var file = fileUploadDataModel.files()[data.context];
                file.percentComplete(100);
            },
            singleFileUploads: false,
        });
相关文章：