C語言標準化測試系統
在Web編程技術的學習過程中，我們小組為了深入理解相關技術原理，提升實踐能力，開發了一個基于動態Web工程框架的C語言標準化考試系統。現在，就來和大家分享一下我們的項目經歷。
一、實驗目的剖析
這個項目主要是為了搞清楚Request和response對象的工作原理。Request對象負責和客戶端“交流”，收集客戶端傳來的各種數據，像表單信息、Cookies，甚至服務器端的環境變量都能獲取到。客戶端可以通過表單提交數據，也能在網頁地址后面添加參數來傳遞信息。服務器拿到這些數據后，經過邏輯處理，再用Response對象把信息反饋給用戶，這樣就完成了一次動態交互。同時，我們也希望借此掌握基于Servlet的動態Web工程框架搭建，熟練運用Request、Response等內置對象進行JSP編程。
二、系統設計與實現
（一）開發環境搭建
我們選擇的開發環境包括Microsoft Windows 11操作系統，JDK8、TOMCAT 9作為開發工具，再搭配DreamWeaver CS5或Eclipse Developer for JavaEE進行代碼編寫，這些工具為項目的順利推進提供了有力支持。
（二）代碼實現細節
- 考試頁面（exam.jsp）：考試頁面是考生答題的地方。頁面用JSP編寫，整體風格簡潔明了。它的布局合理，題目排列有序，使用了HTML和CSS進行設計。比如，通過設置
body的字體樣式和邊距，讓頁面看起來更加舒適；h1標簽用于顯示頁面標題，突出主題；每個題目都放在div容器中，設置了合適的邊距和內邊距，使題目之間區分明顯。選項部分，使用input type="radio"創建單選框，搭配label標簽關聯選項文本，方便用戶選擇答案。最后，用一個submit按鈕提交試卷，點擊按鈕后，表單數據會發送到GradeServlet進行處理。
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head><title>C語言標準化測試</title><style>body { font-family: Arial, sans-serif; margin: 20px; }h1 { color: #333; }.question { margin-bottom: 15px; padding: 10px; }.options { margin-left: 20px; }.submit-btn { padding: 10px 20px; background-color: #4CAF50; color: white; border: none; cursor: pointer; font-size: 16px;}</style>
</head>
<body><h1>C語言標準化測試</h1><form action="GradeServlet" method="post"><!-- 題目內容 --><input type="submit" value="提交試卷" class="submit-btn"></form>
</body>
</html>
效果圖：
- 評分Servlet（GradeServlet.java）：評分模塊是整個系統的核心邏輯部分。它繼承自
HttpServlet，通過@WebServlet("/GradeServlet")注解映射到指定的URL。在doPost方法中，首先獲取用戶在考試頁面提交的答案，存放在數組userAnswers中。接著，將用戶答案與預設的正確答案數組ANSWERS進行比對，計算得分。每答對一題得10分，答錯不得分。最后，把得分、答題對錯情況、用戶答案和正確答案等信息通過request.setAttribute方法設置到請求屬性中，再將請求轉發到結果頁面result.jsp。
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;@WebServlet("/GradeServlet")
public class GradeServlet extends HttpServlet {private static final long serialVersionUID = 1L;// 正確答案private static final String[] ANSWERS = {"C", "A", "C", "D", "C","B","A","C","B","A"};private static final int QUESTIONS_COUNT = 10;private static final int SCORE_PER_QUESTION = 10;protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {// 獲取用戶答案String[] userAnswers = new String[QUESTIONS_COUNT];for(int i=0;i<QUESTIONS_COUNT;i++) {userAnswers[i] = request.getParameter("q"+(i+1));}// 計算得分int score = 0;boolean[] correct = new boolean[QUESTIONS_COUNT];for (int i = 0; i < QUESTIONS_COUNT; i++) {if (userAnswers[i] != null && userAnswers[i].equals(ANSWERS[i])) {score += SCORE_PER_QUESTION;correct[i] = true;} else {correct[i] = false;}}// 設置結果屬性request.setAttribute("score", score);request.setAttribute("correct", correct);request.setAttribute("userAnswers", userAnswers);request.setAttribute("answers", ANSWERS);// 轉發到結果頁面request.getRequestDispatcher("result.jsp").forward(request, response);}
}
- 結果頁面（result.jsp）：結果頁面主要用來展示考試成績。頁面同樣是JSP頁面，通過
EL表達式（如${score}）獲取后端傳遞過來的分數信息，并進行顯示。頁面樣式美觀大方，使用了CSS進行精心設計。比如，通過result-page類設置頁面整體布局，讓內容垂直水平居中顯示；result-container類控制結果容器的樣式，添加了邊框圓角和陰影效果；result類突出顯示分數，設置了較大的字體、綠色的文本顏色和背景色；return-btn類為“返回考試頁面”按鈕添加了樣式和交互效果，鼠標懸停時背景色會發生變化。
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head><title>測試結果</title><link rel="stylesheet" href="styles.css">
</head>
<body class="result-page"><div class="container result-container"><h1>您的測試結果</h1><div class="result">您本次C語言測試成績: <strong>${score}</strong> 分 </div><a href="exam.jsp" class="return-btn">返回考試頁面</a></div>
</body>
</html>
.result-page {display: flex;justify-content: center;align-items: center;min-height: 100vh;
}.result-container {text-align: center;padding: 40px 30px;border-radius: 15px;box-shadow: 0 0 20px rgba(0,0,0,0.15);
}.result {font-size: 2.5em;color: #4CAF50;font-weight: bold;margin: 20px 0;padding: 20px;border-radius: 10px;background-color: #e8f5e9;
}.return-btn {display: inline-block;padding: 12px 30px;background-color: #4CAF50;color: white;text-decoration: none;border-radius: 5px;font-size: 1.1em;transition: background-color 0.3s;
}.return-btn:hover {background-color: #45a049;
}
結果界面的效果圖：
（三）項目結構圖
三、項目測試與優化
在測試過程中，遇到了不少問題。比如，當用戶有題目未作答時，會出現NullPointerException錯誤。我們通過在評分邏輯中增加判空處理，解決了這個問題。還有，將項目部署到云端時，由于本地和云端的JDK版本不同，出現了500錯誤。后來把云端的JDK版本改成和本地一致，重新部署后問題就解決了。經過反復測試和優化，系統在瀏覽器中能夠穩定運行，不管是頁面跳轉，還是不同答案輸入下的評分，都準確無誤。
四、項目成果與收獲
（一）系統功能完善
最終，我們成功完成了基于JSP/Servlet的動態Web考試系統。考試頁面能展示C語言標準化試題，評分模塊可以自動評分，結果頁面也能清晰地顯示得分。這個系統雖然還有一些可以優化的地方，但已經基本滿足了C語言標準化測試的需求。
（二）技術能力提升
通過這次實驗，我們深入理解了JSP/Servlet的核心技術，特別是Request/Response對象在Web交互中的關鍵作用。以前對這些技術的理解停留在理論層面，通過實際項目開發，真正掌握了它們的應用。同時，學會了使用EL表達式簡化JSP頁面開發，這讓我們在開發過程中能夠更高效地獲取和顯示數據。
（三）團隊協作經驗
這次項目是團隊合作的成果。小組四人分工明確，各展所長，在遇到問題時一起討論解決。通過這次合作，我們的團隊協作能力得到了很大提升，也為今后的項目積累了寶貴的經驗。
)
