PluploadMvc
PluploadMvc
contains server side components to make it easy to integrate Plupload into your ASP.NET MVC application. It can be used to deeply integrate Plupload to make it feel like you're using a normal file input field, but you can also just use it for the included PluploadHandler
(also supporting chunked file uploads) + PluploadContext
to easily retrieve the uploaded files.
Installation
The PluploadMvc
package is available at NuGet. To install PluploadMvc
, run the following command in the Package Manager Console:
Install-Package XperiCode.PluploadMvc
Documentation
I will start with some examples of using the various server side components separately, to eventually get to a full integration example. All examples are built off of the Plupload Core API sample from the Plupload website at http://plupload.com/examples/core.
PluploadHandler
PluploadMvc
includes an HttpHandler
that can be used to handle uploaded files that are uploaded by Plupload. It is added to the Web.config
as Plupload.axd
automatically when using NuGet to install the package.
<system.webServer>
<handlers>
<add name="PluploadHandler" path="Plupload.axd" verb="POST" type="XperiCode.PluploadMvc.PluploadHandler, XperiCode.PluploadMvc" />
</handlers>
</system.webServer>
This HttpHandler
can be used to handle file uploads from Plupload. To be able to retrieve the uploaded files later, you need to pass the HttpHandler a reference in the form of a String (I would recommend a Guid). So in javascript, the url option passed to the plupload.Uploader constructor should be something like this:
var uploader = new plupload.Uploader({
// ...
url : "/plupload.axd?reference=13095a38-6841-4204-a2cc-61135d812436",
// ...
});
The URL to the upload handler can be generated in a View (for example to render in a data-attribute to be read by your javascript) using the included UrlHelper extension methods:
@using XperiCode.PluploadMvc
<div data-plupload-url="@Url.PluploadHandler("13095a38-6841-4204-a2cc-61135d812436")">
...
</div>
When you change the url of the upload handler (default is ~/Plupload.axd), you can configure this UrlHelper extension method to output another url using the PluploadConfiguration
class.
The PluploadHandler
will now handle the file uploads (it handles chunked uploads as well as normal uploads), and saves the files to a temporary folder at ~/App_Data/PluploadMvc/13095a38-6841-4204-a2cc-61135d812436/
. This folder is configurable using the static PluploadConfiguration
class.
PluploadContext
To easily retrieve the uploaded files, you can use PluploadContext
. You should not create an instance of this class yourself. Instead, get it off HttpContextBase
by using the provided extension method GetPluploadContext()
. For example, within a Controller
you could use:
using XperiCode.PluploadMvc;
// ...
var pluploadContext = HttpContext.GetPluploadContext();
After acquiring the PluploadContext
, you can use the GetFiles()
method to retrieve the files that were uploaded using the specific reference
:
string reference = "13095a38-6841-4204-a2cc-61135d812436";
var uploadedFiles = pluploadContext.GetFiles(reference);
uploadedFiles
will now contain a list of PluploadFile
objects (inheriting HttpPostedFileBase
) for you to work with. When you're done with the files (for example, you saved them to a database), you can use the DeleteFiles()
method to delete them from the temporary folder. If you don't, they will keep being returned when calling GetFiles()
using the same reference.
pluploadContext.DeleteFiles(reference);
PluploadContext
also has a static method CleanupFiles()
you could use on application startup, to cleanup the temporary ~/App_Data/PluploadMvc/
folder. When using the NuGet package to install PluploadMvc
, this is added to your application automatically by adding PluploadMvcConfig.cs
to the App_Start
folder and using WebActivatorEx to execute it on application startup.
using XperiCode.PluploadMvc;
// ...
PluploadContext.CleanupFiles();
PluploadModelBinder
Examples of a full integration using a ViewModel and ModelBinder are coming, and this can already be found in the sample project on GitHub.
(Unit) testing
When using PluploadMvc
, you can still test your controllers. The HttpContextBase
extension method GetPluploadContext()
returns an IPluploadContext
. To make this return a Mock
, you can use the extension method SetPluploadContext()
first to set your Mock
, so that when GetPluploadContext()
is called in the code under test, it will return your Mock
. Examples of this can be found in the tests of this project on GitHub.
Release notes
v0.3.0
- Reference (to upload and retrieve files with) is now a string for more flexibility.
- Added an UrlHelper extension method to retrieve the URL to the upload handler.
- Introduced the PluploadConfiguration class, to configure the upload path and pluploadhandler path.
- Fixed thrown IOException when uploading chunked file and the file already exists.
v0.2.0
- Added support for chunked uploads
v0.1.1
- Changed Microsoft.AspNet.Mvc dependencies to 5.0.0 (5.2.0 was unnecessary)
v0.1.0
- Initial release
Collaboration
Please report issues if you find any. Pull requests are welcome for documentation and code.