第十四章 系統元件與結構塑模

內容大綱 學習目標 第一節 導論 第二節 元件圖 第三節 部署圖 第四節 結論

學習目標 詳讀本章，你至少能瞭解： 物件導向系統分析與設計中之系統元件與結構塑模工作。 何謂元件圖、部署圖及其用途。 如何建構元件圖與部署圖及其建構之準則。 如何以元件圖與部署圖進行系統元件與結構塑模。

導論 系統元件與結構塑模主要是以元件圖來表達系統中，一群元件間的靜態結構關係，而以部署圖來表達系統中軟硬體元件間的實體關係。 本章將分別介紹元件圖與部署圖之元件，再介紹其塑模原則。

元件圖 系統元件與結構塑模主要是以元件圖視覺化的表達系統中一群實體元件與實體元件間的靜態結構關係，及說明其建構之細節。 在圖14-1中共有五個元件：index.htm、books.htm、purchase.exe、cart.dll及product.dll。其中，index.htm及books.htm皆為網頁元件，其關係為超連結。purchase.exe是一個CGI執行檔元件，提供books.htm中所呼叫的功能。而cart.dll及product.dll是動態連結函式庫元件，提供purchase.exe在執行時所需動態連結的函式。

圖14-1 元件圖範例

元件圖之元件(1/3) 元件圖主要包括元件、介面與關係。 元件 元件是系統的實體模組，是系統中可被替換的部分，適合提供給一群介面做適當的實現（或稱為實作）。 元件以一個矩形貼上兩個小標籤（小矩形）表示，且需有一個唯一的名稱，名稱置於矩形內部。 元件之名稱有單純的名稱或延伸型的路徑名稱 。 必要時也可以加上一些標籤值或用額外的區隔來表達其詳細資料。

圖14-2a 元件範例

圖14-2b 單純的與延伸型的元件範例

元件圖之元件(2/3) 三種主要元件 部署元件 工作產品元件 執行元件 介面 介面是許多操作（不包含實作）的集合，用來說明類別或元件所做的服務，而其他類別或元件可以透過介面來實作這個類別或元件。 介面常以一小空心圓表示（稱為簡單型式），當然若介面是一個類別，也可以直接以類別符號表達（稱為延伸型式）。

圖14-3 介面範例

元件圖之元件(3/3) 關係 關係是描述元件與元件或元件與介面間的結合關係。 包括 相依 一般化 關聯 實現化

元件圖之塑模原則(1/13) 建構元件圖請參考下列原則： 從狀態圖及活動圖中找出類別的溝通方式，再參考類別圖之關係，可判斷出各元件間之關係，在元件圖中常見的是相依關係。 依UML之可擴充性機制，也可以自訂各元件之造型。 使用工具軟體來管理元件及各元件間的關係，應該是比較好且又有效率的方法。

元件圖之塑模原則(2/13) Booch等人(1999)依不同元件之塑模，分別提出八種元件圖之塑模原則： 塑模執行檔與函式庫 塑模資料表、檔案與文件 塑模應用程式介面 塑模原始碼 塑模系統的原始碼 塑模執行檔版本 塑模實體資料庫 塑模可調適性系統

元件圖之塑模原則(3/13) 塑模執行檔與函式庫 找出實體系統之分割。 用UML所定義的標準元素將任一個執行檔與函式庫塑模成元件。 用介面來塑模相關元件間的使用與實現關係。 塑模執行檔、函式庫與介面間之關係，例如常見的是相依關係。

元件圖之塑模原則(4/13) 圖14-4a中共有personnel.exe、training.dll、salary.dll、retirement.dll及pension.dll五個元件，其中personnel.exe是執行檔元件，而其他四個均是動態函式庫元件。此外，training.dll、salary.dll與retirement.dll等三個函式庫元件提供personnel.exe在執行時所需動態連結的函式，而pension.dll提供retirement.dll所需動態連結的函式。

圖14-4a 以元件圖塑模執行檔 與函式庫之範例

