您现在的位置：程式碼之家 >> 編程語言 > >> Java 程式設計 >> Java 相關知識

Tapestry 實戰指南（二）：從規劃到組件開發的完整流程

編輯：Java 相關知識

為什麼規劃在 Tapestry 中至關重要？

Tapestry 將 HTML 頁面作為模板，與 Java 組件類、部署描述符緊密綁定。缺乏整體規劃直接編碼，極易陷入「模板與類不同步、導航斷鏈、業務邏輯滲透視圖層」的泥潭。本文梳理一套「三步走」規劃法與組件開發標準流程。

第一階段：應用規劃三部曲

1. 從「做什麼」開始

拒絕「先選技術、後找需求」。核心問題：應用程序要解決什麼業務問題？ 只有明確核心目的，Tapestry 組件才能圍繞「與數據源交互」與「向模板提供數據」兩大職責精準設計。

2. 描繪業務流程並識別組件邊界

以虛構的 BurgerDome 廚房系統為例：

核心目的：讓客戶得到想要的漢堡
業務流程：下單 → 做餡 → 烤胚 → 加料 → 打包遞送
關鍵決策：哪些流程需綁定 Tapestry 組件（如「下單頁面」），哪些屬純業務邏輯（如「烤胚計時器」）？

// Tapestry 組件：負責頁面交互，調用業務對象
public abstract class Order extends BasePage {
    private Order order;  // 業務對象，非 Tapestry 類
    public void placeOrder(int burgerType, int doneness) {
        Burger burger = new Burger(burgerType, doneness);  // 業務邏輯
        Order order = new Order();
        order.addBurger(burger);
        setOrder(order);
        OrderQueue.getInstance().add(order);  // 業務隊列
    }
}

原則：Tapestry 類僅作膠水，業務邏輯零滲透。

3. 繪製導航地圖，消除「孤兒頁面」

用紙筆或流程圖工具畫出所有頁面與跳轉關係。提前發現：

無入口頁面（用戶進不去）
無出口頁面（用戶出不來）
邏輯斷點（如刪除後無重定向目標）

4. 拥抱迭代規劃

規劃不是一次性凍結，而是基線+增量調整。預留變更空間，應對需求漂移與技術發現。

第二階段：HTML 原型驅動開發

1. 從「醜陋」原型開始

清單 2 展示一個無 CSS、無 JS、僅語義化標籤的銷售報表原型。優勢：

利益相關者關注「功能」而非「顏色」
修改結構成本極低（無樣式副作用）
明確標記 `
Prototype Sales Report
` 管理預期

2. 注入真實數據範圍

拒絕 "foo"、"99.95" 等佔位符。根據需求文檔確定：

銷售價格範圍 $50~$5,000 → 原型同時測試兩端值
文本長度 1,500~3,000 字 → 驗證換行、截斷、滾動行為

3. 逐層添加結構元素，為 Tapestry 埋下鉤子

CSS + `
`/`` 劃分區域
關鍵數據點加上 `` —— 未來 `` 的精準落點
JavaScript、圖片、導航鏈接

Tapestry 獨特優勢：原型即模板，無需像 JSP/Servlet 那樣重寫，直接在原型上疊加 Tapestry 標記即可進入開發。

第三階段：構建 Tapestry 組件

1. 前置條件：業務對象已就緒

嚴禁在組件中寫業務邏輯。所有 Service、DAO、Domain Model 應獨立打包、單元測試通過，組件僅調用。

2. 頁面類骨架標準化

package com.burgerdome.display;
import org.apache.tapestry.annotations.*;
import org.apache.tapestry.html.BasePage;

public abstract class Status extends BasePage {
    // 持久屬性：跨請求保留（存於 Session，非數據庫）
    @Persist
    public abstract int getOrderNumber();
    public abstract void setOrderNumber(int orderNumber);

    // 非持久業務對象：每次請求重新查詢，避免臟讀
    public abstract Order getOrder();
    public abstract void setOrder(Order order);

    // 動作方法：響應頁面事件
    public void getStatus() {
        OrderQueue queue = OrderQueue.getInstance();
        Order order = queue.getOrder(getOrderNumber());
        setOrder(order);  // 更新模板綁定對象
    }
}

要點：

類名 = 頁面名（Status.html ↔ Status.java）
繼承 BasePage，類聲明 abstract 讓 Tapestry 生成實現
@Persist 僅用於用戶輸入類不變數據（如訂單號），業務對象勿標註

3. HTML 模板綁定：從靜態到動態

導航鏈接轉換：

<!-- 原始 --> <a href="Home.html">返回</a>
<!-- Tapestry --> <a page="Home" jwcid="@PageLink" href="#">返回</a>

動態數據注入：

<span jwcid="@Insert" value="ognl:totalSales" id="total-sold">1012</span>

jwcid="@Insert"：標記插入點
value="ognl:totalSales"：OGNL 表達式綁定頁面屬性 getTotalSales()
保留原有 id、樣式、佔位文本，設計師可繼續在瀏覽器預覽

4. 兩個核心配置文件

WEB-INF/app.application：

<application>
  <meta key="org.apache.tapestry.page-class-packages" value="com.burgerdome.display"/>
</application>

WEB-INF/web.xml：

<servlet>
  <servlet-name>app</servlet-name>
  <servlet-class>org.apache.tapestry.ApplicationServlet</servlet-class>
  <load-on-startup>0</load-on-startup>
</servlet>
<servlet-mapping>
  <servlet-name>app</servlet-name>
  <url-pattern>/app</url-pattern>
</servlet-mapping>

組件復用策略：為「下一個項目」積累資產

將通用邏輯（如分頁、表單驗證、數據表格）封裝為獨立組件庫
組件接口設計遵循「高內聚、低耦合」：僅暴露必要參數與事件
文檔化組件契約（參數、事件、樣式鉤子），降低團隊接入成本

總結

Tapestry 開發的核心節奏：規劃 → 原型 → 綁定 → 配置。嚴守「業務邏輯不入組件、原型即模板、導航預先圖譜」三大鐵律，配合標準化頁面類模板與 OGNL 綁定，即可實現極低樣板代碼、極高設計師協作友好度的組件化 Web 開發。這套流程思維同樣適用於現代 Wicket、Vaadin 乃至前端組件化框架（React/Vue）的工程化實踐。