ASP.NET MVC4使用MongoDB制作相册管理

网络编程 2025/11/4 佚名

2 0 1

蝙蝠岛资源网 Design By www.hbtsch.com

ASP.NET MVC4使用MongoDB制作相册管理实例分享

TIPS:1.Image转成Base64保存到mongodb字段
2.数据模型是嵌套的关联

首先定义Model层:

 public class Photo : IEquatable<Photo>
 {
  [Required]
  public string PhotoName { get; set; }


  [Required]
  public string PhotoDescription { get; set; }


  public string ServerPath { get; set; }


  public Photo() { }


  public Photo(string name, string desc)
  {
   PhotoName = name;
   PhotoDescription = desc;
  }


  public bool Equals(Photo other)
  {
   return string.Equals(PhotoName, other.PhotoName);
  }
 }
 
 
public interface IAlbumIterable
 {
  bool HasNext();
  Photo Current();
  Photo Next();
 } 
 
 
 public interface IPhotosAggregable
 {
  IAlbumIterable GetIterator();
 }


 public class AlbumIterator : IAlbumIterable
 {
  private Album collection;
  private int count;


  public AlbumIterator(Album album)
  {
   collection = album;
  }


  public Photo Current()
  {
   if (count < collection.Count)
    return collection[count++];
   else
    throw new IndexOutOfRangeException();
  }


  public bool HasNext()
  {
   if (count < collection.Count - 1)
    return true;
   else
    return false;
  }


  public Photo Next()
  {
   if (HasNext())
    return collection[++count];
   else
    throw new IndexOutOfRangeException();
  }
 } 
 public class Album : IPhotosAggregable
 {
  [BsonId]
  public ObjectId Id { get; set; }


  [Required]
  public string Name { get; set; }


  [Required]
  public string Description { get; set; }


  public string Owner { get; set; }
  public Photo TitlePhoto { get; set; }


  [BsonDateTimeOptions(Kind = DateTimeKind.Local,Representation =BsonType.DateTime)]
  public DateTime CreationTime { get; set; }
  public IList<Photo> Pictures { get; set; }


  public Album() { Pictures = new List<Photo>(); TitlePhoto = new Photo(); }
  public Album(string name, string owner, Photo pic)
  {
   Name = name;
   Owner = owner;
   TitlePhoto = pic;
   Pictures = new List<Photo>();
   TitlePhoto = new Photo();
  }


  public bool InsertPicture(Photo pic)
  {
   if (!Pictures.Contains(pic))
   {
    Pictures.Add(pic);
    return true;
   }
   else
    throw new ArgumentException();
  }


  public bool InsertPictures(List<Photo> photos)
  {
   foreach(var photo in photos)
   {
    if (!Pictures.Contains(photo))
    {
     Pictures.Add(photo);
    }
    else
     throw new ArgumentException();
   }
   return true;
  }


  public bool RemovePicture(Photo pic)
  {
    Pictures.Remove(pic);
    return true;
  }


  public int Count
  {
   get { return Pictures.Count; }
  }


  public Photo this[int index]
  {
   get { return Pictures[index]; }
   set { Pictures[index] = value; }
  }


  public IAlbumIterable GetIterator()
  {
   return new AlbumIterator(this);
  }
 }

