File upload simple implementation is very easy, but want to higher requirements, such as uploading files through Ajax, uploading multiple files at once, the file is relatively large, etc., the pit is not very easy to fill in (for the novice). So here I'm going to implement multiple file uploads via Ajax. Before you start pasting your code, be aware of the points:
1.<input type= "File"/> is must add name, do not know why not add the Name property, background to get the file data (there is a way the great God can remind me in the comment area), and then the multiple attribute, when multiple= " Multiple, the file control can select multiple files that need to be uploaded (<input type= "file" multiple= "multiple," name= "MyFile"/>).
2.form to set Enctype to Multiple/form-data,multipart/form-data: Do not encode characters, you must use this value when using a form that contains a file upload control. A detailed explanation of enctype can be viewed http://www.jb51.net/web/165444.html
3. The key point is that the Ajax parameters are set inside the pit (many people are not aware of many of the Ajax parameters), contenttype and ProcessData need to be set to False,contenttype is required to be a string type, But this is set to False (I do not know why), the online description of ContentType is mostly "ContentType: parameters that require string type, when sending information to the server, the content encoding type defaults to" application/ X-www-form-urlencoded ". This default value is suitable for most applications ", and there is a data to be set to new FormData ($ (') [0]), to see the other parameters of this http://www.cnblogs.com/babietongtianta/p/4543170.html.
Here is a simple foreground code:
<formID= "Uploadform"enctype= "Multipart/form-data"Action= "/login/uploadfile"Method= "POST"> <inputtype= "File"multiple= "multiple"ID= "Personfile"name= "MyFile" /> <Buttontype= "button"ID= "Submitfile"onclick= "UploadFile ()">Submit</Button></form>
//Uploading Files functionUploadFile () {Debugger$.ajax ({URL:'/login/uploadfile ', type:' POST ', Cache:false, Data:NewFormData ($ (' #uploadForm ') [0]), ProcessData:false,//Key pointsContentType:false,//Key pointsSuccessfunction(Result) {if(result.) Check) {alert (Success); } Else{alert (Failed); } varFile = $ ("#PersonFile") File.after (File.clone (). Val ("")); File.remove (); } }); }
Now it's back in the background, my side backstage is to get the file data set through System.Web.HttpContext.Current.Request.Files, after the code I will take the picture as an example.
[HttpPost] PublicActionResult UploadFile () {Result<string> Check =Newresult<string>(); Try{httpfilecollection Files=System.Web.HttpContext.Current.Request.Files; intNumber =0; for(inti =0; I < files. Count; i++) {System.Text.StringBuilder fileName=NewSystem.Text.StringBuilder (); Filename.append (@"D:\"); Filename.append (DateTime.Now.ToString ("YYMMDD")); Filename.append (@"\"); if(!System.IO.Directory.Exists (filename.tostring ())) {System.IO.Directory.CreateDirectory (filename.tostring ()); } filename.append (System.IO.Path.GetFileNameWithoutExtension (Files[i]. FileName)); Filename.append (DateTime.Now.ToString ("Yymmddhhmmss")); Filename.append (System.IO.Path.GetExtension (files[i). FileName)); System.IO.Stream SM=Files[i]. InputStream; if(System.IO.File.Exists (@"d:\ Watermark Log.jpg") {imagehelper.zoomauto (SM, filename.tostring (), -, -,"",@"d:\ Watermark Log.jpg"); } Else{imagehelper.zoomauto (SM, filename.tostring (), -, -,"Watermark Log",""); } BOOLOK =System.IO.File.Exists (filename.tostring ()); if(OK) { number++; } } if(number. Equals (Files. Count)) {check. Message="Upload Success! "; Check. Check=true; } Else{check. Message="failed! "; Check. Check=false; } returnJson (check); } Catch(Exception ex) {check. Message=Ex. ToString (); Check. Check=false; returnJson (check); } }
// <summary> ///return value/// </summary> Public classResult<t> { Public stringMessage {Get;Set; } Public BOOLCheck {Get;Set; } PublicIlist<t> Resultlist {Get;Set; } }
which used to Imagehelper.zoomauto (), this is detections eldest brother wrote the picture processing class, address http://www.cnblogs.com/wu-jian/archive/2011/02/21/1959382.html. Finally there is a pit, that is, the size of an upload data is limited, to remove the limit to 10 20 files simultaneously upload. How do I unblock a limit? It's OK to configure it in Web. config. The code is as follows:
<system.web> <AuthenticationMode= "None" /> <compilationDebug= "true"targetframework= "4.5" /> <!-- - <HttpRuntimeexecutiontimeout= "$"maxRequestLength= "409600"useFullyQualifiedRedirectUrl= "false"minFreeThreads= "8"minLocalRequestFreeThreads= "4"appRequestQueueLimit= "+" /> </system.web>
Put
ASP-File Upload