AJAX（Asynchronous JavaScript and XML）是一種在Web應用程序中實現異步數據交互的技術，它通過在不刷新整個頁面的情況下更新部分頁面內容，提供了更加流暢和快速的用戶體驗。同時，JSON（JavaScript Object Notation）是一種輕量級的數據交換格式，它易于閱讀和編寫，并且可以被多種編程語言輕松解析和生成。在本文中，我們將探討如何使用Ajax和JSON將數據傳輸到Servlet，以及如何處理返回的JSON數據。通過舉例說明，在我們的示例應用程序中，我們將實現一個簡單的學生信息管理系統。
首先，讓我們創建一個名為student.jsp的頁面。該頁面包含一個表格，用于顯示學生的姓名和年齡，并提供一個按鈕，用于通過Ajax將學生信息發送到Servlet進行處理。以下是student.jsp的代碼示例：
<html>
<head>
<title>學生信息管理系統</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
function sendData() {
var student = {
"name": $("#name").val(),
"age": $("#age").val()
};
$.ajax({
url: "StudentServlet",
type: "POST",
data: JSON.stringify(student),
contentType: "application/json",
success: function(response) {
alert("學生信息已成功保存！");
},
error: function(xhr) {
alert("保存學生信息時發生錯誤：" + xhr.statusText);
}
});
}
</script>
</head>
<body>
<h1>學生信息管理系統</h1>
<table>
<tr>
<td>姓名：</td>
<td><input type="text" id="name"></td>
</tr>
<tr>
<td>年齡：</td>
<td><input type="text" id="age"></td>
</tr>
</table>
<button onclick="sendData()">保存</button>
</body>
</html>在上面的示例中，我們使用了jQuery庫來簡化代碼編寫。當用戶點擊"保存"按鈕時，sendData函數將通過Ajax將學生信息發送到名為StudentServlet的Servlet。我們將學生信息存儲在一個JavaScript對象中，并使用JSON.stringify將其轉換為JSON字符串。Ajax請求的contentType設置為"application/json"，表示我們將發送JSON數據。
接下來，我們需要創建一個名為StudentServlet的Java Servlet，用于接收并處理通過Ajax發送的學生信息。以下是StudentServlet的簡化代碼示例：
@WebServlet("/StudentServlet")
public class StudentServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// 從請求的輸入流中讀取JSON數據
BufferedReader bufferedReader = request.getReader();
StringBuilder stringBuilder = new StringBuilder();
String line;
while ((line = bufferedReader.readLine()) != null) {
stringBuilder.append(line);
}
bufferedReader.close();
// 將JSON數據解析為Java對象
Gson gson = new Gson();
Student student = gson.fromJson(stringBuilder.toString(), Student.class);
// 處理學生信息
// ...
// 返回JSON響應
response.setContentType("application/json");
PrintWriter writer = response.getWriter();
writer.print("{\"result\": \"success\"}");
writer.flush();
writer.close();
}
}在上面的示例中，我們首先從請求的輸入流中讀取JSON數據，并使用Gson庫將JSON數據解析為Java對象。接下來，我們可以對學生信息進行處理，比如將其存儲到數據庫中。最后，我們通過設置響應的contentType為"application/json"，將處理結果作為JSON響應發送回客戶端。
通過Ajax和JSON的組合，我們可以實現一個高效的數據傳輸和處理機制。無論是在學生信息管理系統還是其他類似應用中，這種技術都能夠極大地提升用戶體驗和性能。