保存图片到数据库--二进制

本文介绍了如何通过AjaxSubmit()方法将图片文件从视图上传到控制器,并将其保存到数据库中。首先,在数据库中设置image类型的字段。然后,利用FileReader读取选择的图片并显示到img元素上。接着,通过HttpPostedFileBase接收图片数据,转换为byte[]并保存到数据库。最后,展示了如何从数据库检索图片并显示。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

                      保存图片到数据库--二进制

1、 保存图片到数据库,首先需要在数据库设置保存图片的字段的数据类型是image,不同于一般的数据保存,图片属于文件,所有在数据的处理和传递的方法也得需要注意,我这里介绍的是通过插件里面的ajaxSubmit()方法提交form表单来实现把图片文件从试图传递到控制器的方法。
2、 通过设置input标签的属性type=”file”,可以实现点击按钮打开选择图片的窗体。获取到需要保存的图片。
3、 声明一个变量来接收储存选择到的图片,FileReader是文件阅读器。
4、 var imgReader = new FileReader ();
5、 //图片文件 正则表达式过滤
regexImageFilter = /^(?:image/bmp|image/cis-cod|image/gif|image/ief|image/jpeg|image/jpeg|image/jpeg|image/pipeg|image/png|image/svg+xml|image/tiff|image/x-cmu-raster|image/x-cmx|image/x-icon|image/x-portable-anymap|image/x-portable-bitmap|image/x-portable-graymap|image/x-portable-pixmap|image/x-rgb|image/x-xbitmap|image/x-xpixmap|image/x-xwindowdump)$/i;
6、//文件读取 onload事件,当选择到图片时触发,把
imgReader.onload = function (evt) {
//绑定新增图片
$("#IsImgStudentPicture").attr(“src”, evt.target.result);
}
7、 //将选择的图片显示到 img元素上
function loadImgToEimg(imggetFileId) {
//选取选择的图片
var imgfFile = $("#" + imggetFileId).get(0).files[0];
//将选取到的图片加载到image标签中
if (!regexImageFilter.test(imgfFile.type)) {
layer.msg(‘选择的不是一个有效的图片文件’, { icon: 1 });
}
imgReader.readAsDataURL(imgfFile);
}
8、实现了图片的绑定之后去通过ajaxSubmit()方法去把数据传递到控制器,通过fileStudentImage接收
public ActionResult PurchaseOrder(PW_StockIndent pwStockIndent,HttpPostedFileBase fileStudentImage)
{
ReturnJson msg = new ReturnJson();//实例化返回对象
msg.State = false;
try
{
//声明一个byte来保存新增的图片
byte[] imgFile = null;
//判断是否有图片传递过来
if(fileStudentImage != null && fileStudentImage.ContentLength > 0)
{
//判断内容长度是否大于0,如果对于0,说明有图片
//初始化数组的长度,为节省空间,长度由实际上传的图片的长度决定
imgFile = new byte[fileStudentImage.ContentLength];
//读取该图片文件
//将图片转为流结束位置
//将流读取为byte[],参数:byte[],读取开始位置,读取字节数
fileStudentImage.InputStream.Read(imgFile, 0, fileStudentImage.ContentLength);
}
pwStockIndent.PaperBillsNumber = imgFile;
myModel.PW_StockIndent.Add(pwStockIndent);//新增
if (myModel.SaveChanges() > 0){//判断新增是否成功如果新增成功就返回一个true
msg.State = true;
}
}
}
9、如果你想将新增的图片显示出来看一下,可以通过下面代码来实现

$("#IsImgStudentPicture").attr(“src”,"/Stock/StockIndent/GetStudentImage?StockIndentID=" + StockIndentID);//将查询出来的图片绑定到image标签里
//查询图片
public ActionResult GetStudentImage(int StockIndentID)//studentID主键ID
{
try
{
var studentImg = (from tbStudent in myModel.PW_StockIndent
where tbStudent.StockIndentID == StockIndentID
select new
{
tbStudent.PaperBillsNumber
}).Single();
byte[] stuImg = studentImg.PaperBillsNumber;
return File(stuImg, @“image/jpg”);
}
catch (Exception e)
{
Console.WriteLine(e);
return Json(“failed”, JsonRequestBehavior.AllowGet);
}
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值