AJAX (Asynchronous JavaScript and XML) 是一種實現(xiàn)異步通信的技術(shù)，常用于網(wǎng)頁中的數(shù)據(jù)傳輸和頁面更新。而ASHX（.ashx）是一種特殊的處理程序文件，通常用于處理 AJAX 請求中的具體邏輯。AJAX 和 ASHX 在 web 開發(fā)中發(fā)揮了重要作用，特別是在文件上傳的功能中。

在 web 應用中，文件上傳是一個常見且必須的功能。使用傳統(tǒng)的表單提交方式，當用戶選擇文件并點擊“提交”按鈕后，整個頁面會刷新，體驗較差。而使用 AJAX 和 ASHX 技術(shù)，可以實現(xiàn)無刷新上傳文件，提高用戶體驗。

舉個例子來說明：假設(shè)有一個網(wǎng)站，用戶可以上傳圖片并展示在頁面上。用戶選擇圖片后，通過 AJAX 請求將圖片發(fā)送給 ASHX 處理程序，ASHX 處理程序在服務器端將圖片保存到指定位置，并返回圖片的路徑。然后，前端 JavaScript 將返回的圖片路徑插入到頁面中，圖片即刻展示在用戶面前，整個過程完全無需刷新頁面。

在實現(xiàn) AJAX 和 ASHX 文件上傳的過程中，以下是相關(guān)代碼的示例：

// 前端部分
function uploadFile() {
var fileInput = document.getElementById('fileInput');
var file = fileInput.files[0];
var formData = new FormData();
formData.append("file", file);
var xhr = new XMLHttpRequest();
xhr.open("POST", "upload.ashx", true);
xhr.upload.addEventListener("progress", function(e) {
if (e.lengthComputable) {
var percent = Math.round((e.loaded * 100) / e.total);
document.getElementById('progress').innerHTML = percent + "%";
}
}, false);
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
var response = xhr.responseText;
document.getElementById('uploadedImage').src = response;
document.getElementById('progress').innerHTML = "上傳完成！";
}
}
xhr.send(formData);
}
// 后端處理程序（ASHX）
public void ProcessRequest(HttpContext context) {
if (context.Request.Files.Count<= 0)
return;
var file = context.Request.Files[0];
var fileName = Path.GetFileName(file.FileName);
var filePath = "/Uploads/" + fileName;
file.SaveAs(context.Server.MapPath(filePath));
context.Response.Write(filePath);
}

以上是一個簡單的 AJAX 和 ASHX 文件上傳示例。前端部分使用 JavaScript 配合 XMLHttpRequest 對象，將文件以 FormData 格式發(fā)送給服務器。進度條的展示通過監(jiān)聽 upload 事件來實現(xiàn)。后端處理程序（ASHX）通過接收文件并保存到服務器指定位置，然后將文件路徑返回給前端。前端 JavaScript 在接收到文件路徑后，將其插入到頁面中，并更新進度條顯示。整個過程實現(xiàn)了無刷新上傳文件的功能。

綜上所述，AJAX 和 ASHX 技術(shù)在文件上傳功能中起到非常重要的作用。通過 AJAX 和 ASHX，我們可以實現(xiàn)無刷新上傳文件，提高用戶體驗。無論是上傳大型文件還是實時展示上傳進度，AJAX 和 ASHX 都能完美應對。因此，在 web 開發(fā)中，我們應該充分發(fā)揮 AJAX 和 ASHX 的優(yōu)勢，為用戶提供更好的文件上傳體驗。