通过自定义数据绑定类实现MVC中图片上传

通过自定义数据绑定类实现MVC中图片上传

2010-10-30 00:17:48
| 分类：
ASP.NET MVC
阅读45

评论0

字号：大
中
小

订阅

在ASP.NET MVC中要实现图片上传，需要自定义数据绑定模型，然后才能把视图中的数据传递到控制器中，要实现自定义数据绑定必须继承IModelBinder接口，并实现该接口中的BindModel方法。图片上传效果如下:



(图片上传)



(图片展示)

一、自定义数据绑定类

public class FileCollectionModelBinder : IModelBinder //继承IModelBinder接口

{

public object BindModel(ControllerContext controllerContext, ModelBindingContext bindingContext) {

if (controllerContext == null) {

throw new ArgumentNullException("controllerContext");

}

if (bindingContext == null) {

throw new ArgumentNullException("bindingContext");

}

//获得文件对象的列表

List<HttpPostedFileBase> files = GetFiles(controllerContext.HttpContext.Request.Files, bindingContext.ModelName);

if (files.Count == 0) {

return null;

}

//判断文件对象的具体类型返回相关的文件数组、文件集合、文件列表

switch (GetCollectionType(bindingContext.ModelType)) {

case CollectionType.Array:

return files.ToArray();

case CollectionType.Collection:

return new Collection<HttpPostedFileBase>(files);

case CollectionType.List:

return files;

default:

throw new InvalidOperationException(String.Format(

CultureInfo.CurrentUICulture, "This model binder does not support the model type '{0}'.", bindingContext.ModelType.FullName));

}

}

//获得文件名称

private static HttpPostedFileBase ChooseFileContentOrNull(HttpPostedFileBase theFile) {

bool fileContainsContent = (theFile.ContentLength != 0 || !String.IsNullOrEmpty(theFile.FileName));

return (fileContainsContent) ? theFile : null;

}

//获得文件具体类型

private static CollectionType GetCollectionType(Type targetType) {

if (targetType == typeof(IEnumerable<HttpPostedFileBase>) || targetType == typeof(HttpPostedFileBase[])) {

return CollectionType.Array;

}

if (targetType == typeof(ICollection<HttpPostedFileBase>) || targetType == typeof(Collection<HttpPostedFileBase>)) {

return CollectionType.Collection;

}

if (targetType == typeof(IList<HttpPostedFileBase>) || targetType == typeof(List<HttpPostedFileBase>)) {

return CollectionType.List;

}

return CollectionType.Unknown;

}

//获得文件对象列表

private static List<HttpPostedFileBase> GetFiles(HttpFileCollectionBase fileCollection, string key) {

// first, check for any files matching the key exactly

List<HttpPostedFileBase> files = fileCollection.AllKeys

.Select((thisKey, index) => (String.Equals(thisKey, key, StringComparison.OrdinalIgnoreCase)) ? index : -1)

.Where(index => index >= 0)

.Select(index => fileCollection[index])

.ToList();

if (files.Count == 0) {

for (int i = 0; ; i++) {

string subKey = String.Format(CultureInfo.InvariantCulture, "{0}[{1}]", key, i);

HttpPostedFileBase thisFile = fileCollection[subKey];

if (thisFile == null) {

break;

}

files.Add(thisFile);

}

}

List<HttpPostedFileBase> filteredFiles = files.ConvertAll((Converter<HttpPostedFileBase, HttpPostedFileBase>)ChooseFileContentOrNull);

return filteredFiles;

}

//注册绑定模型

public static void RegisterBinder(ModelBinderDictionary binders) {

FileCollectionModelBinder binder = new FileCollectionModelBinder();

binders[typeof(HttpPostedFileBase[])] = binder;

binders[typeof(IEnumerable<HttpPostedFileBase>)] = binder;

binders[typeof(ICollection<HttpPostedFileBase>)] = binder;

binders[typeof(IList<HttpPostedFileBase>)] = binder;

binders[typeof(Collection<HttpPostedFileBase>)] = binder;

binders[typeof(List<HttpPostedFileBase>)] = binder;

}

private enum CollectionType {

Array,

Collection,

List,

Unknown

}

}

二、 注册绑定模型

在Global.asax

protected void Application_Start()

{

RegisterRoutes(RouteTable.Routes);

FileCollectionModelBinder.RegisterBinder(ModelBinders.Binders); //调用绑定模型的注册方法

//ModelBinders.Binders.Add(typeof(IEnumerable<HttpPostedFileBase>), new FileCollectionModelBinder());

//ModelBinders.Binders.Add(typeof(IList<HttpPostedFileBase>), new FileCollectionModelBinder());

}

三、控制器中实现

public ActionResult ProcessFiles([ModelBinder(typeof(FileCollectionModelBinder))] IList<HttpPostedFileBase> files)

//public ActionResult ProcessFiles( IList<HttpPostedFileBase> files)

{

foreach (HttpPostedFileBase file in files)

{

if (file.ContentLength != 0)

{

string[] filesplit = file.FileName.Split( '//' ); //把路径拆分成数组

string fileName = filesplit[filesplit.Length - 1]; //最后一项就是文件名称

file.SaveAs(Server.MapPath(@"/Images/") + fileName); //保存到服务器Images目录下

}

}

return RedirectToAction("ImageList"); //跳转到ImageList方法

}

public ActionResult ImageList()

{

var model = Directory.GetFiles(Server.MapPath(@"/Images/")).AsEnumerable (); //获取Images目录下的图片列表

return View(model); //返回到ImageList页面，并传递model

}

四、 上传页面实现


<asp:Content ID="indexContent" ContentPlaceHolderID="MainContent" runat="server">

<p>可以批量上传照片到指定目录，然后显示照片列表。</p>

<% using( var form = Html.BeginForm( "ProcessFiles", "Home", FormMethod.Post, new { enctype = "multipart/form-data"})) {%>

<p><input type="file" name="files" />

<br/>

<input type="file" name="files" />

<br/>

<input type="file" name="files" />

</p>

<input type="submit" value="批量上载照片" />

<% }%>

<% =Html.ActionLink ("照片列表","ImageList") %>

</asp:Content>

五、 显示上传的图片(ImageList.aspx)


<%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<IEnumerable<string>>" %>

<asp:Content ID="aboutContent" ContentPlaceHolderID="MainContent" runat="server">

<h2>照片列表！</h2>

<% foreach (string fileName in Model.ToList ()) { %>

<img src ="<% =fileName %>" alt ="image" width="150" height="100"/>

<% } %>

</asp:Content>