第四章 服務導向之分散式網頁表達架構
第五節 頁原型 (P AGE M ODEL )
4.6.2 XSLT 頁 (XSLT Pages)
</p>
表 4 HTML File Format
圖 16 HTML Page Sample
HTML 文件還是可以插入自己定義的一些標籤格式，上面的例子就是${}括號裡 面的東西會另外被轉換為其他 HTML 格式的資訊。轉譯過程中，看到${user}會 去查詢頁脈絡，以正確的 user 值取代之，而看到括號裡是 XML 格式的話，如
${<link></link>}，就會依自定的標籤格式來做轉譯。圖 16為 HTML 頁實作的一 個例子。
4.6.2 XSLT 頁 (XSLT Pages)
XSLT Pages 為動態的頁，它提供動態的 XML 內容，之後將可被 XSL 頁 (XSL Pages) 中的轉譯規則轉換為自定的 XML 標籤格式，最後再經過轉譯成為最後要 輸出的 HTML。XSLT Pages 有內嵌 (In-Line) 模式和一般模式。內嵌模式就是把 XSL Pages 的轉譯規則直接嵌入在 XSLT Page 中。這樣的話在此頁就會轉譯為最 最後的 HTML 格式輸出。而如果是一般模式，它則輸出 XML 格式，並要求瀏覽
器再去請求某 XSL Page 來讓瀏覽器負責轉譯的工作。一般模式的話，藉由 XSL
<service host="localhost" path="symtable"
name="symbol" port="1121"/>
<xsl:template match="symboltable">
表 5 InlineXslt Page Format
上面的例子是股票持有表的例子，結果如圖 17。其中它呼叫一個股票持有 表的服務，得到某種外在的 XML 格式，再用下面的規則對它做轉譯。如果非內 嵌模式的話，頁的 XML 內容則為如下表 6，其中 body 標籤中有個 file 屬性，指 的是所使用的 XSL Page 的路徑。
圖 17 XSLT Page Sample
<page type="xslt">
<cntx name="user"/>
<next name="link1"/>
<service host="localhost" path="symtable"
name="symbol" port="1121"/>
<body file="xsl/symbol">
<img src="logo"/>
<br/>
Hello, {user}
<call service="symbol">
<getSymbolTable user="{user}"/>
</call>
Server Name is {pm.ServerName}
</body>
</page>
表 6 XSLT Page Format 4.6.3 XSL 頁 (XSL Pages)
XSL Pages 為提供轉譯規則的頁。格式就跟標準的 XSLT (XSL Transformation) 格 式一樣。也就是用 XSLT 語法來做為轉譯規則的語言。它跟 HTML Pages 一樣，
都對應到一個檔案，而只是將此檔案的內容依正確的格式寫出，頁的 XML 內容 格式範例如下表 7：
<page type="xsl" file="simpleTime.xsl"/>
表 7 XSL Page Format 4.6.4 影像
Image Pages 為專門提供某個影像的頁，這 念來對待
之。當使用者要求此型態的頁，就跟平常要求一張圖檔的結果是一樣的，影像頁 會依其所對應圖檔的格式將圖檔內容寫回給瀏覽器，看圖檔的格式、副檔名為
4.6.5 複合頁
Composite Pages 的目的為提供彈性的版面配置，就像 HTML 已提供的 frame、frameset 標籤。它用來把其他頁組合起來，而組合的單元為一個頁。特別 要注意的是，每一頁不能因為有可能被他頁組合而有與他頁的相依性存在，例如
頁 (Image Pages)
裡將一個圖檔，也以頁的觀
何，也許是 image/gif 或是 image/jpeg。Image Pages 也跟 HTML Pages 和 XSL Pages 的內容類似，只是對應到另一種格式的檔案，在這裡為圖檔。頁的 XML 內容格 式範例如下表 8：
<page file="night.jpg" type="image"/>
表 8 Image Page Format (Composite Pages)
連結標籤的 target 屬性。在沒有了頁與頁之間的相依性之後，如此頁在概念上才 可被視作為元件，以被任何人來使用。下表 9為一複合頁的例子：
<page type="composite">
<cntx name="user" default="Guest"/>
<cntx name="company"/>
<vsplit framespacing="0" rows="30%,70%"
frameborder="0" border="0">
<page name="top" path="symtblRW">
<cntx name="link1" value="_top"/>
<cntx name="link2" value="bottomLeft"/>
<cntx name="user" value="{user}"/>
</page>
<hsplit cols="40%, 60%">
<page name="bottomLeft" path="profileXslt"/>
<page name="bottomRight" path="chart"/>
</hsplit>
</vsplit>
</page>
表 9 Composite Page Format
此 Composite Page 的範例分成三塊框架。每個框架代表某個路徑下的頁。利用自 定的格式，vsplit、hsplit、page 來作為配置網頁用的標籤，這些也是此類型的頁 的專用標籤，或說是樣版語言 (Template Language)。vsplit 標籤為垂直方向分割，
而 hsplit 為水平方向分割。
4.6.6 支配頁 (Control Pages)
Control Page 用來作為決定顯示何者內容的頁。決定的方式可能依照某程式 邏輯，或是依照網頁當時的狀態。它跟其他類型的頁的不同在於它不是一個本身 具有內容的頁，它不是著重於描繪內容出來，它是決定要用何者內容或是要使用 那一頁的內容做為它的輸出。下表 10為一複合頁的例子：
<page type="control">
<cntx name="user"/>
<cntx name="password"/>
<service host="localhost" name="auth" path="auth"
port="1119"/>
的物件。它代表的是某個遠端的表達服務中的某個頁。Remote Page 物件記錄的 是遠端表達服務主機的位址，表達服務通訊埠，頁的路徑、類型，等等。當某個 Remote Page 被要求寫出回應的時候，它會去跟遠端的表達服務溝通。而它完成 內容的方式，有兩種，一種是嵌入，另一種是連結。嵌入是當遠端的表達服務沒 有伴隨著一個 HTTP 伺服器的時候，或是為了能夠得取網頁中所需的相關檔案，
藉以做進一步的修改時，而採用的方式。而連結是較有效率的方式，寫出的內容 皆為告知瀏覽器直接導向到遠端的此頁所真正存在於的位址 (URL)，但要注意 的是，必須將需要準備好的頁脈絡轉為參數接在連結位址的後面，連結的情形有 三種模式：
1. 直接寫出固定的連結：
當網頁為靜態的類型，像是 Image Page 時，不因為參數或使用者狀態而 對內容有所影響的時候，就可直接通知瀏覽器導向到此頁實際上存於在遠 端的位址。
2. 通知遠端的表達服務後，接著立即寫出導向連結：
傳遞已有的頁脈絡給遠端，叫遠端把某一頁的內容準備好，然後告知使用 者去得取。此種情形為為了表達服務之間有合約在，必須透過約定的表達 服務的觸發，不能讓使用者直接能夠透過瀏覽器得取某頁的內容。
3. 通知遠端的表達服務並需要等到它回應之後，才將連結完成並寫出：
需要跟遠端的表達服務溝通，並得到它的回應，是因為為了要得知遠端的 頁需要有那些被準備好的頁脈絡，以轉為參數接在連結位址之後，也就是 將原本的頁脈絡轉為頁的請求參數形式。動態類型的頁需要採用這種方 式。
而嵌入的方式，是要遠端的頁為把頁的 XML 內容傳遞過來，轉為某型態的 頁，接著再要求它經由傳入的頁脈絡寫出內容，傳給客戶端。
也因為藉由 Remote Page，不論是採用嵌入或是連結的方式，都能夠將頁脈 絡的資訊完整的傳給頁，因此得以達到動態的客製化內容。關於頁中連結 (Link) 的修改需要，可藉由截取頁 (Interception Page) 來完成。
4.6.8 樣版頁 (Template Pages)
Template Pages 被當作一個頁型態 (Type) 來使用比較恰當，像是程式中的 巨集。它並不是能直接被客戶端所要求的頁。它是會被 Interception Page 頁所呼 叫要使用的頁。如下表 11是一個 Template Page 的範例，它需要一個名稱為 inPage 的參數頁。Interception Page 將在下節描述。
<page type="template">
<cntx name="user"/>
<cntx name="range"/>
<cntx name="symbol"/>
<paramPage name="inPage"/>
<vsplit>
這裡，Template Page 寫出的內容跟 Composite Page 很像，以使用者介面的 角度來說，它一樣也是把頁當做組合的單元。
4.6.9 截取頁 (Interception Pages)
Interception Page 為用來呼叫 Template Page 或是其他類型的頁的頁，無法由 自己產生內容。它負責把需要填入的參數頁和相關資訊準備好，然後去使用某一 個 Template Page，或是使用某一頁，並修改此頁的連結內容、圖示、文字，等 等。Interception 頁是為了能夠得到對連結 (Link) 完全的控制，使得可以彈性的 改變連結內容，藉以達成客製化的目的。通常前端與後端服務之間難以消除的耦 合，就在於後端服務動態的產生連結資訊。Interception 頁可用來對於一個遠端頁 產生的內容再做適當的修改，以得到正確的內容，就像遠端頁中 Charting Service 產生圖檔的連結資訊之後，也許需要被適當的修改。使用 Template Page 的好處
就是許多相同版面的設計不用重複寫好多次，而讓 Template Page 變成像是一種 樣板。
當此 Interception Page 使用某一個 Template Page，它會呼叫 Template Page 去把內容寫出來給它，它再把內容寫回給呼叫它的人。 有時 Interception Page 的使用上，不一定是一個頁，而可能是其他動態頁，如 XSLT 頁，動態依規則轉 換而成 Interception 頁的格式，進而再被做一次轉譯的處理。
<page type="interception" use="test/template">
<cntx name="user"/>
<cntx name="currentSymbol"/>
<paramPage name="inPage" value="main/main">
<map from="portfolio" to="profile"/>
</paramPage>
</page>
表 12 Interception Page Format
如上表 12是一個 Interception Page 的例子，有一個名稱為 inPage 的參數頁，
此參數頁的路徑為 main/main。對於每一參數頁或使用的頁，可以設定其中的連 結被對應的修改。這些資訊都將放在頁脈絡裡，交給 test/template 這個路徑的 Template Page 來把內容完成。這裡範例中使用的 Template 頁，就是在上一節中 介紹樣版頁時使用的例子。
如下表 13，則不是使用一個樣版頁，而是使用其他一般的頁。它使用另一 頁做為它的內容，但多了一些不同的是，它可以去修改一些內容。不可避免的，
要使用遠端頁，通常會需要修改連結的路徑。圖 18顯示出截取頁修改路徑的例 子。
<page type=”interception” use=”charter/chartRW”>
<ctnx name=”user”/>
<cntx name=”currentSymbol”/>
<map from=”charter/index” to=”main”/>
</page>
表 13 Interception Page Format
圖 18 Interception Page Replace Link Sample 4.6.10 改寫頁 (Rewrite Pages)
Rewrite Pages 跟 XSLT Pages 所要達到的目的是一樣的，都是為了能夠將 XML 內容做重新轉述為被接受的格式。只是這裡所用的轉譯規則不是採用標準 的 XSLT 語法。而是自己提供的規則導向引擎 (Rule Engine) 來做重寫 XML 內 容的動作。要做 XML 格式重寫的動作，必須提供 Rule Engine 二個輸入，一個 是規則集合 (Rule Set)，一個是要被重寫的 Xml。下面是一個範例：<body>標籤 為一個 XML 架構。它會依照下面的規則被做轉寫。規則集合裡可包含任意多寡 的規則。配對規則的順序可以是依照規則寫的順序。而配對到某一個規則的時 候，有可能再將片段的 XML 去做重新的規則配對。當配對到的時候，就會傳回 被改寫的 XML。如下表 14，為一項重寫規則的定義。
<rule>
<if>
<tablerow>
<symbol cost="@cost" name="@name"
shares="@shares" symbol="@sym"/>
</tablerow>
</if>
<tr>
<td> <rw:txt name="@name"/> </td>
<td>
<link name="link1"
path="example/portfolio/profile">
<cntx name="company" value="@sym"/>
<rw:txt name="@sym"/>
</link>
</td>
<td> <rw:txt name="@shares"/> </td>
<td> <rw:txt name="@cost"/> </td>
<td> <rw:txt name="@cost"/> </td>