ASP.NET插件uploadify批量上传文件完整使用教程
uploadify批量上传文件完整使用教程，供大家参考，具体内容如下
1.首先准备uploadify的js文件，网上一搜一大堆
2.上传页面UpFilePage.aspx
关键代码：
<html xmlns=\"http://www.w3.org/1999/xhtml\">
<head runat=\"server\">
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\"/>
<title>上传文件</title>
<link href=\"/jquery.uploadify/uploadify.css\" rel=\"stylesheet\" />
<script type=\"text/javascript\" src=\"/jquery.uploadify/jquery-1.8.3.min.js\"></script>
<script src=\"/jquery.uploadify/swfobject.js\" charset=\"utf-8\"></script>
<script src=\"/jquery.uploadify/jquery.uploadify.v2.1.0.js\"></script>
<style type=\"text/css\">
#fileSave { padding-left:5px; padding-right:5px;}
#fileSave .uploadifyQueueItem{ width:530px;}
#fileQueue { padding-left:5px; padding-right:5px;}
#fileQueue .uploadifyQueueItem { width:530px;}
#uploadifyUploader { position:absolute; opacity:0;}
.uploadify-button{ height: 30px; line-height: 30px; width: 109px; text-align:center; border:0px; margin-bottom:5px; background:#ff6600; color:#fff;}
.cancel a { background:url(/jquery.uploadify/cancel.png) no-repeat center center; display:inline-block; width:16px; height:16px;}
</style>
</head>
<body>
<form runat=\"server\">
<div>
<div >
<div>
<input type=\"file\" name=\"uploadify\" />
<div><span>添加文件</span></div>
</div>
<div></div>
<div>
<%=GetFile() %>
</div>
</div>
</div>
</form>
<script type=\"text/javascript\">
var fileCount = 0;
$(document).ready(function () {
fileCount = $(\"#fileSave>div.uploadifyQueueItem\").length;
$(\"input[name=\'radPhone\']:eq(0)\").attr(\"checked\", \"checked\");
$(\"#uploadify\").uploadify({
\'uploader\': \'/jquery.uploadify/uploadify.swf\',//uploadify.swf 文件的相对路径
\'script\': \'/jquery.uploadify/uploadHandler.ashx\',//处理文件的程序
//\'cancelImg\': \'/Scripts/jquery.uploadify/cancel.png\',//取消图片
//\'folder\': \'upfiles\',//上传文件存放的目录
\'queueID\': \'fileQueue\',//文件队列的ID
//\'fileDesc\': \'*.flv;*.mp4;*.wmv;*.avi;*.3gp;*.mpg;*.ppt;*.pptx\',//上传格式限制
//\'fileExt\': \'*.flv;*.mp4;*.wmv;*.avi;*.3gp;*.mpg;*.ppt;*.pptx\',//上传格式限制
\"queueSizeLimit\": \"5\",//当允许多文件生成时，设置选择文件的个数
\'auto\': true,//设置为true当选择文件后就直接上传了
\'multi\': true,//设置为true时可以上传多个文件
\"fileDataName\": \"imgFile\",//设置一个名字，在服务器处理程序中根据该名字来取上传文件的数据
\"sizeLimit\": \"5242880\",//上传文件的大小限制,以字节为单位
\"simUploadLimit\": \"1\",// 允许同时上传的个数 默认值：1
\"onSelect\": function (e, queueId, fileObj) {
fileCount = $(\"#fileSave>div.uploadifyQueueItem\").length;
var less = 5 - fileCount;
if (less <= 0) {
layer.msg(\"最多只能上传5个附件\");
$(\"#a_upload\").attr(\"href\", \"javascript:\");
return false;
} else {
$(\"#a_upload\").attr(\"href\", \"javascript:$(\'#uploadify\').uploadifyUpload()\");
return true;
}
},
\"onComplete\": function () {
$.ajax({
type: \"post\",
url: \"/UploadAction/UploadHandler.ashx\",
data: { operate: \"GetFile\" },
async: false,
success: function (objdata) {
$(\"#fileSave\").html(objdata);
fileCount = $(\"#fileSave>div.uploadifyQueueItem\").length;
var less = 5 - fileCount;
if (less <= 0) {
$(\"#a_upload\").attr(\"href\", \"javascript:\");
$(\"#fileQueue\").html(\"\");
return false;
} else {
$(\"#a_upload\").attr(\"href\", \"javascript:$(\'#uploadify\').uploadifyUpload()\");
return true;
}
}
});
},
\"onCancel\": function () {
fileCount = $(\"#fileSave>div.uploadifyQueueItem\").length;
var less = 5 - fileCount;
if (less <= 0) {
$(\"#a_upload\").attr(\"href\", \"javascript:\");
return false;
} else {
$(\"#a_upload\").attr(\"href\", \"javascript:$(\'#uploadify\').uploadifyUpload()\");
return true;
}
},
});
});
function deleteFile(path) {
$.ajax({
type: \"post\",
url: \"/UploadAction/UploadHandler.ashx\",
data: { operate: \"deleteFile\", file: path },
success: function (objdata) {
$(\"#fileSave\").html(objdata);
fileCount = $(\"#fileSave>div.uploadifyQueueItem\").length;
var less = 5 - fileCount;
if (less <= 0) {
$(\"#a_upload\").attr(\"href\", \"javascript:\");
} else
$(\"#a_upload\").attr(\"href\", \"javascript:$(\'#uploadify\').uploadifyUpload()\");
}
});
}
</script>
</body>
</html>
后台的GetFile()方法：
/// <summary>
/// 获取cookie附件信息
/// </summary>
/// <returns></returns>
protected string GetFile()
{
#region 获取cookie附件信息
StringBuilder strHtml = new StringBuilder();
HttpCookie fileCookie = Request.Cookies[\"FileCookie\"];
if (fileCookie != null)
{
string[] fileArray = new string[1];
if (fileCookie.Value.Contains(\"|\"))
fileArray = fileCookie.Value.Split(\'|\');
else
fileArray[0] = fileCookie.Value;
foreach (string objFile in fileArray)
{
if (!string.IsNullOrEmpty(objFile) && objFile.Contains(\",\"))
{
string[] file = objFile.Split(\',\');
strHtml.Append(@\"<div class=\'uploadifyQueueItem\'>\");
strHtml.Append(@\"<div class=\'cancel\'>\");
strHtml.Append(\"<a href=\'javascript:deleteFile(\\\"\" + file[1] + \"\\\")\'></a>\");
//strHtml.Append(@\"<img src=\'/Scripts/jquery.uploadify/cancel.png\' border=\'0\'>\");
strHtml.Append(@\"</div>\");
strHtml.Append(@\"<span class=\'fileName\'>\" + HttpUtility.UrlDecode(file[0]) + \"</span><span class=\'percentage\'> - 100%</span><div class=\'uploadifyProgress\'>\");
strHtml.Append(@\"<div class=\'uploadifyProgressBar\' style=\'width: 100%;\'>\");
strHtml.Append(@\"</div>\");
strHtml.Append(@\"</div>\");
strHtml.Append(@\"</div>\");
}
}
}
return strHtml.ToString();
#endregion
}
3.UploadAction文件夹下的一般处理程序：
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = \"text/plain\";
string operate = context.Request[\"operate\"];
if (operate == \"deleteFile\")
{
#region 删除文件附件信息
//获取文件路径
string filePath = context.Server.MapPath(context.Request[\"file\"]);
//判断文件是否存在
if (File.Exists(filePath))
File.Delete(filePath);//删除文件
//获取附件cookie信息
HttpCookie fileCookie = context.Request.Cookies[\"FileCookie\"];
string[] fileArray = new string[1];
if (fileCookie != null)
{
filePath = filePath.Remove(0, filePath.IndexOf(\"upfiles\")).Replace(\"\\\\\", \"/\");
if (fileCookie.Value.Contains(\"|\"))
fileArray = fileCookie.Value.Split(\'|\');
else
fileArray[0] = fileCookie.Value;
string strFile = \"\";
for (int i = 0; i < fileArray.Length; i++)
{
if (!fileArray[i].Contains(filePath))
strFile += fileArray[i] + \"|\";
}
if (strFile.Contains(\"|\"))
strFile = strFile.Remove(strFile.Length - 1);
fileCookie.Value = strFile;
fileCookie.Expires = DateTime.Now.AddDays(1);
fileCookie.HttpOnly = true;
context.Response.AppendCookie(fileCookie);
StringBuilder strHtml = new StringBuilder();
if (fileCookie.Value.Contains(\"|\"))
fileArray = fileCookie.Value.Split(\'|\');
else
fileArray[0] = fileCookie.Value;
foreach (string objFile in fileArray)
{
if (!string.IsNullOrEmpty(objFile) && objFile.Contains(\",\"))
{
string[] file = objFile.Split(\',\');
strHtml.Append(@\"<div class=\'uploadifyQueueItem\'>\");
strHtml.Append(@\"<div class=\'cancel\'>\");
strHtml.Append(\"<a href=\'javascript:deleteFile(\\\"\" + file[1] + \"\\\")\'></a>\");
//strHtml.Append(@\"<img src=\'/Scripts/jquery.uploadify-v2.1.0/cancel.png\' border=\'0\'>\");
strHtml.Append(@\"</div>\");
strHtml.Append(@\"<span class=\'fileName\'>\" + HttpUtility.UrlDecode(file[0]) + \"</span><span class=\'percentage\'> - 100%</span><div class=\'uploadifyProgress\'>\");
strHtml.Append(@\"<div class=\'uploadifyProgressBar\' style=\'width: 100%;\'>\");
strHtml.Append(@\"</div>\");
strHtml.Append(@\"</div>\");
strHtml.Append(@\"</div>\");
}
}
context.Response.Write(strHtml.ToString());
}
#endregion
}
else if (operate == \"GetFile\")
{
#region 获取上传的附件并展示
StringBuilder strHtml = new StringBuilder();
HttpCookie fileCookie = context.Request.Cookies[\"FileCookie\"];
if (fileCookie != null)
{
string[] fileArray = new string[1];
if (fileCookie.Value.Contains(\"|\"))
fileArray = fileCookie.Value.Split(\'|\');
else
fileArray[0] = fileCookie.Value;
foreach (string objFile in fileArray)
{
if (!string.IsNullOrEmpty(objFile) && objFile.Contains(\",\"))
{
string[] file = objFile.Split(\',\');
strHtml.Append(@\"<div class=\'uploadifyQueueItem\'>\");
strHtml.Append(@\"<div class=\'cancel\'>\");
strHtml.Append(\"<a href=\'javascript:deleteFile(\\\"\" + file[1] + \"\\\")\'>\");
//strHtml.Append(@\"<img src=\'/Scripts/jquery.uploadify-v2.1.0/cancel.png\' border=\'0\'></a>\");
strHtml.Append(@\"</div>\");
strHtml.Append(@\"<span class=\'fileName\'>\" + HttpUtility.UrlDecode(file[0]) + \"</span><span class=\'percentage\'> - 100%</span><div class=\'uploadifyProgress\'>\");
strHtml.Append(@\"<div class=\'uploadifyProgressBar\' style=\'width: 100%;\'>\");
strHtml.Append(@\"</div>\");
strHtml.Append(@\"</div>\");
strHtml.Append(@\"</div>\");
}
}
}
context.Response.Write(strHtml.ToString());
#endregion
}
}
4.上传文件uploadHandler.ashx一般处理程序代码，文件上传路径可以根据剧情需要自由设定：
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = \"text/plain\";
HttpCookie fileCookie = context.Request.Cookies[\"FileCookie\"];
if (fileCookie != null)
{
string[] fileArray = new string[1];
if (fileCookie.Value.Contains(\"|\"))
fileArray = fileCookie.Value.Split(\'|\');
if (fileArray.Length >= 5)
return;
}
else
{
fileCookie = new HttpCookie(\"FileCookie\");
fileCookie.Value = \"\";
context.Response.Cookies.Add(fileCookie);
}
String aspxUrl = context.Request.Path.Substring(0, context.Request.Path.LastIndexOf(\"/\") + 1);
//文件保存目录路径
String savePath = \"/upfiles/\";
//文件保存目录URL
String saveUrl = \"/upfiles/\";
//if (context.Request.Cookies[\"Member\"] != null)
//{
// savePath += context.Request.Cookies[\"Member\"][\"MemberId\"] + \"/\";
// saveUrl += context.Request.Cookies[\"Member\"][\"MemberId\"] + \"/\";
//}
string Member = Guid.NewGuid().ToString().Trim().Replace(\"-\", \"\");
savePath += Member + \"/\";
saveUrl += Member + \"/\";
//定义允许上传的文件扩展名
/*Hashtable extTable = new Hashtable();
extTable.Add(\"image\", \"gif,jpg,jpeg,png,bmp\");
extTable.Add(\"flash\", \"swf,flv\");
extTable.Add(\"media\", \"swf,flv,mp3,wav,wma,wmv,mid,avi,mpg,asf,rm,rmvb,mp4\");
extTable.Add(\"file\", \"doc,docx,xls,xlsx,ppt,htm,html,txt,zip,rar,gz,bz2,swf,flv,mp3,wav,wma,wmv,mid,avi,mpg,asf,rm,rmvb,mp4,wps\");*/
//最大文件大小
int maxSize = 5242880;
HttpPostedFile imgFile = context.Request.Files[\"imgFile\"];
/*if (imgFile == null)
{
showError(\"请选择文件。\");
}*/
String dirPath = context.Server.MapPath(savePath);
if (!Directory.Exists(dirPath))
{
Directory.CreateDirectory(dirPath);
//showError(\"上传目录不存在。\");
}
String dirName = context.Request.QueryString[\"dir\"];
if (String.IsNullOrEmpty(dirName))
{
dirName = \"file\";
}
/*if (!extTable.ContainsKey(dirName))
{
showError(\"目录名不正确。\");
}*/
String fileName = imgFile.FileName;
String fileExt = Path.GetExtension(fileName).ToLower();
/*if (String.IsNullOrEmpty(fileExt) || Array.IndexOf(((String)extTable[dirName]).Split(\',\'), fileExt.Substring(1).ToLower()) == -1)
{
showError(\"上传文件扩展名是不允许的扩展名。\\n只允许\" + ((String)extTable[dirName]) + \"格式。\");
}
if (dirName.Contains(\"image\"))
{
if (imgFile.InputStream == null || imgFile.InputStream.Length > maxSize)
{
showError(\"上传文件超过5M大小限制。\");
}
}*/
//创建文件夹
dirPath += dirName + \"/\";
saveUrl += dirName + \"/\";
if (!Directory.Exists(dirPath))
{
Directory.CreateDirectory(dirPath);
}
String ymd = DateTime.Now.ToString(\"yyyyMMdd\", DateTimeFormatInfo.InvariantInfo);
dirPath += ymd + \"/\";
saveUrl += ymd + \"/\";
if (!Directory.Exists(dirPath))
{
Directory.CreateDirectory(dirPath);
}
String newFileName = DateTime.Now.ToString(\"yyyyMMddHHmmss_ffff\", DateTimeFormatInfo.InvariantInfo) + fileExt;
String filePath = dirPath + newFileName;
imgFile.SaveAs(filePath);
String fileUrl = saveUrl + newFileName;
/*Hashtable hash = new Hashtable();
hash[\"error\"] = 0;
hash[\"url\"] = fileUrl;
context.Response.AddHeader(\"Content-Type\", \"text/html; charset=UTF-8\");
context.Response.Write(JsonMapper.ToJson(hash));
context.Response.End();*/
if (fileCookie != null)
{
string strFile = fileCookie.Value;
if (!string.IsNullOrEmpty(strFile))
strFile = strFile + \"|\" + HttpUtility.UrlEncode(fileName) + \",\" + fileUrl;
else
strFile = HttpUtility.UrlEncode(fileName) + \",\" + fileUrl;
fileCookie.Value = strFile;
fileCookie.Expires = DateTime.Now.AddDays(1);
fileCookie.HttpOnly = true;
context.Response.AppendCookie(fileCookie);
}
context.Response.Write(\"1\");
context.Response.End();
}
5.所有代码敲完OK，可以收获成果了：
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持phpstudy。
本文地址：https://www.stayed.cn/item/22677
转载请注明出处。
本站部分内容来源于网络,如侵犯到您的权益,请 联系我
我的博客
人生若只如初见，何事秋风悲画扇。
我的标签
随笔档案
- 2024-02(2)
- 2023-06(1)
- 2023-05(1)
- 2023-04(14)
- 2023-03(3)
- 2023-01(6)
- 2022-12(5)
- 2022-11(5)
- 2022-07(2)
- 2022-06(4)
- 2022-05(3)
- 2022-03(1)
- 2021-12(6)
- 2021-11(1)
- 2021-10(3)
- 2021-09(5)
- 2021-07(5)
- 2021-02(2)
- 2021-01(7)
- 2020-12(18)
- 2020-11(14)
- 2020-10(12)
- 2020-09(10)
- 2020-08(22)
- 2020-07(2)
- 2020-06(1)
- 2020-04(5)
- 2020-03(9)
- 2020-02(7)
- 2020-01(9)
- 2019-12(8)
- 2019-11(10)
- 2019-10(11)
- 2019-09(17)
- 2019-08(16)
- 2019-07(6)
- 2019-06(3)
- 2019-04(1)
- 2019-03(8)
- 2019-02(5)
- 2019-01(1)
- 2018-11(2)
- 2018-10(3)
- 2018-09(1)
- 2018-08(3)
- 2018-07(3)
- 2018-06(7)
- 2018-04(4)
- 2018-03(5)
- 2018-02(4)
- 2018-01(22)
- 2017-12(3)
- 2017-11(5)
- 2017-10(15)
- 2017-09(26)
- 2017-08(1)
- 2017-07(3)