Ext JS 前端項目遷移後端語言實戰指南：從 .NET 到 Java/PHP 的架構解耦思路

Ext JS 採用「前後端分離」架構，前端通過 AJAX/Store 與後端交互，後端只需提供標準 JSON 接口。本文以簡單 CMS 為例，詳細闡述如何將後端從 .NET (C#) 遷移至 Java、PHP 等任意語言，核心在於統一數據交換協議與路由映射。

核心原則：界面與數據分離

Ext JS 應用中，客戶端腳本（Scripts/ 目錄）與後端語言零耦合。只需將入口頁面（如 index.cshtml）改寫為目標語言模板（index.jsp、index.php），其餘 JS 文件直接復制即可使用。

三種數據提交方式及後端處理

統一響應格式規範

後端必須返回固定結構，Ext JS 才能正常驅動 UI 反饋：

1. 表單錯誤響應

{
    "success": false,
    "errors": {
        "username": "用戶名已存在",
        "email": "郵箱格式不正確"
    }
}

2. 通用數據響應（Store/Grid/Combo/Ajax）

{
    "success": true,
    "total": 100,
    "data": [...],
    "msg": "操作成功"
}

遷移步驟清單

1. 拆分入口頁：將認證邏輯剝離為獨立登錄頁，主頁僅加載 JS/CSS。
2. 定義路由映射：Ext JS Store 的 api 或 proxy.url 對應後端 Controller/Action。
3. 實現統一基類：封裝 JSON 輸出、異常捕獲、權限校驗基類（如 BaseController）。
4. 逐模塊遷移接口：按功能模塊（用戶、產品、訂單）逐個重寫 Controller，複用現有 Service/DAO 層邏輯。
5. 測試驗證：使用 Postman 模擬 Ext JS 請求，對比響應結構是否一致。

權限控制實現

// PHP 示例：基類中統一權限檢查
class BaseController {
    protected function checkPermission($resource, $action) {
        if (!$this->currentUser->can($resource, $action)) {
            $this->jsonResponse(false, null, '權限不足：' . $resource . ':' . $action);
        }
    }
    protected function jsonResponse($success, $data = null, $msg = '', $total = 0) {
        header('Content-Type: application/json; charset=utf-8');
        echo json_encode(compact('success', 'total', 'data', 'msg'));
        exit;
    }
}

Ext.Direct 進階模式

若使用 Ext.Direct，前端調用映射為後端類方法，遷移時只需實現同名類與方法，無需修改任何前端代碼，實現真正的「零修改遷移」。

總結

後端語言遷移的本質是 HTTP 接口契約的保持。只要 Ext JS 前端發送的請求格式、URL、參數名不變，後端返回的 JSON 結構、狀態碼、錯誤碼完全一致，遷移對前端完全透明。建議制定《前後端接口協議文檔》，作為雙方開發與測試的唯一標準。