NET core chunked upload file

Source: Internet
Author: User
Tags button type

After writing the ASP. NET multiple file upload (http://www.cnblogs.com/bestckk/p/5987383.html), I feel this kind of upload still has many flaws, so ... (Omit 10,000 words, no nonsense). I didn't use the traditional ASP. NET, and I chose the Open source ASP. The reason for this is simple, the new beginning of. NET core, the future of. NET and. NET developers, and the hope that. NET will grow better (everyone's pay is getting higher (ˇ?ˇ)).

1. Front-End implementation:

1). HTML:

 1 

2). javascript:

 1 var uploadpath = ""; 2//Start uploading 3 function Uploadstart () {4 var file = $ ("#path") [0].files[0]; 5 ajaxfile (file, 0); 6} 7 function ajaxf Ile (file, i) {8 var name = File.name,//file name 9 size = file.size,//Total size shardsize = 2 * 1024x768 * 1024x768, ten Shardsiz E = 2 * 1024 * 1024,//with 2MB for one shard Shardcount = Math.ceil (size/shardsize);     Total number of slices if (i >= shardcount) {return;14}15//Calculate start and end position of each slice var start = i * shardsize,17 End = Math.min (size, start + shardsize); 18//Constructs a form, FormData is HTML5 new var form = new FormData (); FORM.A Ppend ("Data", File.slice (Start, end)); The slice method is used to cut out a portion of a file by Form.append ("LastModified", file.lastmodified), Form.append ("FileName", name), and the form. Append ("Total", shardcount); Total pieces of Form.append ("index", i + 1);         Current is the first few tablets Uploadpath = file.lastmodified26//ajax Submission File $.ajax ({29 URL: "/upload/uploadfile", Type: "POST", data:form,31 async: True,//asynchronous Processdata:false,//It is important to tell jquery not to process the form contenttype:false,//It is important to specify false to form the correct con Tent-type34 success:function (Result) {+ if (result! = null) {i = result.number++                 ; PNS var num = Math.ceil (i * 100/shardcount); $ ("#output"). Text (num + '% '); 39                     Ajaxfile (file, i); result.mergeok {$ var filepath = $ ("#path"); 42                     Filepath.after (Filepath.clone (). Val ("")); Filepath.remove ();//Empty input file44 $ (' #upfile '). val (' Please select File '); ("Success!!!"); 46}47}48}49}); 50}

The main idea here is to use the slice method of the HTML5 file API to block files, and then new a formdata () object to store the file data, and then recursively call the Ajaxfile method until the upload is complete.

2. Background C #:

 1 using System; 2 using System.Collections.Generic; 3 using System.Linq; 4 using System.Threading.Tasks; 5 using MICROSOFT.ASPNETCORE.MVC; 6 using System.IO; 7 8//For more information on enabling MVC for empty projects, visit http://go.microsoft.com/fwlink/?         linkid=397860 9 Namespace DotNet.Upload.Controllers11 {public class Uploadcontroller:controller13 {14         GET:/&LT;CONTROLLER&GT;/15 public Iactionresult Index () 18  }19 [httppost]21 Public async task<actionresult> UploadFile () () = request.form.files["Data"];24 string lastmodified = request.form["LastModified"].             ToString (), var total = request.form["Total"];26 var filename = request.form["filename"];27 var index = request.form["index"];28 string temporary = Path.Combine (@ "E:\ browser", lastmodified);//Temporary protection      Directory of storage blocks Try31       {if (!  Directory.Exists (temporary)) directory.createdirectory (temporary); string FilePath = Path.Combine (temporary, index. ToString ()); Convert.isdbnull (data)) (Task.run) (() = PNs Stream fs = new FileStream (FilePath, FileMode.Create); CopyTo (FS);}42 bool Mergeok = false;43 if (to                 Tal = = index) Mergeok = await filemerge (lastmodified, fileName); 46                 }47 dictionary<string, object> result = new dictionary<string, object> (); 49 Result. ADD ("number", index), and result.             ADD ("Mergeok", Mergeok); return Json (Result),}54 catch (Exception ex) 55          {56       Directory.delete (temporary);//delete folder ex;58}60}59 asy             NC task<bool> Filemerge (string lastmodified,string fileName) $ {+) bool OK = false;64 try65 {$ var temporary = Path.Combine (@ "E:\ browser", lastmodified);//Temp folder                 Lename = request.form["filename"];//file name "string fileext = path.getextension (filename);//Get file suffix 69 var files = directory.getfiles (temporary);//Get all of the following files var Finalpath = Path.Combine (@ "E:\ browser", Da TeTime.Now.ToString ("Yymmddhhmmss") + Fileext);//The final file name (the file name that is stored in the demo when it is uploaded), the actual operation must not be the same. var fs = new File Stream (Finalpath, FileMode.Create); (x = x.length). ThenBy (x = x))//row order, guaranteed from 0-n Write73 {bytes var = System.IO.File.ReadAllBytes (PA RT), and an await fs. WriTeasync (bytes, 0, bytes. Length); bytes = null;77 System.IO.File.Delete (part);//delete block 78}7 9 fs.             Close (); Directory.delete (temporary);//delete folder Bayi OK = true;82}83      catch (Exception ex) $ {ex;86 throw}87 return ok;88}89 90 }91}

The idea here is to first save each chunk of the file to a temporary folder, and then merge the temporary files with FileStream (the merge must be in order). The back-end methods are all asynchronous (async await is really handy), although I don't know if there's any improvement in efficiency, but it's cool.

Source: Http://pan.baidu.com/s/1bDdsEa

NET core chunked upload file

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.