通过自定义数据绑定类实现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>