桃源资源网

ASP.NET MVC4使用MongoDB制作相册管理
网络编程 2024/11/15 佚名
3 2

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">


运行项目结果如图:


首页创建相册:


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




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


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




《QQ》相册下的图片示例


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




mongodb数据存储结构图:


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




以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。
标签：
ASP.NET,MVC4,MongoDB,相册管理
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！ 如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com
桃源资源网 Design By www.nqtax.com

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

暂无“ASP.NET MVC4使用MongoDB制作相册管理”评论...
www.nqtax.com 桃源资源网
19,905影音资源
44,626技术资源
1,817软件资源
378,645站长资源

友情链接

杰晶网络 DDR爱好者之家 桃源资源网 杰网资源 富贵资源网 南强小屋 铁雪资源网 幽灵资源网 万梅资源网 狼山资源网 白云岛资源网 昆仑资源网 相思资源网 明霞山资源网 内蒙古资源网 黑松山资源网 茶园资源网 饿虎岗资源网 大旗谷资源网 常春岛资源网 岱庙资源网 兴国资源网 快活林资源网 蝙蝠岛资源网 帝王谷资源网 白云城资源网 伏龙阁资源网 清风细雨楼 天枫庄资源网 圆月山庄资源网 无争山庄资源网 神水资源网 移花宫资源网 神剑山庄资源网 无为清净楼资源网 金钱帮资源网 丐帮资源网 华山资源网 极乐门资源网 小李飞刀资源网 凤求凰客栈 风云阁资源网 金狮镖局 鸳鸯亭资源网 千金楼资源网 更多链接
桃源资源网 Design By www.nqtax.com