1

我在 MVC4 应用程序中使用带有 jquery 包装器的fineuploader v3.9 UI。在这一点上,我相信我应该只允许 2.5MB 的文件,由验证 sizeLimit 属性设置。我目前的问题是,当我上传不受支持的文件类型或文件太大时,我会弹出此错误消息:

在此处输入图像描述

错误处理程序似乎没有触发,并且我的服务器端代码中没有断点被命中。话虽如此,当我选择一个小文件时,我可以在我的控制器方法代码中的断点处停止并且一切正常(成功上传)。关于文件太大或不允许上传的任何线索?

从我的角度来看,这是我所有的 Fineuploader js 代码。我为“完成”和“提交”处理了事件,因此我可以在上传期间正确启用/禁用按钮,并且这些按钮很好。不过,不确定“错误”处理程序是怎么回事。我可以在我的 UI jQuery 方式中使用“qq”对象引用吗?它没有在其他任何地方使用,所以我想知道这是我的问题吗?想法?

// Uploader control setup
    var fineuploader = $('#files-upload').fineUploader({            
        request:
        {
            endpoint: '@Url.Action("UploadFile", "Survey")',
            customHeaders: { Accept: 'application/json' },
            params: {
                surveyInstanceId: (function () { return instance; }),
                surveyItemResultId: (function () { return surveyItemResultId; }),
                itemId: (function () { return itemId; }),
                loopingIndex: (function () { return loopingCounter++; })
            }             
        },
        validation: {
            acceptFiles: ['image/*','application/xls','application/pdf', 'text/csv', 'application/vnd.openxmlformats-officedocument.spreadsheetml.template','application/vnd.openxmlformats-officedocument.spreadsheetml.sheet','application/vnd.ms-excel'] , 
            allowedExtensions: ['jpeg', 'jpg', 'gif', 'png', 'bmp', 'csv', 'xls', 'xlsx', 'pdf', 'xlt', 'xltx', 'txt'],
            sizeLimit: 1024*1024*2.5, // 2.5MB
            stopOnFirstInvalidFile: false
        },
        multiple: true,
        text: {
            //uploadButton: '<i class="icon-plus icon-white"></i>Select your upload file(s)'
            uploadButton: 'Select your upload file(s)'
        }   
    }).on('submitted', function(event, id, filename) {
        alert('submitted ' + filename);
        filesToUpload++;
        $(':input[type=button], :input[type=submit], :input[type=reset]').attr('disabled', 'disabled');         
    }).on('complete', function(event, id, filename, responseJSON) {                            
        alert('completed ' + filename);
        uploadedFileCounter++;
        if (filesToUpload == uploadedFileCounter)
        {
            $(':input[type=button], :input[type=submit], :input[type=reset]').removeAttr('disabled');                                                
        }                           
    }).on('error', function(event,id, name, errorReason, xhr) {         
        alert(qq.format("Error on file number {} - {}.  Reason: {}", id, name, errorReason));
    });

});

这是我在上传过程中遇到的服务器方法的外壳:

 [HttpPost]
    public JsonResult UploadFile(HttpPostedFileWrapper qqfile, int surveyInstanceId, int surveyItemResultId, int itemId, int loopingIndex)
    {
        try
        {
            bool isValid = false;               

    // MORE UPLOAD CODE

            if (isSaveValid && isResultItemEntryValid)
                isValid = true;

            return CreateJsonResult(isValid);
        }

    }

还有我返回 JSON 成功消息的方法

  private JsonResult CreateJsonResult(bool isSuccess)
    {
        var json = new JsonResult();
        json.ContentType = "text/plain";
        json.Data = new { success = isSuccess };
        return json;
    }

这一切都在 FireFox v24 和 Chrome v30 中正常工作,但在 IE 9 中,在调试控制台中我看到了这个:

在此处输入图像描述

在 IE 中,提交和完成事件触发,但上传失败。在其他浏览器中,正确的最大大小超出错误是可见的,并且没有事件触发。

4

2 回答 2

2

使用 DEBUG 时,我在 IE 中遇到的错误是“超出最大请求长度”。

这可以解决(至少对我而言)是将以下值添加到我的项目的 web.config 中: system.web 值以 kbs 为单位,因此这是 1GB,例如

<system.web>
    <httpRuntime maxRequestLength="1048576" />
</system.web>

如果您在 IIS 中托管,请添加以下内容: maxAllowedContentLength 以字节为单位。

<system.webServer>
<security>
  <requestFiltering>
    <requestLimits maxAllowedContentLength="1073741824"></requestLimits>
  </requestFiltering>      
</security>
</system.webServer>

现在,当我运行我的应用程序时,我的控制台输出不是错误,而是适当的 FALSE 返回。

LOG: [FineUploader 3.9.0-3] Received 1 files or inputs. 
LOG: [FineUploader 3.9.0-3] Sending upload request for 0 
LOG: [FineUploader 3.9.0-3] Received response for 0_874e4439-c5c0-4b95-970f-16eb1cf89405 
LOG: [FineUploader 3.9.0-3] iframe loaded 
LOG: [FineUploader 3.9.0-3] converting iframe's innerHTML to JSON 
LOG: [FineUploader 3.9.0-3] innerHTML = <PRE>{"success":false}</PRE> 

进一步更新 这是我的 FineUploader 代码的一小部分,显示了 JSON 返回中设置的自定义错误消息的“failedUploadTextDisplay”。

   validation: {
            acceptFiles: ['image/*','application/xls','application/pdf', 'text/csv', 'application/vnd.openxmlformats-officedocument.spreadsheetml.template','application/vnd.openxmlformats-officedocument.spreadsheetml.sheet','application/vnd.ms-excel'] , 
            allowedExtensions: ['jpeg', 'jpg', 'gif', 'png', 'bmp', 'csv', 'xls', 'xlsx', 'pdf', 'xlt', 'xltx', 'txt'],
            sizeLimit: 1024*1024*2.5, // 2.5MB
            stopOnFirstInvalidFile: false
        },  
        failedUploadTextDisplay: {
            mode: 'custom'
        },

这是 FineUploader 调用的服务器方法的一部分。对于 IE9 和更早版本,客户端文件大小验证不会阻止代码返回到服务器。我在检查内容长度的地方添加了服务器端验证,并调用创建 JSON 返回的方法。

   [HttpPost]
    public JsonResult UploadFile(HttpPostedFileWrapper qqfile, int surveyInstanceId, int surveyItemResultId, int itemId, int loopingIndex)
    {
        try
        {
            bool isValid = false;

            // file is too big, throw error.
            if (qqfile.ContentLength > (1024*1024*2.5))
            {
                return CreateJsonResult(false, "File size exceeded, max file is 2.5MB.");                    
            }

这是创建 JSON 返回的方法。如果出现错误,我还会发回带有任何我想要的自定义文本的“错误”属性。

 private JsonResult CreateJsonResult(bool isSuccess, string response = "")
    {
        var json = new JsonResult();
        json.ContentType = "text/plain";

        if (!isSuccess)
        {
            json.Data = new { success = isSuccess, error = response };
        }
        else
        {
            json.Data = new { success = isSuccess };
        }

        return json;
    }
于 2013-10-08T17:23:40.853 回答
1

根据控制台消息,您的服务器正在返回某种无效响应。请注意,在 IE9 和更早版本中不强制执行文件大小限制,因为在这些浏览器中无法在客户端确定文件大小。您需要仔细查看网络流量,以了解您的服务器返回的具体内容。如果您debug在 Fine Uploader 中启用该选项,则响应负载的内容将打印到 javascript 控制台。

于 2013-10-08T16:57:26.430 回答