三层架构中ajax,基于mvc三层架构和ajax技术实现最简单的文件上传

这篇博客详细介绍了前端如何通过JavaScript实现文件上传功能,包括文件大小检查和错误处理。同时,它展示了后端如何接收并处理上传的文件,包括文件类型的验证、文件存储路径的创建以及文件保存的实现。博客重点讨论了文件上传过程中的关键步骤和技术细节。

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

前台页面提交文件

文件操作

上传文件

//上传文件

function upFile() {

var file = document.getElementById("UpFile").files[0];

if (!file) {

alert("请选择文件!");

return;

}

var size = file.size / 1024 / 1024;

if (size > 50) {

alert("图片文件不能大于50M");

return;

}

$("#upFileForm").ajaxSubmit({

url: "/File/UploadFile",

type: "post",

dataType: "json",

success: function (data) {

if (data == "" || data == "0") {

alert("上传失败");

}

if (data == "2") {

alert("不支持上传该文件");

} else {

alert(JSON.stringify(data));

}

},

error: function (aa) {

alert(aa);

}

});

}

后台接收和上传

[HttpPost]

public JsonResult UploadFile()

{

HttpRequest request = System.Web.HttpContext.Current.Request;

HttpFileCollection FileCollect = request.Files;

string path = "";//文件的完整路径

//文件保存目录路径

string imgPathName = DateTime.Now.ToString("yyyyMMdd");//以日期为文件存放的上层文件夹名

string savePath = "/upload/file/" + imgPathName + "/";//文件存放的完整路径

//如果文件路径不存在则创建文件夹

if (!Directory.Exists(Server.MapPath(savePath)))

{

Directory.CreateDirectory(Server.MapPath(savePath));

}

//定义允许上传的文件扩展名

Hashtable extTable = new Hashtable();

extTable.Add("file", "doc,docx,xls,xlsx,ppt,htm,html,txt,zip,rar,gz,bz2");

if (FileCollect.Count > 0)//如果集合的数量大于0,多文件上传情况

{

foreach (string str in FileCollect)

{

HttpPostedFile imgFile = FileCollect[str];//用key获取单个文件对象HttpPostedFile

string fileName = imgFile.FileName;//获取文件名

string fileExt = Path.GetExtension(fileName).ToLower();//获取文件后缀名

//判断文件类型是否正确

if (Array.IndexOf(((string)extTable["file"]).Split(','), fileExt.Substring(1).ToLower()) == -1)

{

//文件类型不正确

return Json("2");

}

string imgName = DateTime.Now.ToString("yyyyMMddhhmmss");//文件别名

string imgPath = savePath + imgName + "-" + imgFile.FileName;//构造文件保存路径

string AbsolutePath = Server.MapPath(imgPath);

imgFile.SaveAs(AbsolutePath);//将上传的东西保存

path = imgPath;//获得文件完整路径并返回到前台页面

}

return Json(path);

}

else

{

//上传失败

return Json("0");

}

}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值