溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》
您好，登錄后才能下訂單哦！
這篇文章主要為大家展示了“asp.net中表單上傳功能如何實現(xiàn)ajax文件異步上傳”，內(nèi)容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領(lǐng)大家一起研究并學習一下“asp.net中表單上傳功能如何實現(xiàn)ajax文件異步上傳”這篇文章吧。
資源下載：
一、jQuery官方下載地址：https://jquery.com/download/
一.表單上傳：
html客戶端部分：
<form action="upload.ashx" method="post" enctype="multipart/form-data"> 選擇文件:<input type="file" name="file1" /><br /> <input type="submit" value="上傳" /> </form>
一般處理程序服務(wù)器端：
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
HttpPostedFile file1 = context.Request.Files["file1"];
helper.uploadFile(file1, "~/upload/");//這里就是對相應(yīng)方法進行調(diào)用
context.Response.Write("ok");//提示執(zhí)行成功
}上傳代碼的封裝：
/// <summary>
/// 上傳圖片
/// </summary>
/// <param name="file">通過form表達提交的文件</param>
/// <param name="virpath">文件要保存的虛擬路徑</param>
public static void uploadImg(HttpPostedFile file,string virpath)
{
if (file.ContentLength > 1024 * 1024 * 4)
{
throw new Exception("文件不能大于4M");
}
string imgtype = Path.GetExtension(file.FileName);
if(imgtype!=".jpg"&&imgtype!=".jpeg") //圖片類型進行限制
{
throw new Exception("請上傳jpg或JPEG圖片");
}
using (Image img = Bitmap.FromStream(file.InputStream))
{
string savepath = HttpContext.Current.Server.MapPath(virpath+file.FileName);
img.Save(savepath);
}
}
/// <summary>
/// 上傳文件
/// </summary>
/// <param name="file">通過form表達提交的文件</param>
/// <param name="virpath">文件要保存的虛擬路徑</param>
public static void uploadFile(HttpPostedFile file, string virpath)
{
if (file.ContentLength > 1024 * 1024 * 6)
{
throw new Exception("文件不能大于6M");
}
string imgtype = Path.GetExtension(file.FileName);
//imgtype對上傳的文件進行限制
if (imgtype != ".zip" && imgtype != ".mp3")
{
throw new Exception("只允許上傳zip、rar....文件");
}
string dirFullPath= HttpContext.Current.Server.MapPath(virpath);
if (!Directory.Exists(dirFullPath))//如果文件夾不存在，則先創(chuàng)建文件夾
{
Directory.CreateDirectory(dirFullPath);
}
file.SaveAs(dirFullPath + file.FileName);
}二.Ajax文件異步上傳：
注明：既然有了表單上傳為什么又要ajax上傳呢？因為表單上傳過程中，整個頁面就刷新了！ajax異步上傳就可以達到只刷新局部位置，下面就簡單看看ajax上傳吧！
html客戶端部分：
<head>
<script src="jquery-2.1.4.js"></script>
<script>
$(function () {
$("#upload").click(function () {
$("#imgWait").show();
var formData = new FormData();
formData.append("myfile", document.getElementById("file1").files[0]);
$.ajax({
url: "upload.ashx",
type: "POST",
data: formData,
/**
*必須false才會自動加上正確的Content-Type
*/
contentType: false,
/**
* 必須false才會避開jQuery對 formdata 的默認處理
* XMLHttpRequest會對 formdata 進行正確的處理
*/
processData: false,
success: function (data) {
if (data.status == "true") {
alert("上傳成功！");
}
if (data.status == "error") {
alert(data.msg);
}
$("#imgWait").hide();
},
error: function () {
alert("上傳失??！");
$("#imgWait").hide();
}
});
});
});
</script>
</head>
<body>
選擇文件:<input type="file" id="file1" /><br />
<input type="button" id="upload" value="上傳" />
<img src="wait.gif" id="imgWait" />
</body>一般處理程序服務(wù)器端：
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/html";
if (context.Request.Files.Count > 0)
{
HttpPostedFile file1 = context.Request.Files["myfile"];
helper.uploadFile(file1, "~/upload/"); //這里引用的是上面封裝的方法
WriteJson(context.Response, "true", "");
}
else
{
WriteJson(context.Response, "error", "請選擇要上傳的文件");
}
}json代碼封裝：
public static void WriteJson(HttpResponse response,
string status1, string msg1, object data1 = null)
{
response.ContentType = "application/json";
var obj = new { status = status1, msg = msg1, data = data1 };
string json = new JavaScriptSerializer().Serialize(obj);
response.Write(json);
}以上是“asp.net中表單上傳功能如何實現(xiàn)ajax文件異步上傳”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學習更多知識，歡迎關(guān)注億速云行業(yè)資訊頻道！
免責聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權(quán)請聯(lián)系站長郵箱：is@yisu.com進行舉報，并提供相關(guān)證據(jù)，一經(jīng)查實，將立刻刪除涉嫌侵權(quán)內(nèi)容。
億速云公眾號
手機網(wǎng)站二維碼