Services层的MongoAlbumPerformer.cs和ServerPathFinder.cs代码如下:

 public class MongoAlbumPerformer
 {
  protected static IMongoClient client;
  protected static IMongoDatabase database;
  private static IMongoCollection<Album> collection;
  private string collectionName;

  public MongoAlbumPerformer(string databaseName, string collectionName)
  {
   
   client = new MongoClient(ConfigurationManager.ConnectionStrings["mongoDB"].ConnectionString);
   database = client.GetDatabase(databaseName);
   this.collectionName = collectionName;
   collection = database.GetCollection<Album>(collectionName, new MongoCollectionSettings { AssignIdOnInsert = true });
  }

  public void SetCollection(string collectionName)
  {
   this.collectionName = collectionName;
   collection = database.GetCollection<Album>(collectionName);
  }

  public void CreateAlbum(Album album)
  {
   var document = new Album
   {
    Name = album.Name,
    Owner = HttpContext.Current.User.Identity.Name,
    Description = album.Description,
    CreationTime = DateTime.Now,
    TitlePhoto = album.TitlePhoto,
    Pictures = album.Pictures
   };

   collection.InsertOne(document);
  }

  public List<Album> GetAlbumsByUserName(string username)
  {
   var projection = Builders<Album>.Projection
    .Include(a => a.Name)
    .Include(a => a.Description)
    .Include(a => a.TitlePhoto)
    .Include(a=>a.CreationTime);

   var result = collection
    .Find(a => a.Owner == HttpContext.Current.User.Identity.Name)
    .Project<Album>(projection).ToList();

   return result;
  }

  public Album GetPicturesByAlbumName(string albumName)
  {
   var projection = Builders<Album>.Projection
    .Include(a => a.Pictures);

   var result = collection
    .Find(a => a.Owner == HttpContext.Current.User.Identity.Name & a.Name == albumName)
    .Project<Album>(projection).FirstOrDefault();

   return result;
  }

  public void UpdateAlbumAddPhoto(string albumName, Photo photo)
  {
   var builder = Builders<Album>.Filter;
   var filter = builder.Eq(f => f.Name, albumName) & builder.Eq(f => f.Owner, HttpContext.Current.User.Identity.Name);
   var result = collection.Find(filter).FirstOrDefault();

   if (result == null)
    throw new ArgumentException("No album of supplied name: {0}", albumName);
   else
   {
      var picture = new Photo
      {
       PhotoName = photo.PhotoName,
       PhotoDescription = photo.PhotoDescription,
       ServerPath = photo.ServerPath,
      };

      var update = Builders<Album>.Update.Push(a => a.Pictures, picture);
      collection.UpdateOne(filter, update, new UpdateOptions { IsUpsert=true });
   }
  }

  public void DeletePhotoFromAlbum(string albumName, string photoName)
  {
   var builder = Builders<Album>.Filter;
   var filter = builder.Eq(f => f.Name, albumName) & builder.Eq(f => f.Owner, HttpContext.Current.User.Identity.Name);
   var result = collection.Find(filter).SingleOrDefault();

   if (result == null)
    throw new ArgumentException("No album of supplied name: {0}", albumName);
   else
   {
    var update = Builders<Album>.Update
     .PullFilter(a => a.Pictures, Builders<Photo>.Filter.Eq(p => p.PhotoName, photoName));
    long count = collection.UpdateOne(filter, update).MatchedCount;
   }
  }
 }public class ServerPathFinder
 {
  public string GetBase64ImageString(HttpPostedFileBase file)
  {
   string mime = Regex.Match(file.ContentType, @"(").Value;
   byte[] bytes = new byte[file.ContentLength];
   file.InputStream.Read(bytes, 0, file.ContentLength);
   return string.Format("data:image/{0};base64,{1}",mime, Convert.ToBase64String(bytes));
  }
 }