元件圖之塑模原則(5/13) 塑模資料表、檔案與文件 找出實體系統之輔助元件。 用UML所定義的標準元素，將任一個輔助元件塑模成元件。 塑模輔助元件與其他執行檔、函式庫與介面間之關係，例如常見的是相依關係。

元件圖之塑模原則(6/13) 圖14-4b表示personnel.exe是執行檔元件，而personnel.ini是檔案元件，提供personnel.exe執行時之起始設定值；personnel.hlp是文件元件，提供personnel.exe執行時之線上輔助說明。salary.dll是資料表元件，提供salary.dll中的函式所需的資料。

圖14-4b 以元件圖塑模資料表、 檔案與文件之範例

元件圖之塑模原則(7/13) 塑模應用程式介面 找出實體系統之程式界線。 僅展示介面的重要特性，例如可視覺化的部分，而將其他的特性留在介面的說明中描述。 塑模每個API的實現化關係。 圖14-4c表示UseButtom.exe執行元件提供IApplet、IColor、IButton、IEvent四個API介面供其他元件使用。

圖14-4c 以元件圖塑模API之範例

元件圖之塑模原則(8/13) 塑模原始碼 根據開發工具的限制，塑模用於儲存邏輯元素細節的檔案間之相依關係。 上述檔案中可包括標籤值，例如版本、作者、進出入資訊等。 盡可能以開發工具來管理上述檔案間之關係。 圖14-4d描述一個使用ASP撰寫的程式元件product.asp、purchase.asp、orders.asp及confirm.asp等，與fobjvbs.inc程式碼間之相依關係（使用關係），圖中也表達各元件之版本。

圖14-4d 以元件圖塑模原始碼之範例

元件圖之塑模原則(9/13) 塑模系統的原始碼 找出一群有關的原始碼檔案，將其塑造成檔案造型的元件。 對較大之系統，用套件來展示原始碼檔案之群集。 清楚表達原始碼檔案的相關資訊，例如作者、最後更新日期、版本等（可使用工具管理）。 在上述各檔案間用相依關係來塑模。

元件圖之塑模原則(10/13) 圖14-4e描述一個使用C++語言撰寫的財會系統，其中tax.h共有1.0、1.5及2.0三個不同的版本，而ap.cpp檔包含tax.h及ap.h、account.cpp包含ap.cpp、ar.cpp包含tax.h。

圖14-4e 以元件圖塑模系統原始碼之範例

元件圖之塑模原則(11/13) 塑模執行檔版本 找出要塑模的元件群，這包括一節點中之元件或跨節點之元件群（例如執行檔、函式庫、檔案、文件等）。 為元件群中之每一元件塑造其造型。 找出各相關元件間的關係，這包含提供服務元件與接受服務元件間之介面。 在圖14-4f中orders.dll檔提供dbDriver、selfCheck兩個介面供其他元件使用；而cart.dll檔使用dbDriver介面與ado.dll檔。

圖14-4f 以元件圖塑模執行檔版本之範例

元件圖之塑模原則(12/13) 塑模實體資料庫 找出表達邏輯資料庫綱目中之類別。 選擇將這些類別轉換成資料表之策略。 創造出元件之造型，如資料表之元件圖。 盡可能的使用工具幫助您將邏輯設計轉換成實體設計。 圖14-4g表示人力資源資料庫元件是由員工、獎懲、薪資、教育訓練、出勤考核五個資料表元件所組成。

圖14-4g 以元件圖塑模實體資料庫之範例

元件圖之塑模原則(13/13) 塑模可調適性系統 找出元件在節點間移動的實體分配，例如兩資料庫系統做備份的關係。 如果要塑模引發該元件移動的動作，則可用互動圖表達元件案例。 圖14-4h表示伺服器B上的人力資源資料庫被備份至伺服器A上的人力資源資料庫內。

圖14-4h 以元件圖塑模可調適性系統 之範例

表14-1 西子灣公司購物系統案例 的元件(1/2)

