Java後台輸出流前台接收方案：AJAX + JSON 標準化數據交互

核心問題

Java後台通過輸出流直接輸出數據（非頁面跳轉），前台頁面如何接收並解析這些數據？

標準解決方案

後台實現（Servlet/Controller）

@ResponseBody
@RequestMapping("/api/data")
public void getData(HttpServletResponse response) throws IOException {
    // 設置響應類型為JSON
    response.setContentType("application/json;charset=UTF-8");
    
    // 構建數據對象
    Map<String, Object> result = new HashMap<>();
    result.put("status", "success");
    result.put("message", "操作成功");
    result.put("data", Arrays.asList("項目1", "項目2", "項目3"));
    
    // 序列化為JSON並寫入輸出流
    String json = new ObjectMapper().writeValueAsString(result);
    response.getWriter().write(json);
}

前台接收（AJAX + jQuery）

$.ajax({
    url: '/api/data',
    type: 'GET',
    dataType: 'json',
    success: function(response) {
        if (response.status === 'success') {
            console.log('接收到數據:', response.data);
            // 更新頁面UI
            renderData(response.data);
        }
    },
    error: function(xhr, status, error) {
        console.error('請求失敗:', error);
    }
});

關鍵技術點

替代方案對比

• 原生XMLHttpRequest：無依賴，代碼冗長，需手動JSON.parse()
• Fetch API：現代標準，Promise風格，需Polyfill兼容舊瀏覽器
• WebSocket：雙向通信，適用於實時推送場景，而非單次請求響應

最佳實踐建議

1. 統一響應格式：{code, message, data}
2. 使用成熟JSON庫：Jackson / Gson / Fastjson
3. 異常統一處理：全局異常處理器返回標準錯誤JSON
4. 接口文檔化：Swagger/OpenAPI規範