AlbumController.cs代码如下:

 public class AlbumController : Controller
 {
  MongoAlbumPerformer mongod = new MongoAlbumPerformer("test","albums");

  [HttpPost]
  public ActionResult AlbumPreview(Photo model, HttpPostedFileBase file, string albumName, string delete, string phot)
  {
   if (delete == "false")
   {
    if (file != null)
    {
     if (!file.ContentType.StartsWith("image"))
     {
      ModelState.AddModelError("file", "选择正确的格式照片！");
     }
     else
     {
      ServerPathFinder finder = new ServerPathFinder();
      model.ServerPath = finder.GetBase64ImageString(file);
     }

     if (ModelState.IsValid)
     {
      mongod.UpdateAlbumAddPhoto(albumName, model);
      ModelState.Clear();
     }
    }
   }
   else
   {
    mongod.DeletePhotoFromAlbum(albumName, phot);
    foreach(var error in ModelState.Values)
    {
     error.Errors.Clear();
    }
   }
   ViewBag.AlbumTitle = albumName;
   ViewBag.PhotoList = mongod.GetPicturesByAlbumName(albumName).Pictures;

   return View();
  }

  public ActionResult AlbumPreview(string Name)
  {
   var album = mongod.GetPicturesByAlbumName(Name);
   ViewBag.AlbumTitle = Name;
   ViewBag.PhotoList = album.Pictures;

   return View();
  }

  [HttpPost]
  public ActionResult Create(Album model, HttpPostedFileBase file)
  {
   if (!file.ContentType.StartsWith("image"))
   {
    ModelState.AddModelError("file", "选择正确的格式照片！");
   }
   else
   {
    ServerPathFinder finder = new ServerPathFinder();
    model.TitlePhoto.ServerPath = finder.GetBase64ImageString(file);    
   }

   if (ModelState.IsValid)
   {
    model.Owner = HttpContext.User.Identity.Name;
    mongod.CreateAlbum(model);
   }
   var albums = mongod.GetAlbumsByUserName(HttpContext.User.Identity.Name);
   ViewBag.Albums = albums;

   return View();
  }

  public ActionResult Create()
  {
   var albums = mongod.GetAlbumsByUserName(HttpContext.User.Identity.Name);
   ViewBag.Albums = albums;
   return View();
  }
 }

部分view视图:
Create.cshtml

@{
 ViewBag.Title = "Create";
}

<h2>我的相册</h2>

@Html.Partial("_MyAlbums", (List<Album>)ViewBag.Albums)

@using (Html.BeginForm("Create", "Album", FormMethod.Post, new { enctype = "multipart/form-data" })) 
{
 @Html.AntiForgeryToken()
 
 <div class="form-horizontal">
  <h4>创建新相册： </h4>
  <hr />
  @Html.ValidationSummary(true, "", new { @class = "text-danger" })
  <div class="form-group">
   @Html.LabelFor(model => model.Name, htmlAttributes: new { @class = "control-label col-md-2" })
   <div class="col-md-10">
    @Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control" } })
    @Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
   </div>
  </div>

  <div class="form-group">
   @Html.LabelFor(model => model.Description, htmlAttributes: new { @class = "control-label col-md-2" })
   <div class="col-md-10">
    @Html.EditorFor(model => model.Description, new { htmlAttributes = new { @class = "form-control" } })
    @Html.ValidationMessageFor(model => model.Description, "", new { @class = "text-danger" })
   </div>
  </div>

  <div class="form-group">
   @Html.LabelFor(model => model.TitlePhoto, htmlAttributes: new { @class = "control-label col-md-2" })
   <div class="col-md-10">
    <input type="file" name="file" id="file" style="width: 100%;" data-val="true" data-val-required="要求标题图片."/>
    @Html.ValidationMessage("file",new { @class = "text-danger" })
   </div>
  </div>
  
  <div class="form-group">
   <div class="col-md-offset-2 col-md-10">
    <input type="submit" value="Create" class="btn btn-default" />
   </div>
  </div>
 </div>
}

@section scripts{
 @Scripts.Render("~/bundles/jqueryval")

 <script type="text/javascript">
  $('img').click(function (data) {

  });

 </script>
}AlbumPreview.cshtml
 @{
 ViewBag.Title = "AlbumPreview";
}