表14-1 西子灣公司購物系統案例 的元件(2/2)

元件圖之建構案例(1/2) 找出元件與關係 「使用者介面模組」須透過iBook、iCart、iOrder三個介面完成下列功能：新增訂購項目、修改訂購數量、刪除訂購項目、取消採購訂單、確認採購訂單 三個ActiveX-DLL：「書籍產品型錄物件類別模組」、「購物車物件類別模組」、及「訂單物件類別模組」皆可存取後端資料庫。

元件圖之建構案例(2/2) 繪製元件圖 書籍產品型錄、購物車與訂單三個元件屬執行檔，且皆可存取後端資料庫，因此這三個執行檔與資料庫間有相依關係。 使用者介面需透過iBook、iCart、iOrder三個介面完成訂購功能，所以使用者介面與這三個介面間也分別有相依關係。

圖14-5 西子灣公司購物系統元件圖

部署圖 系統元件與結構塑模主要是以部署圖視覺化的表達系統中，一群實體節點與實體節點間的靜態結構關係，及說明其建構之細節。 圖14-6描述某個系統的運作環境是以區域網路（例如乙太網路）連接六部伺服器主機（Proxy、DHCP、檔案、E-mail、資料庫、網站伺服器），這個區域網路與外界Internet連結的方式是藉由Proxy伺服器透過DSU/CSU節點連接上Internet。

圖14-6 部署圖範例

部署圖之元件(1/4) 節點 節點代表著一種計算資源，也可說是一個硬體 節點是以立方體圖形來表示，它必須有一個唯一的名稱以示區別 。

圖14-7a 節點範例

部署圖之元件(2/4) 節點之名稱是以字串表示，原則上名稱可由文字加上數字與標點符號等組成 。 節點之名稱有單純的名稱或延伸型的路徑名稱。 必要時也可以加上一些標籤值或用額外的區隔來表達其詳細資料（如圖14-7b）。

圖14-7b 單純的與延伸型的節點範例

部署圖之元件(3/4) 連接 連接表示節點間的溝通方式或路徑，也表示節點間之關係，包括相依、關聯等 節點與元件間可能用相依關係，如圖14-8a。圖 14-8a中有purchase節點及order.asp與cart.dll元件。purchase節點會使用order.asp元件所提供的功能，與cart.dll元件中所包含的函式。

圖14-8a 節點與元件之相依關係範例

部署圖之元件(4/4) 節點與節點間最常用的連接是關聯，關聯表達節點間的實體連接，以實線連接兩節點來表達，例如一台應用程式伺服器與一組硬碟陣列之間就有關聯關係如圖14-8b。 圖14-8b表示有用戶端PC（*表示多台）、主控台、應用程式伺服器及磁碟陣列四個節點，用戶端PC與應用程式伺服器間是透過10BASE-T的乙太網路來連結；主控台與應用程式伺服器的連結是透過RS-232的序列線；應用程式伺服器與磁碟陣列的連結是透過BUS匯流排。

圖14-8b 節點間關聯關係之範例

部署圖之塑模原則(1/8) Booch等人(1999)依不同類型系統之結構塑模，分別提出五種部署圖之塑模原則： 塑模處理器與設備 塑模元件的分配 塑模崁入式系統 塑模主從式架構系統 塑模完全分散式架構之系統

部署圖之塑模原則(2/8) 塑模處理器與設備 從系統的部署觀點，找出計算元素，並將之塑模成節點。 若這些元素表達一般性的處理器與設備，則就將其定義成處理器與設備。若這些元素是定義域中之部分詞彙，則將每一個元素用一個適當的圖像定義之。 如同類別塑模一樣，對每一節點考慮其屬性與操作。

圖14-9a 處理與設備之部署圖範例

部署圖之塑模原則(3/8) 塑模元件的分配 對每一個系統中之重要元件，將其分配給一個節點。 對每一個元件考慮其重複的位置，因為有可能將相同種類的元件（例如特定的執行檔與函式庫），同時被放在多個節點上。

