This article uses the client jQuery-File-Upload plug-in and the server-side Badkload component to Implement Asynchronous Multifile Upload. Example of MVC file upload:
MVC File Upload 01-asynchronous upload using jquery and client verification type and size
MVC File Upload 02-use HttpPostedFileBase to upload multiple files
MVC File Upload 03-use Request. Files to upload multiple Files
The server component used to process file uploads. Backload is used with the client File Upload plug-in (such as jQuery-File-Upload) to initially form a solution for asynchronous File Upload.
● Zero Configuration: Backload provides the default BackloadDemoController to process File Upload requests. If other controllers want to have "super-powerful Backload capabilities for processing uploaded files", they only need to inherit BackloadDemoController.
● Explicit configuration in web. config
● Multiple storage locations are supported: folders, databases (using Entity Framework), and cloud storage (available in the future)
● Save the uploaded file to different locations based on different request contexts
● Save files to different locations based on different types of uploaded files
● Cropping images is supported, and parameters can be configured in web. confgig.
● Supports processing multiple images
● Supports conversion of image types
● Support generating thumbnails
● A unique file name (GUIDs) can be created on the server)
● You can also create a ing between the original file and the modified file and return a friendly name to the client.
● Good scalability: implements the Badkload interface and uses the ExportAttribute feature.
● Security: Add authentication and authorization to the Controller.
● Debuggable: It facilitates breakpoint debugging to discover errors.
...
● Install server Backload:
PM> Install-Package Backload
● If the client chooses to use the jQuery-File-Upload plug-in, install the File Upload plug-in on the client as follows:
PM> Install-Package JQuery_File_Upload_Plugin
PM> Install-Package JQueryFileUpload_Demo_with_Backload
PM> Install-Package JQueryFileUpload_Demo_with_Backload
Close VS and restart it.
Failed to Load file or assembly "WebGrease, Version = 1.5.1.25624, Culture = neutral, PublicKeyToken = 31bf3856ad364e35" or one of its dependencies. The Assembly list definition found does not match the Assembly reference. (Exception from HRESULT: 0x80131040)
Run "uninstall-package-f WebGrease" to uninstall the package, and then download the latest version through "install-package WebGrease". The problem is solved.
● The Client File Upload plug-in jQuery-File-Upload and Backload are only installed through PM> Install-Package JQueryFileUpload_Demo_with_Backload, without any configuration, you can upload multiple files.
● Files are uploaded to the Files folder under the root directory by default. You need the "write" permission for this folder.
1: using System.Web.Mvc;
2:
3: namespace MvcApplication6.Controllers
4: {
5: public class BackloadDemoController : Controller
6: {
7: //
8: // GET: /BackupDemo/
9: public ActionResult Index()
10: {
11: return View();
12: }
13: }
14: }
Expand;} <! DOCTYPE html>
● <Form id = "fileupload" action = "/Backload/UploadHandler" method = "POST" enctype = "multipart/form-data"> place add, cancel, upload, and other buttons
● <Script id = "template-upload" type = "text/x-tmpl"> upload a file list
● Download the file list
● @ Styles. Render ("~ /Content/themes/base/css ")
● @ Styles. Render ("~ /Content/css ")
● @ Styles. Render ("~ /Bundles/fileupload/bootstrap/BasicPlusUI/css ") use the bundeling function of Backloads to register the css required for jQuery File Upload.
● @ Scripts. Render ("~ /Bundles/jquery ")
● @ Scripts. Render ("~ /Bundles/jqueryui ")
● @ Scripts. Render ("~ /Bundles/fileupload/bootstrap/BasicPlusUI/js ") use the bundeling function of Backloads to register the js required for jQuery File Upload.
● Script src = "~ /Scripts/FileUpload/backload. demo. js "> </script> initialize jQuery File Upload
※Http://backload.org/Backload Official Website
※Examples of https://github.com/blackcity/Backload#examples Backload
※Backload on http://nuget.org/packages/Backload/ nuget
※Http://blueimp.github.io/jQuery-File-Upload/ jQuery File Upload Official Website
※Jquery File Upload introduction on github of https://github.com/blueimp/jQuery-File-Upload/wiki
※Jquery File Upload source code on github of https://github.com/blueimp/jQuery-File-Upload
※Mvc case of jQuery File Upload combined with Backload downloaded by https://www.nuget.org/packages/JQueryFileUpload_Demo_with_Backload/