@using (Html.BeginForm("AlbumPreview", "Album", FormMethod.Post, new { enctype = "multipart/form-data"}))
{
 @Html.AntiForgeryToken()

 {Html.RenderPartial("_Preview", (List<Photo>)ViewBag.PhotoList);}

 <div class="form-horizontal">
  <br />
  <h4>添加新的照片：</h4>
  <hr />
  @Html.ValidationSummary(true, "", new { @class = "text-danger" })

  <div class="form-group">
   @Html.LabelFor(model => model.PhotoName, htmlAttributes: new { @class = "control-label col-md-2" })
   <div class="col-md-10">
    @Html.EditorFor(model => model.PhotoName, new { htmlAttributes = new { @class = "form-control" } })
    @Html.ValidationMessageFor(model => model.PhotoName, "", new { @class = "text-danger" })
   </div>
  </div>

  <div class="form-group">
   @Html.LabelFor(model => model.PhotoDescription, htmlAttributes: new { @class = "control-label col-md-2" })
   <div class="col-md-10">
    @Html.EditorFor(model => model.PhotoDescription, new { htmlAttributes = new { @class = "form-control" } })
    @Html.ValidationMessageFor(model => model.PhotoDescription, "", new { @class = "text-danger" })
   </div>
  </div>

  <div class="form-group">
   <label class="control-label col-md-2">选择照片：</label>
   <div class="col-md-10">
    <input type="file" name="file" id="file" style="width: 100%;" data-val="true" data-val-required="请选择图像" />
    @Html.ValidationMessage("file", new { @class = "text-danger" })
   </div>
  </div>

  <div class="form-group">
   <div class="col-md-offset-2 col-md-10">
    <input type="submit" value="Create" class="btn btn-default" />
   </div>
  </div>
 </div>
 <input type="hidden" name="albumName" id="albumName" value="@ViewBag.AlbumTitle" />
 <input type="hidden" name="delete" id="delete" value="false" />
 <input type="hidden" name="phot" id="phot" value="sraka" />
}

@section scripts{
 @Scripts.Render("~/bundles/jqueryval")

 <script type="text/javascript">
  $(document).ready(function () {
   var elements = document.getElementsByClassName("btn btn-xs btn-warning cancel");
   for (var i = 0, len = elements.length; i < len; i++) {
    elements[i].addEventListener("click", function () {
     $('#delete').val(true);
     var name = $(this).attr("id");
     $('#phot').val(name);
     $('#' + name).click();
    });
   }
  })
 </script>
}_Preview.cshtml
 @{
 ViewBag.Title = "_Preview";
}

<h2>Album <span style="color:royalblue;font-style:italic">@ViewBag.AlbumTitle</span></h2>

<div class="row">
@foreach (var photo in Model)
{
 <div class="col-md-3">
  <input type="submit" id="@photo.PhotoName" value="删除" class="btn btn-xs btn-warning cancel" style="text-align:center;float:right" />
  <img src="/UploadFiles/2021-04-02/@photo.ServerPath">

运行项目结果如图:
首页创建相册:



《车》相册下的图片示例，可以增加图片，删除图片



《QQ》相册下的图片示例



mongodb数据存储结构图:



以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

ASP.NET,MVC4,MongoDB,相册管理

标签：

ASP.NET,MVC4,MongoDB,相册管理

蝙蝠岛资源网 Design By www.hbtsch.com

广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com

蝙蝠岛资源网 Design By www.hbtsch.com

评论“ASP.NET MVC4使用MongoDB制作相册管理”

暂无ASP.NET MVC4使用MongoDB制作相册管理的评论...

www.hbtsch.com 蝙蝠岛资源网

139,976影音资源

144,792福利资源

21,817软件资源

631,128技术资源

稳了！魔兽国服回归的3条重磅消息！官宣时间再确认！

昨天有一位朋友在大神群里分享，自己亚服账号被封号之后居然弹出了国服的封号信息对话框。

这里面让他访问的是一个国服的战网网址，com.cn和后面的zh都非常明白地表明这就是国服战网。
而他在复制这个网址并且进行登录之后，确实是网易的网址，也就是我们熟悉的停服之后国服发布的暴雪游戏产品运营到期开放退款的说明。这是一件比较奇怪的事情，因为以前都没有出现这样的情况，现在突然提示跳转到国服战网的网址，是不是说明了简体中文客户端已经开始进行更新了呢？

更新日志

2025年11月04日

ASP.NET MVC4使用MongoDB制作相册管理

ASP.NET,MVC4,MongoDB,相册管理

ASP.NET MVC5验证系列之客户端验证

VS2015 Update2 构建 Android 程序问题汇总

评论“ASP.NET MVC4使用MongoDB制作相册管理”

稳了！魔兽国服回归的3条重磅消息！官宣时间再确认！

更新日志

友情链接