部署圖之塑模原則(4/8) 以下列三種方式之一表達部署圖之配置 不要詳細描述配置，可將詳細部分放在節點的說明上。 用相依關係連接節點及其部署之元件。 以區隔來列出部署在節點中之元件。

部署圖之塑模原則(5/8) 圖14-9b表示用戶端-PC（c:表示client，*表示多台）與應用程式伺服器的連結是透過10BASE-T的乙太網路，該節點上會執行purchase.exe應用程式。主控台（c:表示client）與應用程式伺服器的連結是透過RS-232的序列線，該節點上會執行admin.exe及monitor.exe兩個應用程式。應用程式伺服器（s:表示server）與磁碟陣列的連結是透過BUS匯流排，該節點的CPU為Intel P3-1GHz、主記憶體512MB，其上會執行sqladmin.exe及top.exe兩個應用程式。

圖14-9b 元件分配之部署圖範例

部署圖之塑模原則(6/8) 塑模崁入式系統 找出系統的設備及節點。 每一設備塑造一個造型圖像，予以視覺上的區別。 找出處理器及設備的關係。 必要時對某一精密設備再建構一個更詳細的部署圖。 圖14-9c表示一台個人電腦是由九個設備所組成：主機、顯示器、鍵盤、CD-ROM、影像顯示卡、硬式磁碟機、滑鼠、CCD攝影機、網路卡。CCD攝影機與個人電腦之間是使用USB介面連接。

圖14-9c 崁入式系統之部署圖範例

部署圖之塑模原則(7/8) 塑模主從式架構系統 找出伺服器端及客戶端節點。 將與系統行為有密切關係的設備突顯出來。 對每一處理器及設備作一造型圖像，以利視覺上區別。 塑模部署圖中之節點類型。 圖14-9d表示系統為主從式架構，客戶端是藉由資訊站及主控台向伺服器端提出服務要求，提供服務的伺服器端是由二至多台(2..*)Proxy伺服器及四至多台(4..*)一般用途伺服器等設備所組成，各伺服器上執行的服務程式如節點上的英文敘述。

圖14-9d 主從式架構系統之部署圖範例

部署圖之塑模原則(8/8) 塑模完全分散式架構之系統 與上述塑模較單純的主從式架構系統一樣，需先找出系統的處理器及設備。 如果要對系統的執行績效或網路改變對系統的影響做評估，則須將通訊設備描述到某一個可供評估的詳細程度。 用套件的觀念說明節點之邏輯群集。 將這些處理器及設備的網路型態用部署圖繪出。 假如需瞭解系統之動態情況，可就想要瞭解的行為以使用個案圖表達，再以互動圖擴充描述之。

圖14-9e 完全分散式架構之 系統部署圖範例

表14-2 西子灣公司購物系統案例的節點

部署圖之建構案例(1/2) 繪製部屬圖 找出節點： 本案例系統之設計屬三層式主從式架構之Web-based系統，第一層是客戶端的瀏覽器及其硬體；第二層伺服器端是網站伺服器（例如MS-IIS5）；第三層伺服端是資料庫伺服器（例如MS-SQL Server）。 客戶端瀏覽器經由Internet以TCP/IP通訊協定連上網站伺服器，網站伺服器與資料庫伺服器間以100BASE-T網路連接，使用的通訊協定也是TCP/IP，屬於公司內部的Intranet。

部署圖之建構案例(2/2) 找出連接： Client與Web Server及Web Server與Database Server間均是透過TCP/IP網路協定溝通，因此西子灣公司購物系統之部署圖可表達如圖14-10。

圖14-10 西子灣公司購物系統部署圖

結論 系統元件與結構塑模主要是以元件圖與部署圖兩種實體圖表達系統元件與軟硬體間之實體關係，其中元件圖表達系統中一群元件間的靜態結構關係，而部署圖表達系統中軟硬體元件間的實體關係。