问题描述
我在MVC4应用程序中使用了精简加载器v3.9 UI和jquery包装器。在这一点上,我相信我应该只允许由validatieon sizeLimit属性设置的2.5MB的文件。我当前的问题是,当我上传不支持的文件类型或文件太大时,我会收到此错误弹出窗口:
错误处理程序似乎没有触发,并且没有断点我的服务器端代码被击中。话虽如此,当我选择一个小文件时,我可以在我的控制器方法代码的断点停下来,一切正常(成功上传)。任何关于文件太大或不允许上传的情况的线索?
这是我的观点的所有我的精简版加载器js代码。我已经为完整和提交处理了事件,所以我可以在上传期间正确启用/禁用按钮,而这些启动很好。不知道'错误'处理程序的功能。我可以使用UI中的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 ++;})
}
},
验证:{
acceptFiles:[' image / *','application / xls','application / pdf','text / csv','application / vnd.openxmlformats-officedocument.spreadsheetml.template','application / vnd.openxmlformats-officedocument.spreadsheetml.sheet' ,应用/ vnd.ms-EXCE l'],
allowedExtensions:['jpeg','jpg','gif','png','bmp','csv','xls','xlsx','pdf','xlt' ,'xltx','txt'],
sizeLimit:1024 * 1024 * 2.5,// 2.5MB
stopOnFirstInvalidFile:false
},
multiple:true,
文本:{
// uploadButton:'< i class =icon-plus icon-white>< / i>选择您的上传文件'
uploadButton:'选择您的上传文件'
}
})on('submitted',function(event,id,filename){
alert('submitted'+ filename);
filesToUpload ++;
$(':input [type = button],:input [type = submit],:input [type = reset]')attr('disabled','disabled');
$ b uploadFileCounter ++;
如果(filesToUpload(),
})on('complete',function(event,id,filename,responseJSON) == uploadFileCounter)
{
$(':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 {} - {}原因:{},id,name,errorReason));
});
});
这是上传期间我的服务器方法的shell:
[HttpPost]
public JsonResult UploadFile(HttpPostedFileWrapper qqfile,int surveyInstanceId,int surveyItemResultId,int itemId,int loopingIndex)
{
try
{
bool isValid = false;
//更多上传代码
if(isSaveValid&& isResultItemEntryValid)
isValid = true;
返回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中,提交和完成的事件触发,但上传失败。在其他浏览器中,正确的最大大小超出错误是可见的,没有事件触发。
使用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返回。
日志:[FineUploader 3.9.0-3]收到1个文件或输入。
日志:[FineUploader 3.9.0-3]发送上传请求0
日志:[FineUploader 3.9.0-3] 0_874e4439-c5c0-4b95-970f-16eb1cf89405收到的响应
LOG :[FineUploader 3.9.0-3] iframe加载
日志:[FineUploader 3.9.0-3]将iframe的innerHTML转换为JSON
日志:[FineUploader 3.9.0-3] innerHTML =< PRE> { 成功:假}< / PRE>
进一步更新
这是我的FineUploader代码的一个小剪辑显示JSON返回中设置的自定义错误消息的failUploadTextDisplay。
验证:{
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及更早版本,客户端fileSize验证不会阻止代码恢复到服务器。我添加了服务器端验证,在那里我检查contentlength,并调用创建JSON返回的方法。
[HttpPost]
public JsonResult UploadFile(HttpPostedFileWrapper qqfile,int surveyInstanceId,int surveyItemResultId,int itemId,int loopingIndex)
{
try
{
bool isValid = false;
//文件太大,抛出错误。
if(qqfile.ContentLength>(1024 * 1024 * 2.5))
{
返回CreateJsonResult(false,文件大小超过,最大文件是2.5MB);
}
这是创建JSON返回的方法。 if / 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;
}
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.
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 UPDATEHere'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;
}
这篇关于精细加载器错误处理的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!