问题
I'm using fineuploader v3.9 UI with the jquery wrapper within a MVC4 application. At this point, I believe that I should only allow files that are 2.5MB, as set by the validatieon sizeLimit property. My current problem is that when I upload a file type that's not supported or a file that's too large I get this error popup:
The error handler doesn't seem to fire, and no breakpoints within my server side code are hit. That being said, when I select a small file, I can stop at a breakpoint in my controller method code and all works fine (successful upload). Any clue as to what's going on with the files that are either too big or not allowed to be uploaded?
Here is all my fineuploader js code from my view. I have events handled for 'complete' and 'submitted', so I can correctly enable/disable buttons during an upload, and these fire just fine. Not sure what's up with the 'error' handler, though. Can I use the 'qq' object reference in the UI jQuery way that I am? It's not used anywhere else, so I'm wondering if this is my issue? Thoughts?
// 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));
});
});
Here is the shell of my server method that's hit during an upload:
[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);
}
}
And my method that returns JSON success message
private JsonResult CreateJsonResult(bool isSuccess)
{
var json = new JsonResult();
json.ContentType = "text/plain";
json.Data = new { success = isSuccess };
return json;
}
This all works correctly in FireFox v24, and Chrome v30 but in IE 9, within the debugging console I see this:
In IE, the submitted and complete events fire, but the upload fails. In the other browsers, the correct max size exceeded error is visible, and no events fire.
回答1:
When using DEBUG the error that I'm getting within IE is a 'Maximum Request Length Exceeded'.
This can be solved (at least for me) is be adding the following values into my project's web.config: The system.web value is in kbs, so this is 1GB, as an example
<system.web>
<httpRuntime maxRequestLength="1048576" />
</system.web>
And if you're hosting in IIS, add the following: maxAllowedContentLength is in bytes.
<system.webServer>
<security>
<requestFiltering>
<requestLimits maxAllowedContentLength="1073741824"></requestLimits>
</requestFiltering>
</security>
</system.webServer>
Now, when I run my application my console output isn't an error but just the appropriate FALSE return.
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>
FURTHER UPDATE Here's a small cut from my FineUploader code showing the 'failedUploadTextDisplay' for the custom error message set within the JSON return.
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'
},
Here's part of the server method that's called by FineUploader. For IE9 and earlier, the client side fileSize validation won't stop the code from getting back up to the server. I've added server side validation where I check the contentlength, and call my method that creates the JSON return.
[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.");
}
Here's the method that creates the JSON return. If an error, I also send back an 'error' property with whatever custom text that I want.
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;
}
回答2:
Your server is returning some sort of invalid response, according to the console message. Note that file size restrictions are not enforced in IE9 and older, as there is no way to determine file size client-side in these browsers. You will need to take a closer look at the network traffic to see what your server is returning, specifically. If you enable the debug option in Fine Uploader, the contents of the response payload will be printed to the javascript console.
来源：https://stackoverflow.com/questions/19252538/fineuploader-error-handling