Asp.Net MVC 上传图片到数据库
【读书笔记】Asp.Net MVC 上传图片到数据库(会的绕行)
之前上传图片的做法都是上传到服务器上的文件夹中,再将url保存到数据库。其实在MVC中将图片上传到数据库很便捷的事情,而且不用去存url了。而且这种方式支持ie6(ie6不支持jquery自动提交form,认为其不安全,这里form是主动点击提交的,所以就没有这个问题,而uploadify自动提交是flash的方式)。
一、建立模型
场景是假设我们需要给一个Product编辑一张图片。在模型中,先定义好两个属性,ImageData和ImageType
![](https://common.cnblogs.com/images/copycode.gif)
- public class Product {
- [HiddenInput(DisplayValue=false)]
- public int ProductID { get; set; }
- [Required(ErrorMessage = "Please enter a product name")]
- public string Name { get; set; }
- [Required(ErrorMessage = "Please enter a description")]
- [DataType(DataType.MultilineText)]// 在前台会渲染成Textarea
- public string Description { get; set; }
- [Required]
- [Range(0.01, double.MaxValue, ErrorMessage = "Please enter a positive price")]
- public decimal Price { get; set; }
- [Required(ErrorMessage = "Please specify a category")]
- public string Category { get; set; }
- public byte[] ImageData { get; set; }
- [HiddenInput(DisplayValue = false)]//会让改属性在编辑的时候不显示出来。
- public string ImageType{ get; set; }
- }
![](https://common.cnblogs.com/images/copycode.gif)
二、存取方法
那在我们的控制器中,这样定义Edit方法。MVC强大的模型绑定机制会自动的将前台form中的数据根据name转换成我们需要的C#对象。当然后台代码这里只是简单的实现,文件大小和类型的判断先略过。
![](https://common.cnblogs.com/images/copycode.gif)
- [HttpPost] //保存
- public ActionResult Edit(Product product, HttpPostedFileBase image) {
- if (ModelState.IsValid) {
- if (image != null) {
- product.ImageType = image.ContentType;//获取图片类型
- product.ImageData = new byte[image.ContentLength];//新建一个长度等于图片大小的二进制地址
- image.InputStream.Read(product.ImageData, 0, image.ContentLength);//将image读取到ImageData中
- }
- // save the product
- repository.UpdateProduct(product);//更新一下 保存模型。
- // add a message to the viewbag
- TempData["message"] = string.Format("{0} has been saved", product.Name);
- // return the user to the list
- return RedirectToAction("Index");
- } else {
- // there is something wrong with the data values
- return View(product);
- }
- }
![](https://common.cnblogs.com/images/copycode.gif)
- HttpPostedFileBase.inputStream 获取一个Stream 对象,该对象指向一个上载文件,以准备读取该文件的内容。
然后通过ID,将二进制转化为图片。
![](https://common.cnblogs.com/images/copycode.gif)
- public FileContentResult GetImage(int productId) {
- Product prod = repository.Products.FirstOrDefault(p => p.ProductID == productId);
- if (prod != null) {
- return File(prod.ImageData, prod.ImageMimeType);//File方法直接将二进制转化为指定类型了。
- } else {
- return null;
- }
- }
![](https://common.cnblogs.com/images/copycode.gif)
FileContentResult 最适合将二进制数据转换成文件,同类型还有FileStreamResult,FilePathResult,这三个都是继承与FileResult。
更详细的解释大家可以参考Artech大神的博客 :了解ASP.Net MVC几种ActionResult的本质
三、前台代码
![](https://common.cnblogs.com/images/copycode.gif)
- @using (Html.BeginForm("Edit", "Admin", FormMethod.Post,
- new { enctype = "multipart/form-data" })) {
- @Html.EditorForModel()
- <div class="editor-label">Image</div>
- <div class="editor-field"><div>Upload new image: <input type="file" name="Image" /></div>
- </div>
- <input type="submit" value="Save" />
- @Html.ActionLink("Cancel and return to List", "Index")
- }
![](https://common.cnblogs.com/images/copycode.gif)
- @Html.EditorForModel() 会根据我们的模型自动渲染出编辑界面,比如是bool型,就会生成checkbox,而不用一条一条去写。不是太复杂的模型可以用这种较为快捷的方式
自动渲染的效果如下(勿喷,未处理样式)
那再获取图片的时候,就可以通过调用GetImage方法来获取。 和获取验证码的方式一样。 这种方式比之前上传写一堆脚本要好很多。
![](https://common.cnblogs.com/images/copycode.gif)
- <div class="item">
- @if (Model.ImageData != null) {
- <div style="float:left;margin-right:20px">
- <img width="75" height="75" src="@Url.Action("GetImage", "Product",
- new { Model.ProductID })" />
- </div>
- }
- .......
- <h4>@Model.Price.ToString("c")</h4>
- </div>
![](https://common.cnblogs.com/images/copycode.gif)
希望这次分享对你有帮助~
参考书籍:Pro Asp.Net MVC3 Framwork
Asp.Net MVC 上传图片到数据库的更多相关文章
- 【读书笔记】Asp.Net MVC 上传图片到数据库(会的绕行)
之前上传图片的做法都是上传到服务器上的文件夹中,再将url保存到数据库.其实在MVC中将图片上传到数据库很便捷的事情,而且不用去存url了.而且这种方式支持ie6(ie6不支持jquery自动提交fo ...
- asp.net MVC SignalR 与数据库 实时同步显示
asp.net MVC SignalR 与数据库 实时同步显示 错误:未启用当前数据库的 SQL Server Service Broker,因此查询通知不受支持.如果希望使用通知,请为此数据库启用 ...
- ASP.NET MVC 4 让数据库自动迁移
今天实际测试了下这个方法,可以保持数据库与实体类同步,同时不会出现数据库迁移的提示.但是只能更改实体类来改变数据库,而不能改数据库来改变实体类.所以这才是Code frist,如果通过改数据库表来改动 ...
- asp.net mvc CodeFirst模式数据库迁移步骤
利用Code First模式构建好基本的类后,项目也开始搭建完毕并成功运行,而且已经将数据库表结构自动生成了. 但是,我有新的类要加入,有字段需要修改,那怎么办呢,删库,跑路 ? 哈哈 利用数据库迁 ...
- 使用EF Code First搭建一个简易ASP.NET MVC网站,允许数据库迁移
本篇使用EF Code First搭建一个简易ASP.NET MVC 4网站,并允许数据库迁移. 创建一个ASP.NET MVC 4 网站. 在Models文件夹内创建Person类. public ...
- Asp.Net MVC上传图片
mvc上传图片 [HttpPost] public JsonResult Upload() { ) { ) { HttpPostedFileBase file = Request.Files[]; ) ...
- asp.net mvc上传图片案例
1.放在ajax.BeginForm里,不好使,同asp.net 表单中 fileupload控件不支持ajax差不多吧,如果异步的话可以借助jquery.form.js,很方便 2. //上传文件 ...
- asp.net MVC上传图片完整方法
图片上传 自动创建文件夹并重命名(带缩略图) 后台: [HttpPost] public ActionResult WanSell_UploadPicture(ProductGalleryModels ...
- ASP.NET MVC上传图片的奇怪问题
本文来源于博客园-钱智慧,转载请注明出处 表现:客户说就华为的手机有问题,而且是在QQ里打开有问题,如果在手机的浏览器上,则可以正常上传图片. 有问题的代码如下: private ResultMode ...
随机推荐
- .net程序调用检测和性能分析工具——DotTrace
DotTrace可以对.net程序进行性能监测,对正在运行的程序和网站监控,主要界面如下: 需要将该工具安装在程序运行的服务器上. 主要用到这个视图,显示了每个方法的时间,下面是反编译出来的代码. P ...
- HDU 3729 I'm Telling the Truth(二部图最大匹配+结果输出)
职务地址:HDU 3729 二分图最大匹配+按字典序输出结果. 仅仅要从数字大的開始匹配就能够保证字典序最大了.群里有人问. . 就顺手写了这题. . 代码例如以下: #include <ios ...
- 用C#绘图实现动画出现卡屏(运行慢)问题的解决办法
原文:用C#绘图实现动画出现卡屏(运行慢)问题的解决办法 正在用C#做一个小游戏,需要用到动画,上次解决的问题是闪烁问题,用双缓冲技术.以为不会有什么问题了.后来当把图片全部绘制上去的时候依然出现了卡 ...
- 模拟linux下的ls -l命令
#include <stdio.h> #include <stdlib.h> #include <string.h> #include <unistd.h&g ...
- SICP 练习 (2.12)解决摘要 :不同的实现时间
SICP 2.12 要求我们定义一个构造函数make-center-percent,它接收两个參数,分别代表中心点和一个误差百分比.我们须要通过这个构造函数产生一个区间.此外还须要定义一个选择函数pe ...
- 第11章 享元模式(Flyweight Pattern)
原文 第11章 享元模式(Flyweight Pattern) 概述: 面向对象的思想很好地解决了抽象性的问题,一般也不会出现性能上的问题.但是在某些情况下,对象的数量可能会太多,从而导致了运行时 ...
- 持续集成Jenkins + robot framework + git
Jenkins + robot framework + git持续集成 一.Jenkins安装插件 进入系统管理—插件管理—可选插件下安装以下插件Git Client Plugin.GIT plugi ...
- 多校训练赛2 ZCC loves cards
ZCC loves cards Time Limit: 4000/2000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others) ...
- hdu 2066 一个人的旅行 最短路径
一个人的旅行 Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Sub ...
- 矿Mac必备软件
1.Svn工具: Cornerstone_v2.7.10 2.iPhone配置文件管理 iPhoneConfigUtility.dmg 3.有道 for mac http://cidian.youda ...